# Coherencia de marca: que cada punto de contacto parezca de la familia [Canonical HTML page](https://gradiently.design/es/guide/cohesive-brand) Una marca coherente no es aquella en la que todo se ve igual. Es aquella en la que un desconocido podría sacar tu post, tu carta y tu email de un montón y saber que van juntos. ## The short version - La coherencia de marca significa que cada punto de contacto, de los posts en redes a los tiques, parece claramente relacionado, aunque los diseños cambien. - La forma más sencilla de construir una marca coherente es fijar tres o cuatro constantes, como un fondo, una paleta de colores y una tipografía, y dejar que todo lo demás varíe. - Un mapa de puntos de contacto recoge cada lugar en el que un cliente se encuentra con tu marca, para que nada quede a la improvisación. - Las marcas suelen perder coherencia en los sitios que nadie diseña a propósito, como los pies de email, las facturas, la señalética y las stories rápidas. - Renderizar un mismo aspecto en cada tamaño funciona mejor que recortar una sola imagen, porque cada formato conserva sus proporciones y su espacio tranquilo para el texto. La **coherencia de marca** es lo que ocurre cuando cada punto de contacto, tus posts, tu web, tus emails, tu packaging y tus carteles, comparte suficientes ingredientes como para que la gente los reconozca como una sola familia. El método es sencillo: elige tres o cuatro constantes, normalmente un fondo o universo de color, una paleta, una tipografía y un tono de voz, y aplícalas en todas partes. Después anota cada lugar en el que los clientes se encuentran contigo y compara cada uno con esas constantes. ## Coherente significa relacionado, no idéntico Piensa en el parecido familiar. Los hermanos no son idénticos, pero comparten unos pocos rasgos que hacen evidente el parentesco. Una marca funciona igual. Si todos los diseños son idénticos, la gente deja de fijarse en ellos; si todos son distintos, deja de relacionarlos. La coherencia está en medio: constantes fijas, variables flexibles. | Mantén constante | Deja que varíe | | --- | --- | | Tu fondo o universo de color | Maquetación y composición | | Una paleta de tres a cinco colores | Qué color manda en cada diseño | | Una fuente para títulos y otra para el texto | Tamaño, peso y cantidad de texto | | Posición del logo y su área de respeto | Fotos e ilustraciones | | Tono de voz | El mensaje y su extensión | Fija la columna izquierda y varía la derecha. La mayoría de las marcas que se sienten dispersas tienen las columnas al revés: maquetas idénticas con colores al azar. El fondo es la constante que más se subestima. En redes sociales y en stories llena todo el encuadre, así que es la mayor parte de lo que se ve. Un fondo reconocible hace más por la coherencia que cualquier logo. [El aspecto propio de una marca](https://gradiently.design/es/guide/brand-signature-look) lo trata a fondo. ## Elige tus constantes Este es un ejemplo práctico para un bar de vinos de barrio. Sus constantes son un fondo ciruela profundo con un brillo ámbar cálido, una paleta en la que cada color tiene una función clara, una serif condensada para los títulos y una voz seca y cercana. Bar de vinos: fondo ciruela, brillo ámbar: `radial-gradient(circle at 30% 25%, #d97706 0%, #7c2d12 30%, #3b0a2a 65%, #1c0614 100%)` El único fondo que aparece en cada post, story, carta y cabecera de email. Su brillo se mueve según el formato; sus colores nunca cambian. - Noche ciruela (fondo): #1c0614 - Ciruela: #3b0a2a - Ámbar (acento): #d97706 - Vela (texto): #f5e9d7 - Corcho (secundario): #8a6f5c Cada color tiene una sola función. Vela es para el texto, ámbar para un único realce por diseño y corcho para la letra pequeña. Esa claridad es lo que mantiene relacionados diseños distintos. ## Mapea los puntos de contacto de tu marca Un punto de contacto es cualquier lugar en el que un cliente se encuentra con la marca. Apúntalos todos, también los aburridos. Los aburridos son donde suele romperse la coherencia, porque a nadie se le ocurrió diseñarlos. | Grupo | Puntos de contacto | Suelen olvidarse | | --- | --- | --- | | Redes | Posts, stories, portadas de Reels, foto de perfil, portadas de destacadas | Portadas de stories, reposts rápidos | | Web | Sitio web, imagen de vista previa de enlace, favicon, página de reservas | Vistas previas de enlaces, páginas de pago y de reserva | | Email | Cabecera de newsletter, emails transaccionales, firma | Recibos, cambios de contraseña, firmas del equipo | | Impresos | Carta, tarjetas de visita, carteles, flyers, packaging | Etiquetas de precio, tarjetas de mesa, facturas | | Local | Fachada, escaparate, señalética interior | Tarjeta del wifi, cartel del baño, horario | | Personas | Cómo responde el equipo al teléfono y a los mensajes | Respuestas automáticas, buzón de voz | Hasta un negocio pequeño puede tener decenas de puntos de contacto. No hace falta rediseñarlos todos a la vez; hace falta saber dónde están. - Post de Instagram 1080×1350: 1080 × 1350 - Story 1080×1920: 1080 × 1920 - Cabecera de email 1200×600: 1200 × 600 - Vista previa de enlace 1200×630: 1200 × 630 - Carta A5 1748×2480: 1748 × 2480 Cinco puntos de contacto, cinco formas. La coherencia viene de los mismos ingredientes ordenados para cada forma, no de una imagen recortada para que encaje. Un post de Instagram para una noche de vino natural sobre un fondo ciruela profundo con un cálido brillo ámbar Un post de Instagram: fondo ciruela, brillo ámbar, titular en serif condensada. Una cabecera ancha de newsletter para el mismo bar de vinos, con el mismo fondo ciruela y ámbar y la misma tipografía La cabecera del email usa otra maquetación y aun así pertenece claramente al mismo bar. ## La lista de control de la coherencia de marca Repasa esta lista con cada punto de contacto de tu mapa. Lo que falle en tres o más puntos es lo siguiente que hay que arreglar. 1. Usa el fondo o universo de color de la marca, no un color elegido solo para este diseño. 2. Usa solo colores de la paleta, cada uno en su función acordada. 3. Títulos en la fuente de títulos, texto en la fuente de texto. 4. La [variante de logo](https://gradiently.design/es/guide/logo-variations) adecuada para la forma, con su área de respeto. 5. El texto está donde se lee con facilidad, con contraste suficiente. 6. Suena a la marca: la misma voz, el mismo grado de formalidad. 7. Las fotos comparten estilo: luz parecida, tratamiento de color parecido. 8. Hecho al tamaño correcto para el formato, sin estirar ni recortar de forma torpe. 9. Actualizado: logo actual, oferta actual, horario actual. 10. Se reconocería con el logo tapado. El último punto es la prueba de verdad. Tapa el logo con el pulgar. Si el diseño podría ser de cualquiera, se está apoyando en el logo para hacer un trabajo que deberían hacer los colores, la tipografía y el fondo. [Activos de marca distintivos](https://gradiently.design/es/guide/distinctive-brand-assets) explica qué construir en su lugar. ## Dónde pierden coherencia las marcas ### Inconexa - Una plantilla nueva de otra colección cada mes - Colores de moda prestados para una campaña - Stories rápidas hechas con la app que esté abierta - Impresos diseñados por la imprenta con un logo antiguo - Cada plataforma gestionada con su propio estilo ### Coherente - Un pequeño conjunto de plantillas propias, reutilizadas - Campañas expresadas dentro de la paleta - Plantillas de stories listas para publicar rápido - Archivos de impresión exportados desde la misma fuente - Un solo aspecto, renderizado al tamaño de cada plataforma Dos hábitos hacen casi todo el trabajo: diseñar con plantillas que sean tuyas y sacar cada tamaño de un mismo diseño en lugar de empezar de cero. [Coherencia de marca en todas las plataformas](https://gradiently.design/es/guide/brand-consistency-across-platforms) cubre la parte de las plataformas, y [el cansancio de las plantillas](https://gradiently.design/es/guide/template-fatigue) explica por qué las plantillas prestadas desdibujan las marcas. Aquí es donde ayuda un Mark de Gradiently. Es un fondo vivo que se renderiza de nuevo en cada tamaño, así que el post, la story y la carta llevan el mismo aspecto con la luz colocada con sentido para cada forma. Desplaza su zona más tranquila detrás de tus palabras, y cada Mark tiene un solo propietario a la vez, así que el aspecto que une tus puntos de contacto no está uniendo también los de otra persona. ## FAQ ### ¿Qué es la coherencia de marca? La coherencia de marca significa que cada punto de contacto comparte suficientes colores, tipografía, fondos y voz como para que la gente lo reconozca como una sola marca, aunque los diseños cambien. ### ¿Cómo hago que mi marca sea más coherente? Fija tres o cuatro constantes, como un fondo, una paleta, una tipografía y una voz, haz una lista de todos los puntos de contacto y compara cada uno con esas constantes. ### ¿Qué son los puntos de contacto de una marca? Cualquier lugar donde un cliente se encuentra con tu marca: posts en redes, tu web, emails, packaging, carteles, tiques y la forma en que tu equipo responde a los mensajes. ### ¿La coherencia de marca es lo mismo que la consistencia de marca? Se solapan. La consistencia consiste en aplicar las mismas reglas cada vez; la coherencia es el resultado, que todo parezca relacionado en formatos muy distintos. ### ¿Cómo consigo que mi feed de Instagram se vea coherente? Usa el mismo fondo o universo de color, las mismas fuentes y un pequeño conjunto de plantillas propias, y varía solo la maquetación y el mensaje de un post a otro.