7 Consejos para diseñar tu guía de estilos

Read this article in English

Cuando un mismo equipo se encarga del diseño de todos los elementos de una marca (web, logotipo, cartería…) A menudo no es necesaria la creación de una guía de estilos, pues el diseñador va a ser el mismo en todos los puntos y sabe perfectamente como diseñar cada uno de ellos. De hecho lo más normal es que se diseñe pensando desde el principio en cada uno de los elementos que se han encargado en su conjunto y luego de manera individual.

Sin embargo en otros casos, en los que el trabajo no es global, el diseño de una guía de estilos puede ayudar al cliente a explicar a otro equipo con el que trabaje, que es lo que pretendía transmitir el diseñador primigenio.

De cualquier manera, una guía de estilos, como su propio nombre indica no deja de ser una guía, y en ningún caso la piedra filosofal. Es decir, si por ejemplo partimos del logotipo, ayudará a la creación de los demás elementos tales como tarjetas, cartelería web…, pero en ningún caso con la guía estarán plenamente definidos. Hay que tener en cuenta que solo se especifican y aconsejan algunos detalles que harán que se transmita una imagen de marca, pero que el diseño global del nuevo elemento vendrá determinado por el nuevo diseñador.

Así, conviene decir que una guía de estilos es un documento libre, es decir, os daremos consejos de algunos elementos que debe incluir, pero en ningún caso es la verdad absoluta. Si el diseñador estima que debe incluir otros o quitar algunos de los que proponemos, adelante! Pero si que con esta muestra intentamos explicar aquellos que consideramos son importantes que aparezcan, para comprender el buen significado del trabajo.

1. Define la imagen de marca

Toda guía de estilos tiene que partir de la imagen de la marca. Es difícil diseñar o saber cómo diseñar los demás elementos corporativos si no sabemos cómo va a ser el logotipo.

Este normalmente es el que sienta las bases de la guía de estilos, por lo que para comenzar con ella, hemos de estudiar al branding y la competencia y saber hacia dónde vamos a partir. Es el momento de investigar, de estudiar y de tener en nuestra mente ideas de cómo podemos desarrollar la imagen de la empresa.

Una vez la tengamos desarrollada, podemos dar el primer paso para el diseño de nuestra guía de estilos, en las que el logotipo habrá sido la que siente las bases.

2. Distintas opciones logotipo

Una vez tengamos definido nuestro logotipo con sus colores corporativos, hemos de tener en cuenta las distintas opciones en las que el logotipo puede aparecer, por lo que conviene especificar, como aparece el diseño dependiendo de la situación (sobre un fondo blanco o negro, en responsive…. )

Asi como determinar distintas medidas de recomendación. Obviamente el logotipo es editable y podemos ampliarlo o disminuirlo, pero dependiendo del diseño podemos llegar a un punto en la que lo redimensionemos tanto que pierda su esencia, y esto es lo que tenemos que decir en este punto.

opciones-logotipos-diseno-guia-estilos

3. Define la tipografía

Una vez hemos definido nuestra imagen de marca, tenemos a su vez decididos varios elementos tales como colores o tipografías. Los colores serán fijos para los demás elementos, pero la tipografía que usemos en el logotipo puede o no mantenerse para los distintos elementos de la web.

Es la primera decisión que hemos de tener en cuenta, donde vamos a usar la tipografía del logotipo, y en el caso de que no la usemos, cuál sería la tipografía escogida, teniendo en cuenta la combinación entre ellas.

Así bien, debemos crear una guía en la que se determinen las tipografías que se usen, con los distintos tamaños de texto dependiendo del lugar en el que se encuentre. De manera que se defina la jerarquía de la tipografía y también el color de la misma.

diseno-tipografia-guia-estilos

Este apartado nos tiene que dar una idea de cómo van a aparecer las tipografía en los distintos elementos que competen a la marcan. Obviamente no pueden estar todos representados, pues podemos encontrarnos con un elemento que precise un diseño tipográfico especifico, pero si tiene que ser una guía general de los distintos tamaños y colores de texto que se usen en la marca.

4. Define el color

Al igual que debemos definir la tipografía, también hemos de dejar claros cuales son los colores corporativos. Como ya sabemos, los colores tienen un código que los hace únicos y estos son los códigos que hemos de dar, para que luego independientemente del soporte que usemos, estemos ante el color que hemos diseñado.

Estos colores vamos a extraerlos del logotipo principal y también de las distintas opciones del mismo, aunque está bien, tomar otros colores secundarios que combinen con estos, sobre todo tonos neutros que permitan ampliar el abanico de opciones.

paleta-colores-guia-estilos

Cuantas más opciones de combinaciones ofrezcamos más versátil será nuestra guía y para más elementos podrá servir.

5. Definición de los elementos generales

Es muy difícil poder definir los elementos generales que puedan necesitarse par el desarrollo de la marca, a menos de que a priori tuviéramos una idea de ellos. Lo que si podemos definir en la guía son unas recomendaciones de uso, de manera que puedan servir de partida para el diseño de las mismas.

Esto es complicado lo se, pero hay algunos factores que se pueden determinar, como tamaño de las imágenes, tonalidad de la misma, color de los iconos Especificaciones generales pero que puedan servirnos de partida para el diseño de estos elementos.

elementos-generales-guia-estilos

6. Define el espaciado

Este es un punto que suele pasar desapercibido pero que es muy importante. A veces es el responsable de una mala legibilidad del texto o de que al aparecer este con otros elementos, se entremezcle y no se entienda el sentido del diseño.

De esta manera, la decisión del espaciado, ya sea del logotipo con sus bordes, de la jerarquía del texto o de de los elementos generales nos ayudará a conocer cómo queremos que sea el diseño global.

Además un espaciado que se repite en todos los elementos da un aspecto más serio y profesional.

7. Que hacer/ que no hacer

Claramente este no es un elemento obligatorio pero que puede ser de gran ayuda en toda guía de estilos. Este punto consiste en dar unas ligeras pautas de lo que podemos o no podemos hacer con cada uno de los elementos, tales como logotipos, iconos, imágenes…

Es decir, aunque hayamos definido en los 6 puntos anteriores cada uno de los elementos, podemos encontrarnos ante la duda de si podemos o no podemos cambiarlos. Pues bien, en este punto hablaríamos de aquellas acciones que mejor dejamos de lado y no repetimos bajo ningún concepto.

Por ejemplo, hemos definido todos los colores que deben usarse en los iconos, pero cuando hablamos de los iconos sociales una de las opciones que se barajan es que aparezcan con su color característico, pues bien, si nosotros tenemos claro que eso no puede pasar, este es el punto en el que debemos incluirlo.

guia-estilo-consejos-diseno

Es muy útil para incluir acciones que no queremos, pues pensamos que pueden desvirtuar el diseño global.

Escrito por 

Dibujo, pinto y hasta a veces coloreo en SiloCreativo. Además como desde pequeña quise ser escritora, con este blog cumplo mi sueño y escribo para compartir lo que voy aprendiendo. ¿Que tienes alguna duda? Pues aqui estoy!

Un Comentario en “7 Consejos para diseñar tu guía de estilos

  1. Webbing Barcelona

    Un post muy útil. la verdad es que tener una buena guía de estilos hace que trabajar sea más fácil.

    Un saludo!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *