Manual de
marca
Identidad, sistema de diseño y voz de Escena Agency, para quien diseña, escribe o presenta en su nombre.
En este manual
Nueve capítulos para usar la marca con criterio. Hazles clic para saltar, copia colores y textos con un toque, y pruébalo todo en vivo.
Estrategia
Tu marca en el centro de la escena
Y tus resultados en primer plano. Es la promesa con la que Escena abre su portafolio y la frase que ordena todo lo demás.
Borrador por aprobarPoner a las marcas en el centro de la escena y a sus resultados en primer plano.
Tomado del portafolio de EscenaEscalar el negocio de nuestros clientes de forma medible y sostenible, con estrategias de marketing 360 y servicios enfocados en sus verdaderas necesidades.
Adaptada del portafolio de EscenaSer la agencia creativa de referencia en Colombia para marcas que quieren crecer en digital.
Propuesta nueva: por validarCinco ideas que guían cada pieza
Estrategia antes que estética
Cada pieza responde a un objetivo de negocio.
Resultados medibles
Prometemos lo que podemos medir.
Cercanía
Hablamos de tú y sin jerga.
Cuidado cinematográfico
El detalle visual es parte del resultado.
Tecnología con criterio
IA, Shopify, Meta y Firebase al servicio de la idea, no al revés.
Cuatro frentes, una sola estrategia
Branding
Diseño de marca · Identidad visual · Estrategia comunicativa
Web design y ecommerce
Diseño web con IA · Desarrollo web · E-commerce con Shopify
Digital marketing
Gestión de redes · Pauta en redes · Estrategia digital con IA
Producción audiovisual
Video reels · Fotografía profesional · Producción
Fuente: portafolio de Escena Agency.
Logo
Tres piezas, una mirada
- La C. Una forma abierta, como un encuadre. Es la pieza que se recorta con fotos: el isotipo ventana.
- El chevron. La flecha cortada de la C. Se reutiliza como viñeta en listas y en el avance de las láminas.
- El ojo. El punto. Su altura mide la zona de seguridad que debe respirar el logo.
Lectura de la forma propuesta a partir del uso real del isotipo en el sistema de diseño.
Elige un fondo, mira el logo
Fondo
Versión de color
Formato
Deja respirar el logo
Alrededor del logo queda libre, como mínimo, el alto del ojo (x). Nada entra en esa franja: ni texto, ni bordes, ni otros logos.
120 px de ancho
30 mm impreso
20 px de alto
6 mm impreso
- Fondo claro: versión a color o negra.
- Fondo oscuro o foto: versión blanca. Crema en piezas cálidas.
- Una sola tinta: negro o blanco, nunca otro color.
Lo que nunca hacemos
Color
Rojo y naranja, sobre la noche
Toca un color para copiar su valor. Rojo y naranja son los colores oficiales del manual original; el resto viene del sistema de diseño. CMYK es aproximado: confirma con una prueba de impresión.
De naranja a rojo
Pasa el cursor por cada franja.
La marca vive en la oscuridad y el color es el punto de luz. Cuanto más se contiene el rojo, más pesa cada vez que aparece.
Qué combinaciones se leen
| Muestra | Combinación | Ratio | Texto normal | Texto grande | Uso |
|---|
Ratios calculados con la fórmula de contraste de WCAG 2.1. Normal exige 4,5:1 y grande (24 px, o 19 px en negrita) exige 3:1.
Noche y papel
El acento cambia con el modo: naranja sobre oscuro, rojo sobre claro. Las láminas de escena (portadas, divisores, cierres) siempre van en oscuro.
Tipografía
ABCDEFGHIJKLMNÑOPQRSTUVWXYZ
abcdefghijklmnñopqrstuvwxyz
áéíóú üÁÉÍÓÚ ¿?¡! 0123456789 $.,:;·%
Una sola palabra por titular, el número de sección (01/), una cita o una frase clave dentro del cuerpo.
- Geomanist para titulares (Bold o Ultra, en mayúsculas), cuerpo (Light o Regular) y botones.
- Baramond solo en itálica y solo como acento. Nunca en párrafos largos ni en botones.
Siete roles, una lógica
Diez tamaños
Estos tamaños son los tokens del sistema de diseño. En láminas, redes y web se escalan con el contenedor, no con la pantalla.
- Interlineado: 0,9 en display, 1,15 en títulos, 1,5 en cuerpo.
- Tracking: −0,02 em en titulares, +0,18 em en etiquetas.
- Línea: máximo 65 caracteres en texto corrido.
- Cifras: tabulares siempre que se alineen en columna.
Imagen
Cine, no stock
Escala humana
Una figura pequeña frente a un paisaje enorme. El cliente es quien mira hacia adelante.
Un punto de luz
La oscuridad rodea una ventana brillante. La luz marca dónde mirar.
Rojo gradado
Toda imagen pasa por la gradación de marca, de rojo a naranja. Sin filtros extra.
Aire para el texto
Un lado oscuro y despejado, normalmente el izquierdo, queda para el titular.
Doce escenas
La imagen que elijas aquí se usa en el compositor y en el isotipo ventana de la siguiente lámina.
Imagen, sombra y titular
Sombra
Imagen
Isotipo ventana
La foto llena la forma del isotipo. Se usa a un lado de las láminas de contenido y como recurso en portadas de redes.
Iconografía
Trazo fino
- Grilla de 24 px.
- Trazo de 2 px con terminaciones redondas.
- Un solo color, el del texto que lo acompaña.
Color
El vocabulario
Código de barras
Esquina superior derecha de las láminas. Es decorativo y no se rellena.
Círculos discontinuos
Progreso o paginación. El círculo continuo marca dónde estás.
Píldora de contorno
Etiqueta de sección y botones secundarios. Es de las pocas formas redondas.
Siguiente
Círculo con flecha hacia abajo, abajo a la derecha, para invitar a seguir.
- Marca
- Web
Viñeta chevron
La flecha cortada del isotipo, con el degradado de marca.
Número de sección
Baramond itálica, seguido de barra. Marca el orden de una serie.
Isotipo recortado
Gigante y blanco, cortado por el borde derecho en láminas oscuras.
Isotipo ventana
Una foto de marca dentro de la forma. Esquinas de resto siempre rectas.
Voz y tono
Habla como alguien que ya vio la escena
Cercana sin ser informal, cinematográfica sin exagerar, siempre con algo concreto que decir.
Escala propuesta: por validarDecimos y evitamos
- Tuteo. Siempre "tú", nunca "usted".
- Verbo primero. Los botones son órdenes cortas: Agenda, Cotiza, Ver.
- Cifras reales. Si no se puede medir, no se promete.
- Precios en pesos, con puntos de miles: $1.850.000. El descuento se muestra como "precio especial".
- WhatsApp es el canal principal de contacto.
Mismo mensaje, dos voces
Los textos de ejemplo son ilustrativos. Cambia [nombre] por el de quien escribe.
Aplicaciones
Láminas de propuesta
Formato 16:9 de 1920 × 1080. Portada, sección, contenido y cierre: oscuras y cinematográficas, alternadas con láminas blancas de contenido.
Lenguaje editorial
El portafolio lleva el vocabulario al máximo: titular en Geomanist y Baramond, píldoras de contorno, código de barras y la imagen a pantalla completa.
Redes, web y papelería
47 componentes
Botones
Agenda tu llamadaVer propuestaPrecio especial
- Identidad completa
- Manual de marca
Proceso
Formulario
Cotiza tu proyectoEtiquetas
Nuestros serviciosGracias totalesLogo
Llévatelo contigo
Copia el SVG del isotipo en cada tinta, los tokens CSS o la paleta, y pégalos donde los necesites. Los PNG oficiales se abren en una pestaña nueva.