Logo de Dallonses

Style guide

¿Qué es una style guide?

Una style guide es el documento que define cómo debe verse y sonar una marca o un producto. Los colores y sus valores exactos, la tipografía y cómo usarla, las reglas del logo, la imagen, el espaciado y, a menudo, el tono de voz. Existe para que todo el que toca la marca, dentro de la empresa o fuera, tome las mismas decisiones y el trabajo se mantenga coherente.

La gente la confunde con dos cosas relacionadas. Una style guide es el reglamento de la identidad visual y verbal. Una component library es el conjunto de piezas de UI reutilizables reales, normalmente construidas en código. Un design system es la estructura mayor que contiene tanto la style guide como la library, además de los principios y la guía de uso que las unen. Dicho simple: una style guide te dice que la marca usa este azul y esta tipografía; una component library te entrega el botón ya construido en ese azul; un design system te dice qué botón usar, cuándo y por qué. Cuando un equipo de marketing, una agencia y un equipo de producto interno producen trabajo que parece de la misma empresa, una style guide es lo que los alineó.

Las style guides van desde una hoja de marca de una página hasta un documento vivo y detallado que cubre accesibilidad, movimiento y reglas de contenido. Las buenas son prácticas y actuales, escritas para usarse mientras el trabajo ocurre, no para archivarse tras el lanzamiento de una marca.

Las style guides en Dallonses

Construimos style guides como documentos de trabajo, no como biblias de marca plastificadas que viven en un cajón. Cuando colaboramos en diseño UI y design systems, la style guide captura las decisiones que todos, tu equipo y el nuestro, necesitan para tomar la misma decisión sin una reunión. Clara, actual y atada al producto real.

Para marcas globales que trabajan entre muchos equipos y mercados, la style guide es lo que mantiene el trabajo consistente a distancia. Definimos las reglas con tu equipo, las conectamos con los componentes y tokens que las dan vida en código, y las documentamos para que la gente pueda actuar sobre ellas mucho después de que hayamos terminado. La marca se mantiene coherente porque la guía es usable.

¿Necesitas una marca que se mantenga consistente en cada equipo y canal? Documentémosla.

Hablemos de design systems

Servicios relacionados


¿Listo para trabajar juntos?

Reservar una reunión
Aymón sosteniendo una revista Tools frente a su cara
Ari trabajando en una laptop al aire libre rodeado de plantas
Vista superior de un escritorio de madera con teclado, ratón y auriculares
Ilustración dibujada a mano de una mano chasqueando los dedos
Nico recostado contra un dispensador de agua junto a un extintor de incendios
Primer plano de una computadora abierta con placa de circuito y componentes en un escritorio de madera
Bernat y Andreu colaborando en un escritorio con monitores y una laptop
Ilustración dibujada a mano de una mano abierta saludando
Aymón sosteniendo una revista Tools frente a su cara
Ari trabajando en una laptop al aire libre rodeado de plantas
Vista superior de un escritorio de madera con teclado, ratón y auriculares
Ilustración dibujada a mano de una mano chasqueando los dedos
Nico recostado contra un dispensador de agua junto a un extintor de incendios
Primer plano de una computadora abierta con placa de circuito y componentes en un escritorio de madera
Bernat y Andreu colaborando en un escritorio con monitores y una laptop
Ilustración dibujada a mano de una mano abierta saludando