Ventana pop-up interactiva

Esta ventana emergente o pop-up lleva por nombre: Popup-Trombone. Es una ventana pop-up interactiva, tiene música de Trombone, pero no suena al momento de aparecer en el navegador. Como, sí lo hacen la mayoría de estas molestas ventanas.

Para hacer tocar el trombón debes de cambiar el tamaño de la ventana pop-up. Colocas el puntero del ratón en extremo derecho de la ventana, arrastras y sueltas el puntero, en el lugar donde tu quieras.

Al hacer grande la ventana pop-up distintos acordes se escucharán. El primer acorde es: A# (La sostenido) y el último es un B (Si mayor).

Si sabes tocar algún instrumento, no veo por qué no puedas tocar las mañanitas, el himno de la alegría u otra melodía. Haciendo grande y pequeña la ventana pop-up.

➡ Click para ver los detalles de la ventana…

Membresía ONE

Si eres un diseñador web o solo sueñas con convertir tu sitio web en una verdadera obra de arte, necesitas un montón de materiales, entre los que hay herramientas de diseño, plantillas web, extensiones confiables y mucho más. De hecho, en buscar y adquirir todas estas cosas una por una se tarda mucho tiempo.

¿Pero qué pasa si te digo que puedes conseguir una gran cantidad de los mejores gráficos, temas web y complementos que están recogidos en un solo lugar? De hecho, se trata de la membresía ONE por TemplateMonster.

➡ Click para ver más…

Elementos de diseño Dark Mode

Elementos de diseño para interfaz tipo Dark Mode

Dark Themes, temas oscuros o modo oscuro es una modalidad de interfaz de usuario que se caracteriza por utilizar un esquema de color donde el fondo es de color negro. Mientras que los demás elementos del diseño, como textos o iconos son de color cloro.

Las aplicaciones para móviles más populares tienen un modo oscuro o un Dark Mode. iPhone en su versión iOS 13, tendrá un Dark Mode. En Windows 10 también puedes activar un modo oscuro.

Dark Mode o Dark Themes, no significa que al hacer un diseño sólo se deben de utilizar color negro de fondo y los demás elementos en color blanco.

Existen directrices que hay que seguir para conseguir una buena experiencia de usuario (UX Design), al momento de crear un Dark Theme.

➡ Click para ver más detalles…

Buscador de sofás

Made es el nombre de una marca que se especializa en diseñar, fabricar y vender todo tipo de muebles, de alta calidad y a un buen precio.

En la página de muebles podemos encontrar desde: mesas, camas, sillas hasta espejos de distintos tamaños.

Pero lo interesante del sitio, sin duda se encuentra en el buscador de muebles. Está diseñado para darle una buena experiencia al usuario (UX Design). Porque cuenta con diversas opciones, para que el usuario encuentre el sofá perfecto en un par de segundos.

Digamos que quieres encontrar un sofá que mida 2 metros de largo, lo que tienes que hacer es arrastrar la imagen con el puntero del mouse, hasta llegar a los 2 metros.

En la parte inferior de inmediato se van mostrando imágenes de los diferentes sofás que se encuentran en stock con esa medida.

Ahora si quieres refinar la búsqueda, puedes seleccionar los sofás por colores. Para ello cuentas con una paleta de colores, que va desde el rojo, hasta el color blanco.

Si seleccionas el color rojo, una nueva paleta aparece, pero ahora es una paleta de color con distintos tonos del color rojo.

➡ Click para ver más detalles del buscador…

Página de viajes

Una de las páginas para viajes con el mejor UX (Experiencia de Usuario) que he visitado en los últimos años. Para conocer los destinos más baratos del mundo, lo único que debes de hacer en la página, es escribir el nombre de la ciudad y el día de salida junto con el día de entrada.

Luego da clic en el botón «Search», debes de esperar unos segundos para que las opciones de destinos aparezcan en el mapa. Los destinos se dividen en: Norte América, América del Sur, Asia, Europa, Oceanía y Africa.

La página te da distintas opciones, para organizar los destinos. Por ejemplo, puedes elegir que los vuelos sean directos y sin escalas. También puedes pedir ir a lugares en donde no te pidan visa para entrar.

Incluso puedes seleccionar los destinos a los cuales quieres viajar, de acuerdo al clima. Si te gusta el calor, la página te recomendará sólo lugares en donde hay mucho sol. Y lo mismo sucede si eres fan de las ciudades donde haga frio.

Algo muy importante es el presupuesto con el que cuentas, selecciona la opción de Budget y selecciona entre $35 pesos, hasta el viaje más costoso de $35,000 pesos. El tipo de moneda se adapta dependiendo del lugar de origen que seleccionaste al inicio. Si tu vives en España, los precios serán en euros. Si vives en Estados Unidos los precios aparecerán en dólares.

➡ Click para ver más detalles de la página…

portafolio web

Matthew P Munger es un diseñador gráfico y diseñador web, que en la actualidad trabaja como desarrollador web.

Para demostrar sus conocimientos, tanto en diseño como en desarrollo web, creó uno de los portafolios web, más geniales que he visto en mucho tiempo.

Matthew utilizó muchos de los elementos gráficos en su portafolio web, que encontrabas en las primeras versiones del sistema operativo Mac OS.

Puedes interactuar con todos los objetos que ves en la pantalla. Da clic en el menú para abrir las diferentes secciones del portafolio.

Para ver uno de los proyectos diseñados por Matthew, tienes que abrir la carpeta que contiene los trabajos.

Da clic en un archivo para que se abra el documento, y se vean todos los detalles de cada uno de los proyectos.

También puedes dar clic en los iconos que hay en el escritorio. Puedes abrir el disco duro, abrir el disquete, o las carpetas.

Y como punto extra, el portafolio tiene muchos easter egg escondidos por todas partes.

Por ejemplo puedes cambiar el color de los textos y todos los demás elementos. También tienes la opción de tirar los archivos que se encuentran en la papelería.

Hasta puedes apagar el sistema y ver lo que sucede en el portafolio.

➡ Click para ver más datos del portafolio…

Blog de Diseño Gráfico ROC21

➱ ¡Sigue el blog!
botones sociales Twitter Facebook Pinterest YouTube Society6 Instagram Feedly RedBubble
✉ ROC21 en tu correo

➱ ¡Suscríbete a nuestro boletín! Recibirás ofertas especiales en cursos y recursos gráficos, una vez a la semana.