Ilustrando la Web: Deconstruyendo la Tendencia
Las ilustraciones se están apoderando de la Web. Los diseñadores están creando sitios web con todo, desde ilustraciones de pantalla completa hasta divots dibujados a mano que se utilizan en todos los proyectos. Es una tendencia que probablemente seguirá creciendo porque las ilustraciones hacen que el diseño se sienta personalizado (incluso si no lo es).
A continuación, le mostramos cómo aprovecharlos al máximo en su diseño.
Ilustración del sitio web 101
Las ilustraciones son una forma versátil y divertida de crear un diseño de sitio web personalizado. Desde las imágenes dibujadas a mano, hasta los elementos, las letras, todo lo relacionado con una imagen totalmente ilustrada o dibujada, se ve y se siente como único. Esa es una de las razones por las que es tan popular.
Pero hay muchas otras razones por las cuales los diseñadores están saltando en la tendencia de la ilustración:
- Las ilustraciones permiten a los usuarios imaginarse ellos mismos en la escena que está configurando porque no se enfoca en otras personas reales.
- Hay un elemento de extravagancia que solo se puede lograr con un dibujo.
- Las ilustraciones pueden combinar realidad e imaginación para un diseño que es extraordinario.
- La personalización es fácil cuando dibuja los elementos de arte.
- Las ilustraciones a menudo son bastante coloridas y pueden ayudarlo a aprovechar la tendencia de color grande y brillante.
- La técnica se puede usar incluso si no es un ilustrador gracias a los kits o paquetes de diseño que están llenos de partes ilustradas que se pueden utilizar a lo largo de un proyecto.
- Las ilustraciones pueden adoptar diferentes estados de ánimo o estilos, desde bocetos hasta dibujos elaborados y gráficos generados por computadora.
Ilustraciones de estilo héroe
Debido a que los encabezados de los héroes son grandes, este es uno de los lugares más fáciles de ver la tendencia de la ilustración. También se está utilizando para una gran cantidad de sitios, desde portfolios hasta páginas de vista previa de la aplicación y de la venta minorista.
Lo bueno de una imagen de héroe ilustrado es que hay espacio suficiente para una obra de arte bastante compleja. Los pequeños detalles, el sombreado, el color y las interacciones tienen espacio para respirar, lo que facilita a los usuarios explorar cada elemento.
Hay algunos trucos para ilustrar todo este complejo:
- La obra de arte debe ser buena. Los usuarios no van a perder el tiempo mirando una ilustración que no obtienen o que es un desorden descuidado. Así que tómate tu tiempo y cuídate.
- Si bien la ilustración puede tener profundidades de complejidad, el mensaje general debería ser simple. Sepa lo que se supone que debe decir la imagen y asegúrese de que los elementos contribuyan al mensaje.
- Trabaja con un profesional El hecho de que pueda dibujar corazones en una servilleta no significa que esté listo para dibujar una ilustración del sitio web a gran escala. Este proceso requiere tiempo y planificación para realmente funcionar. (Y puede ser costoso, así que asegúrese de que esta sea la estética correcta antes de sumergirse).
Añadir animación simple
Si bien un dibujo estático puede tener mucho impacto por sí mismo, la Web está viva con el movimiento en estos días. Empareje una ilustración con animaciones sutiles o efectos de desplazamiento para alentar a los usuarios a hacer clic.
Pequeños movimientos sutiles, como el texto giratorio en el sitio web para El Hugo , ayuda a atraer la atención hacia el diseño. Las animaciones pequeñas también pueden ayudar a los usuarios a comprender qué acciones realizar mientras visitan un sitio. Esto puede ser especialmente cierto para las ilustraciones que incluyen muchos elementos o tienen un diseño general "ocupado".
Estas pequeñas sorpresas pueden alentar a los visitantes del sitio a quedarse y mirar alrededor también. Las animaciones de Hover son una bonificación especialmente buena para los usuarios que pueden servir tanto como un elemento divertido como una herramienta de navegación.
Iconos ilustrados o elementos de la interfaz de usuario
Si un diseño de sitio web completamente ilustrado no es lo tuyo, considera algunos iconos ilustrados o elementos de la interfaz de usuario. Esta es una forma sencilla de introducirse en la tendencia. (Y hay muchos íconos y kits de interfaz de usuario que cuentan con estilos ilustrados para ayudarlo a comenzar).
Los elementos ilustrados pueden agregar un toque de fantasía a un sitio que de otra manera podría parecer demasiado formal. Algo para probar es un icono de esquema ilustrado. Este estilo es fácil de colocar en casi cualquier diseño, funciona muy bien con imágenes y cualquier esquema de color, y proporciona un tema visual consistente de página a página.
Si quieres ir un paso más allá de los íconos, piensa en elementos de IU sobredimensionados. Iqor , utiliza botones ilustrados en tamaños más grandes para guiar a los usuarios y hacer que el sitio sea un poco más divertido. El estilo ilustrado fluye de página a página con elementos grandes usando los mismos tres estallidos de color. El resultado es divertido y consistente y un poco inesperado en el negocio de atención al cliente.
Letras dibujadas a mano
Otra gran tendencia en el diseño de sitios web es la tipografía personalizada. Combine los conceptos de ilustración y letras para un logotipo dibujado a mano, bloque de texto principal o elemento de arte tipográfico. Esta imagen visual basada en texto puede tener un gran impacto (especialmente cuando está sobredimensionada o se usa como elemento de arte principal en el diseño).
El truco aquí es la moderación. Con el estilo de letras dibujado a mano, querrá adherirse a un solo bloque de texto o elemento de texto para este efecto. Los múltiples usos de un bloque de texto personalizado pueden ser abrumadores para los usuarios y pueden afectar la legibilidad. Es importante asegurarse de que las palabras sigan siendo bastante claras y de que los usuarios no tengan problemas para entender el mensaje.
Ambos Dia de los Muertos y Enfrentarse al cáncer , haz un buen trabajo con letras a mano para un mensaje simple. Day of the Dead usa otras ilustraciones, tipografía y fotos fáciles de serif para ayudar a atraer a los usuarios a través del resto del sitio. El resultado final es divertido y fácil de seguir. Levántate a Cáncer utiliza más de un estilo de acuarela basado en la ilustración, pero se basa en tipos de letra más estándar para la legibilidad. Ambas son buenas opciones para trabajar con letras personalizadas.
Conclusión
Si bien entrar en el mundo de la ilustración para proyectos de diseño de sitios web puede parecer un poco intimidante al principio, es algo que muchos diseñadores pueden hacer. Desde dibujar a mano hasta tener asistencia informática o trabajar con un kit, las opciones son bastante ilimitadas.
Es algo en lo que pensar cuando se trata de proyectos que exigen hacer algo un poco diferente. Y es lo suficientemente moderno como para que te pregunten sobre cómo crear algo con este estilo. Así que este es un buen momento para refrescar sus habilidades de dibujo y pensar en formas en que un marco de diseño de sitio web ilustrado podría funcionar para usted.