15 Ejemplos de ilustraciones en páginas web
El poder de la ilustración para tu proyecto
Actualmente hay muchas formas de marcar la diferencia con tu marca, a parte de los colores y tipografías y, la mejor forma para hacerlo es crear un universo único donde cada elemento respire el mismo oxígeno. Por eso, la ilustración es uno de los valores seguros como elemento de diferencia, ya que nos recuerda la naturaleza exclusiva del arte.
La ilustración otorga una voz singular a nuestro proyecto y prueba de ello es la confianza que han depositado en ella marcas como Airbnb, Mailchimp, Dropbox y WeTransfer que muestran el trabajo de diferentes diseñadores y artistas para comunicar emociones y valores, o simplemente para hacer que el proceso de espera sea más agradable para el usuario.
Como dice Jennifer Hom, Experience Design Manager of Product Illustration en Airbnb:
Las palabras pueden establecer el tono para una empresa, pero son las imágenes las que le dan una cara. La ilustración todavía tiene que encontrar su lugar en el mundo de la tecnología, porque a menudo no se considera y se lanza sobre la marcha. Ya sea que se use para destilar mensajes complejos o agregar un toque de fantasía, la ilustración es una pieza que conforma la identidad visual de la marca de una empresa.
– Jennifer Hom, Experience Design Manager of Product Illustration en Airbnb
Añadir ilustraciones a tu página web
La ilustración digital evoluciona a diario y han surgido numerosas técnicas como la ilustración vectorial con colores planos y degradados o ilustraciones en 3D con infinitas variedades de estilos desde la ilustración Low Poly hasta el renderizado realista más increíble. Gracias a SVG (Scalable Vector Graphics) podemos incluir en nuestro proyectos elementos vectoriales con peso reducido y escalados perfectos incluso en pantallas retina. También podemos animar ilustraciones con CSS, Javascript o WebGL.
La ilustración puede convertir tu sitio web un espacio realmente único. Es un medio poderoso y creativo que puede identificar y comunicar el mensaje de tu marca y transmitir ideas de manera universal, mediante el uso de una sola imagen.
A continuación te muestro 15 ejemplos de páginas web donde la ilustración tiene un papel relevante:
1. Mailchimp
Mailchimp es una plataforma de marketing all-in-one para pequeñas empresas. Utilizan ilustraciones con trazos de grafito y estilo abocetado, en blanco y negro complementadas por una paleta de tintas planas, sello de la marca.
2. Trello
Trello es un gestor de proyectos y actividades sencilloa, gratuito y muy visual gracias a sus tableros de trabajo. Su página web muestra una gran variedad de ilustraciones vectoriales que respiran un mismo estilo gracias a los degradados, diseño de personajes y colores corporativos.
3. Etsy
Etsy es la mayor plataforma de venta online para artesanos donde personas de todo el mundo acuden para hacer, vender, comprar y coleccionar productos únicos. De acuerdo a su filosofía handmade y online, las ilustraciones de la web conjugan un estilo de dibujo tradicional con técnicas puramente digitales (vector y animación).
4. Headspace
Headspace, la app que quiere dar a conocer los beneficios de la meditación al gran público con meditaciones guiadas, animaciones, artículos y videos se ha convertido en uno de los referentes a la hora de casar ilustración y branding con un estilo característico y muy reconocible. Prueba de ello es su página web.
5. Notion
Notion es un espacio de trabajo all-in-one para orgnizar notas, tareas, wikis y bases de datos. Su ilustración es precisa, sencilla y limpia, en blanco y negro y estilo cartoon.
6. Duolingo
Duolingo es una plataforma de aprendizaje de idiomas y, aunque no aparezca en la en su cabecera, es reconocida por su mascota, un búho verde. Este búho, nos acompaña por la web en diferentes viñetas que se complementan con multitud de ilustraciones vectoriales.
7. Casper
Casper es una marca de colchones y almohadas americana (no venden en España) que utilizan la ilustración en su página web como complemento a las fotogra´fias.
8. Sea Harvest
Sea Harvest, proveedor de pescados y mariscos australiano, ha diseñado una web a modo de carta donde destacan sus ilustraciones clasicas estilo grabado. No dejeis de echar un vistazo también a su navegación, todo un acierto.
9. Nomadic Tribe
A través de un cómic animado, makemepulse, una empresa de producciones interactivas, nos envió sus mejores deseos para 2019. Quizás no sea un ejemplo destinado a esta lista pero sí que muestra hasta que punto la ilustración puede ser protagonista en una página web.
10. Koox
Koox es un espacio cuyo objetivo es acercar las creaciones de los grandes chefs al público londinense. Para su web se sirven de ilustraciones que complementan su imagen corporativa y transmiten a la perfección.
11. Whereby
Whereby es una plataforma de videoconferencias fáciles, sin inicio de sesión ni descargas que ofrece pantalla compartida, grabación, etc. La ilustración en su web complementa los textos reforzando sus valores (libertad: pájaros volando, mariposa, etc.) y en algunos momentos tomando todo el protagonismo con motivos abstractos e imaginarios que unen naturaleza y tecnología.
12. Jira
Jira es una herramienta de desarrollo de software para equipos con metodologías agile. Como en el caso de Trello, creación también de Atlassian, utilizan ilustraciones vectoriales en toda la web con degradados y motivos corporativos.
13. Salesforce
Salesforce, la empresa americana de software bajo demanda por producir un CRM llamado Sales Cloud, es otra de las marcas que apuesta por la ilustración en sus páginas web. Uno de los ejemplos que más me gustan es la web de Lightning Design System, con ilustraciones vectoriales de colores sólidos que relacionan el reto explorador con su CRM de creación de apps.
14. Cuberto
Cuberto es una agencia digital centrada desarrollo de aplicaciones móviles y páginas web con un efoque UI/UX. En todas las secciones de su web utilizan ilustraciones vectoriales con degradados y motivos espaciales que se animan con el paso del ratón y que sirven como hilo conductor para su storytelling.
15. Evernote
Evernote es una app cuyo objetivo es la organización de información personal como ideas, inpiraciones o proyectos mediante el archivo de notas. Su web utiliza ilustraciones vectoriales muy iconizadas donde domina su exclusiva paleta de verdes.