Soy diseñador gráfico/web e ilustrador. Para mí, comprender cómo diseñar y construir la interfaz de un sitio web es parte del conjunto de habilidades de un diseñador gráfico moderno. La web es sólo otro lienzo sobre el que diseñar. Existen diferentes consideraciones al diseñar para la web en comparación con el diseño de una revista, por ejemplo, pero el cruce entre las dos disciplinas es significativo.
A medida que más y más diseñadores gráficos/ilustradores adquieren habilidades de diseño web, estamos viendo un crecimiento en la cantidad de sitios web que utilizan ilustraciones.
Quiero mostrar algunos sitios web que me han llamado la atención durante el último año y que utilizan ilustraciones para mejorar la experiencia del usuario.
1. CXXVI Ropa Co
Voy a empezar con uno de mis ejemplos de ilustración favoritos en la web. CXXVI es una empresa de ropa de Nueva York que produce productos fabricados en Estados Unidos con una estética a juego. El sitio utiliza ilustraciones para llevar esta idea a la web. Una tipografía bellamente dibujada a mano crea una auténtica sensación artesanal en un sitio que ya exhibe productos de ropa de igualmente buena calidad. La ilustración refuerza los valores, el estilo y la calidad de la empresa.
También hay un encantador conjunto de íconos de productos dibujados a mano para ayudarte a navegar por la tienda. Este sitio es el ejemplo perfecto de cómo se pueden utilizar las ilustraciones para mejorar sutilmente la experiencia del usuario sin comprometer la usabilidad del sitio.
2. turón
Polecat crea aplicaciones para iPhone y iPad. Se necesita un enfoque un poco más completo con respecto al uso de ilustraciones en su sitio web. Todo el sitio está ilustrado, dando la impresión de que la empresa rezuma creatividad. En cierto modo, debido a lo que hace Polecat, siento que el enfoque tan ilustrado de este diseño está un poco fuera de lugar. A simple vista no queda claro cuál es exactamente su especialidad. Dicho esto, ¡creo que podría estar haciendo agujeros sin ningún motivo! Hay tantos diseños de sitios web estándar que venden servicios similares que este realmente se destaca entre la multitud.
3. Gerren Lamson
Algo que Gerren Lamson hace muy bien es mezclar ilustración con iconografía. Cada entrada de su portafolio está representada por un ícono bellamente ilustrado. La iconografía realmente puede agregar identidad a un proyecto. En lugar de tener ilustraciones grandes y elaboradas, puedes agregar estas pequeñas explosiones de creatividad que realmente añaden algo de personalidad a un sitio. La iconografía suele ser realmente útil cuando se trabaja en sitios web que en realidad se parecen más a aplicaciones web. Puede crear una identidad visual para diferentes secciones del sitio introduciendo una familia de íconos. Además de agregar algo de interés visual al sitio, los íconos en realidad ayudan en el recorrido del usuario a través del sitio o la aplicación.
4. Las muchas caras de… Leonoardo DiCaprio
En completo contraste con agregar toques ilustrativos con un conjunto de íconos, también puedes crear un impacto sorprendente con ilustraciones gigantes, ¡especialmente cuando estás feliz de dedicarles toda la parte superior de tu sitio! Uno de los mejores ejemplos de esto en la web está en themanyfacesof.com de paravelinc.com. Estos muchachos (Trent Walton, Reagan Ray y Dave Rupert) producen diseños web increíbles y creo que se debe a su profundo conocimiento de lo que se puede lograr en la web utilizando tecnologías modernas y su comprensión de cómo combinar eso con su considerable creatividad. talento.
5. Zaggy
Zaggy es un ejemplo brillante de cómo una ilustración realmente simple puede transformar totalmente la sensación de lo que de otro modo sería un sitio bastante sencillo. Me encanta este uso efectivo de ilustraciones simples. ¡Es un recordatorio para un diseñador como yo de que menos es más! Este suele ser el caso y creo que este sitio lo demuestra muy bien.
Este también es un buen ejemplo de cómo la ilustración puede afectar el tono y la personalidad de un sitio. En este sitio, las ilustraciones aportan una sensación personal y alegre que de otro modo no existiría.
6. Efecto niña
Cuando utilizas ilustraciones en el diseño de tu sitio, es una buena idea pensar seriamente en el color. Como dije anteriormente, menos es más y lo mismo ocurre cuando se usa color. Normalmente, lo que elegiría es una pequeña paleta de dos o tres colores. Girl Effect utiliza tres colores por página y eso incluye el blanco y negro (blanco roto). Cada sección del sitio tiene un color principal, lo que le da a las ilustraciones una sensación única en cada página y ayuda al usuario a saber en qué parte del sitio se encuentra. También crea impacto visual.
7. Estudio Diez y Medio
Supongo que la página de inicio de la consultora de diseño gráfico Studio Ten and a Half no es realmente un ejemplo de ilustración pura sino de tipografía ilustrativa. El tipo de letra gigante de diez y medio cambia al actualizar y, combinado con el blanco y negro puro, crea un impacto realmente poderoso. Me encanta el estilo de este sitio. ¡Lo pegaría en mi pared si tuviera una copia impresa decente!
8. RecompensaBev
Bounty Bev utiliza esta ilustración de mapa de ruta realmente divertida que desciende en cascada por la página web y lleva al usuario directamente al final de la página. Todo el sitio tiene una especie de cualidad narrativa, con la ilustración de la carretera a la cabeza. El sitio también está respaldado por una hermosa textura azul que contribuye al exitoso diseño visual y la calidad ilustrativa del sitio.
9. Vuelo de los Conchords
¡He incluido Flightoftheconchords.co.nz solo porque es divertido! Es una pieza de diseño impreso ilustrativo de estilo retro, ¡pero en línea! También tiene un cambiador de vestuario interactivo para Bret y Jemaine… ¡lo cual es muy divertido!
10. Voltaje: Moda amplificada 2011
Este sitio, para el principal desfile de moda y rock del Medio Oeste de Estados Unidos, es realmente creativo. El contenido está compuesto por una serie de carteles ilustrativos y tipográficos. Es un sitio de desplazamiento horizontal, que funciona bien en este caso. Es un gran ejemplo de un diseñador que impulsa el diseño web de forma creativa. Es importante que algunos diseñadores realmente superen los límites creativos de la web para que todos podamos inspirarnos en ellos e impulsar el diseño web a nuestra manera.
¿Conoce otros buenos ejemplos de ilustración en la web? ¡Háganos saber qué agregaría a la lista en los comentarios!