¿Cómo desarrollar la identidad visual de un proyecto?

Es duro darse cuenta de que la identidad visual de tu proyecto no refleja todo lo que realmente ofreces.

La buena noticia es que nunca es tarde para enmendar la plana y aplicar tu verdadera identidad visual a tu web.

Yo he pasado por este proceso recientemente y he de decir que no puedo estar más contenta y satisfecha con la decisión tomada.

En todo este cambio, Carmen Díaz Soloaga ha sido pieza clave y por eso, hoy cuento con ella para explicar todo el desarrollo llevado a cabo.

Desarrollo de la identidad visual de un proyecto

Lo primero que debo advertirte antes de que comiences a leer este artículo es que necesitas un especialista para desarrollar la identidad visual de un proyecto web.

¿Por qué?

Te mencionaré una palabra de moda que te resumirá la importancia del proceso que veremos hoy: storytelling.

Si estás familiarizado con este término sabrás que la disciplina de moda consiste en crear un discurso que aporte una personalidad reconocible y atractiva para los consumidores.

Gracias a esta personalidad, pongamos por ejemplo, audaz y provocativa, los consumidores ven sus intereses, aspiraciones y motivaciones reflejadas en la marca.

Estarás de acuerdo conmigo en que no tiene ningún sentido crear un storytelling potente para luego tirarlo al suelo y patearlo con una identidad visual web de quinta regional.

¿Te imaginas la web de Apple llena de banners de colores chillones y con una gama de colores caótica?

Evidentemente, no.

¿Por qué la identidad visual de un proyecto web es importante?

Estás familiarizado con el término identidad visual y seguro que eres consciente de por qué marcas como Nike o McDonald’s tienen una.

Sin embargo, cuando hablamos de empresas de pequeño tamaño, de esas que llevan varios años en el mercado y que han hecho lo que han podido con el marketing de su empresa, la cosa cambia.

En estas empresas, centradas la mayoría de las veces en vender y vender, parece que la identidad visual no es importante.

En las próximas líneas voy a intentar explicarte por qué cualquier empresa, del tamaño que sea, necesita una biblia visual.

¿Qué es una biblia visual?

Una biblia visual no es más que un documento, que puede ir desde un par de páginas hasta varios cientos que contiene una serie de pautas que deben guiar todas las acciones de cualquier marca.

Como puedes imaginar, una biblia visual es un completo de la estrategia de marketing o redes sociales de la empresa, especialmente, si hay contenidos de por medio.

Los contenidos, especialmente los visuales, como ebooks, vídeos o infografías deben regirse por una serie de pautas para que permitan que todos respiren el mismo aire y que reflejen la personalidad de la marca.

¿Cómo desarrollar una identidad visual para tu web?

Digo web, porque muchos emprendedores y negocios digitales tienen como base de operaciones una web.

Pero la realidad es que la identidad visual, afecta a todos los aspectos de la comunicación de la marca, así que si estás leyendo este artículo y tu negocio tiene una base física, puedes aplicar los mismos principios.

1.- Define quién eres y quién quieres ser

Tanto si tu marca lleva tiempo en el mercado como si acaba de aterrizar, debes hacerte la incómoda pregunta de “quién eres”.

Cuando te sientes a pensar, deberás ser honesto contigo mismo y valorar cuáles son los puntos fuertes de tu comunicación visual, si es que la tienes.

Así surgirán las principales deficiencias a cubrir y el profesional que te asesore podrá ser consciente de la envergadura del trabajo.

Lo siguiente que debes plantearte es “quién quieres ser”.

No, no vale “el nuevo Apple”.

Esta identidad, como bien sabes, tiene como protagonistas los arquetipos de marca.

Un arquetipo es un “personaje” que ayuda a encuadrar la personalidad de la marca dentro de los 12 tipos creados por Carl Jung.

Entre estos arquetipos hay un Mago, un Héroe, un Hombre Corriente y un Amante.

Gracias a los arquetipos podemos conseguir una primera aproximación a cómo será la identidad visual de nuestra marca.

Por ejemplo, el arquetipo del Héroe busca proteger e inspirar a otros, siempre cuidando de los demás.

Marcas como Nike o Cruz Roja Internacional están basadas en este arquetipo y eso ayuda a definir bastantes aspectos de su identidad visual.

Pongamos el caso de los valores del arquetipo del Héroe donde su característica más sobresaliente es la valentía.

Lógicamente, las imágenes de estas marcas no pueden ser suaves y dulces, tipo Mr. Wonderful.

En su lugar, deben estar llenas de fuerza, inspirando a la audiencia que las recibe y que quiere ver este arquetipo en acción.

En el ejemplo que puedes ver bajo estas líneas, procedente de la campaña de reclutamiento de la policía de Nueva Zelanda, verás las señales visuales que se desprenden de haber elegido el arquetipo del Héroe como reflejo de sus valores.

2.- Busca un lenguaje visual que cuadre con tu marca

La elección del arquetipo que encarna los valores de tu marca ayudará algo en el diseño de la identidad visual de tu proyecto pero no hemos hecho nada más que empezar.

Es el caso de dos marcas que compiten por el mismo nicho de mercado: Patagonia y North Face.

Ambas están inspiradas en el arquetipo del Explorador y, sin embargo, tienen líneas visuales muy diferentes.

Patagonia es más tranquila, y refleja el amor por la naturaleza y su cuidado.

North Face por el contrario es aventura, riesgo y voluntad.

Aunque es difícil explicar las sutilezas de por qué una imagen encaja en una marca pero no en otra, seguro que percibes que son dos líneas visuales distintas.

Las imágenes de North Face siempre están ambientadas en la naturaleza pero esta es bastante extrema: barrancos, cumbres nevadas o paredes inaccesibles.

Las de Patagonia, por el contrario, se inspiran en paisajes más accesibles, como parques naturales o vistas pacíficas.

Sutiles diferencias, pero claves.

¿Crees que es casualidad?

No, ni mucho menos.

3.- Diseña (o contrata un diseñador)

Si eres un tipo listo, a estas alturas habrás pensando que todo este proceso puedes hacerlo tú solito.

Pues no, no puedes.

Necesitas un diseñador que te ayude a trasladar los valores y la identidad de tu marca a un papel.

O lo que es lo mismo, a elegir estilos fotográficos, una paleta de colores, tipografías, patrones e ilustraciones.

En este mismo artículo veremos cómo se realiza este proceso con un caso real, el que he realizado para la marca de esta casa – SoMeChatES.

4.- Mantén la coherencia

Una de los retos más importantes a la hora de desarrollar una identidad visual es conseguir mantener la coherencia a medida que pasan los meses o surgen nuevas piezas visuales.

Y te lo digo porque me ha pasado.

Las tres imágenes que puedes ver a continuación pertenecen a mi blog.

Sin darme cuenta, han ido cambiando con el tiempo y para mi vergüenza, presentan una falta de coherencia que prometo solucionar un día de estos.

Por eso es importante marcar una línea visual desde el principio y no salirse de ella jamás.

Así se produzca un apocalipsis zombie o una guerra nuclear, tu línea visual debe permanecer inalterable.

Ingredientes para tener una identidad visual atractiva

Veamos ahora paso a paso cómo se ha desarrollado la identidad visual de SoMeChatES y qué podemos aprender de este proceso.

1.- Objetivos

Cuando Alicia me propuso el reto de modificar el aspecto visual de su web, inmediatamente me vino a la mente la idea de aprovechar para rediseñar toda su identidad visual.

Aunque es una gran profesional y no describiré aquí sus muchos méritos, el aspecto de su proyecto no estaba en línea con los servicios y contenidos que ofrece en el blog de SoMeChatES.

Con todo el cariño del mundo, Alicia, era “casero”.

De las conversaciones que tuvimos para intentar sentar las bases de la identidad visual de su proyecto se desprendía la misma idea: el aspecto del proyecto no representaba sus valores como profesional y como marca personal.

De estas reuniones surgieron tres apuntes importantes:

• Proyectar una imagen profesional a la altura de su identidad.
• Crear una personalidad reconocible en las redes sociales, donde realiza la mayoría de las acciones de promoción y marketing de sus servicios.
• Sentar las bases para futuros contenidos que genere SoMeChatES, como ebooks, infografías, presentaciones y vídeos.

2.- Logotipo

Comenzamos por donde comienzan los diseñadores, por la identidad visual corporativa.

El logo de toda la vida, vaya.

No me extenderé en el proceso creativo que es lento y caprichoso.

Baste decir que el resultado final tenía que reflejar el primitivo color azul, seña de identidad de SoMeChatES y el toque personal de Alicia como responsable del proyecto.

Por eso optamos por mantener el “by Alicia” como firma personal de un proyecto que en ocasiones ha reunido a amigos y colaboradores.

¿Quieres ver las primeras versiones?

Estos fueron algunos de los logos que barajamos, según los valores de la marca por los que optamos y la descripción de los servicios que SoMeChatES proporciona.

3.- Gama de colores y texturas

Una vez cerrado el logo, es hora de definir los elementos que darán vida a la identidad visual del proyecto, como la gama de colores, las texturas, las tipografías y las pautas de selección de imágenes.

En el caso de SoMeChatES, cuyos colores originales eran el negro y el azul, optamos por rebajar la dureza del negro por un gris más amigable y cercano.

Además, y según la personalidad de la marca, tanto Alicia como yo, buscamos un aspecto limpio y depurado, sobrio pero potente.

El punto de locura (siempre presente en mis proyectos de diseño) lo aportaron las texturas elegidas combinadas en los colores corporativos.

4.-  Tipografías

Como puedes suponer, la elección de las tipografías es algo más que elegir las que más te apetezcan.

En el caso de SoMeChatES busqué el equilibrio entre dos extremos: una tipografía fuerte y estable y una con una personalidad más relajada que expresara que detrás de este proyecto hay una persona física.

5.- Iconos

Además de lo mencionado, la elección de los iconos suponía una inversión en el futuro del proyecto de SoMeChatES.

Pensando en el resto de los formatos de contenidos que pueda necesitar el proyecto, es importante ofrecer alternativas según las necesidades.

En la imagen que puedes ver más abajo, te muestro cómo la elección de los iconos ha sido de gran utilidad para Alicia, ya que ha podido utilizarlos en sus distintas ponencias y sesiones como speaker.

En diversas ocasiones he comentado que la elección de los iconos es un arte en sí mismo.

Hay muchos tipos de iconos y lograr que todos parezcan similares no es sencillo.

En el caso del proyecto de SoMeChatES, ofrecí a Alicia una serie de pautas para la elección de los iconos que necesite en el futuro, de forma que pueda desarrollar su propio material.

6.- Elección de fotografías

Uno de los temas más controvertidos y difíciles de explicar.

Los diseñadores somos seres visuales.

Sabemos la diferencia entre naranja atardecer y naranja calabaza (sí, son distintos, créeme).

Por eso captamos las sutiles diferencias entre imágenes que no reflejan el mismo estilo visual.

A la hora de definir una identidad visual para un proyecto web debemos ser capaces de definir las pautas de elección de fotografías, con aspectos como el encuadre, el contraste o la presencia de determinados elementos.

Esta imagen pertenece al manual de identidad visual corporativa de la marca diseñada para promocionar el barrio de Redfern, en Sydney, Australia.

Entre las guías que se ofrecen para seleccionar imágenes, este manual de identidad visual ofrece las siguientes:

• La composición de la imagen debe recordar una sonrisa de bienvenida.
• Uso del color natural, sin filtros ni efectos de luz. Tampoco en blanco y negro.
• Las situaciones deben resultar creíbles, mostrando personas en el barrio de Redfern, en el transcurso de su vida cotidiana.
• Las tomas deben ser simples y directas, sin actores ni modelos.

En el caso de SoMeChatES, las directrices que ofrecí a Alicia le han ayudado a seleccionar las imágenes para sus artículos, presentaciones y redes sociales.

¿Cómo aplicar una identidad visual a una web?

Quiero terminar este artículo explicando el proceso de trasladar una identidad visual a un diseño web.

Vaya por delante que entenderé si personalmente no te gusta el nuevo diseño de la web de SoMeChatES.

Alicia, mi clienta, está contenta con el cambio y para mi es pago suficiente.

He aplicado todo lo definido en el proceso anterior respetando los siguientes puntos.

1.- Gama de colores

Como he comentado, tanto Alicia como yo estábamos de acuerdo en mantener una imagen limpia, sobria pero profesional.

Por eso opté de inmediato por el fondo blanco, con algunos toques de los colores corporativos, los dos azules y el gris.

2.- Imágenes

Contaba con una foto de gran calidad y era evidente que un proyecto personal debe incluir una foto del responsable.

Sin embargo, y buscando desmarcarse de otras muchas webs de proyectos personales, le propuse a Alicia que la imagen fuera en blanco y negro.

Los colores corporativos lo aguantan bien y la sensación de profesionalidad se mantiene.

3.- Iconos

Con la idea de que el conjunto no fuera excesivamente formal, incluí en el diseño un fondo de iconos que ayudara a suavizar la dureza de las líneas horizontales presentes en toda la web.

4.- Equilibrio

Por último, destacaría el equilibrio del conjunto, donde las distintas partes de la estructura web (reseñas, blog, servicios) no chocan unas con otras, sino que ayudan a recorrer la web de forma ordenada.

Por último, hay que comentar que la nueva web de Alicia incorpora las directrices de la nueva RGPD, gracias al asesoramiento de los profesionales de Lex Blogger.

¿Qué opinas de la nueva identidad visual de este proyecto web? ¡Adelante, no te cortes!  

Carmen Diaz Soloaga

Carmen es Content Marketing Manager para Pymes. Entre sus habilidades destacan el diseño de estrategias de marketing, la redacción de textos web, el diseño de infografías y la gestión de contenidos en Redes Sociales.

socialmediapymes.com