¡Hola! Esta es la guía de marca de ZapPost: cómo se ve la marca, cómo habla y dónde entra Zapinho. ¿Necesitas el logo o a Zapinho? Descarga los archivos.
Atajos
identidad
Logo, colores y tipografía. Lo que hace que algo parezca de ZapPost antes de que alguien lea una palabra.
Ver guía
voz
Cómo escribe ZapPost: directo, en segunda persona, sin jerga y sin cara de texto de IA.
Ver guíazapinho
La mascota de la casa. Quién es, sus seis versiones y dónde entra (y dónde no).
Ver guía
posts
Carrusel, post y historia en el kit de la propia ZapPost: slide oscuro, slide claro y para qué sirve cada color.
Ver guíaarchivos
Logo, Zapinho y fuentes para descargar, en la versión correcta para cada uso.
Ver archivosidentidad
El logo correcto en el lugar correcto, el azul en el tono correcto para cada fondo y la fuente con el peso correcto. Eso es lo que hace que algo parezca de ZapPost antes de que alguien lea una palabra.
Logo
Existen dos conjuntos de archivos y no se intercambian. El sitio usa el logo sin mascota. Las redes sociales y el material de marca usan el logo con Zapinho.
En el sitio
logo-zappost-preta.webp sobre fondo claro, logo-zappost-branca.webp sobre fondo oscuro. 38px de alto en el encabezado y 32px en el pie.
En redes y material de marca
logo-horizontal.png y logo-quadrada.png. Llevan a Zapinho y sirven para post, historia, presentación y anuncio.
Colores
El sitio tiene tema claro y tema oscuro, y sigue lo que manda el sistema de la persona. Toda regla de color considera las dos versiones. Haz clic en un color para copiar el código.
Azul primario
Son dos azules porque cada uno fue calibrado para su fondo. El #3B7BF0 sobre blanco cae a 2,7 de contraste y desaparece.
Tema oscuro
Tema claro
Tipografía
En el material nuevo (post, carrusel, historia, material de marca) la fuente es Manrope: 700 en los títulos, 400 en el texto. Para notas con aire de escritura a mano, Caveat 700.
Manrope 700 · 400 · Caveat 700
¿Cansado de abrir Canva y cerrarlo sin publicar nada?
Entras al Studio, eliges si quieres carrusel, post o guion de Reels, dices el tema y lo descargas listo para publicar. Sin pasar horas en Canva.
publica hoy, ajusta mañana
En el sitio es otra dupla. Las páginas de zappost.ai usan Clash Display en los títulos (600 y 700) y Satoshi en el texto (400, 500 y 700). Inter salió de producción con el rediseño. El destacado dentro de un título se hace con peso y color, en la misma familia.
Destacado en títulos
Cuando una parte del título recibe el azul, solo las palabras lo reciben. El punto final, el signo de interrogación y la coma quedan en el color del texto de alrededor, y en el código quedan fuera del <em>.
Tu post de mañana ya está listo.
Tu post de mañana ya está <em>listo</em>.
Tu post de mañana ya está listo.
Tu post de mañana ya está <em>listo.</em>
voz
Directa y relajada, sin ser demasiado informal. Hablamos como quien entiende el problema del cliente, con frases cortas, palabras de todos los días y nada de jerga.
Tono
Hablamos como un amigo que resuelve el problema, no como una startup vendiendo IA.
La persona del otro lado abre Instagram en la pausa del almuerzo, ve que no publicó nada esta semana y cierra la app con culpa. Con ella es con quien hablamos. Hablamos de lo que gana (el post listo, el tiempo de vuelta) y casi nunca de la tecnología que hay detrás.
Lo que usamos
- Tú, siempre. Segunda persona en todo, como en el sitio.
- Lenguaje concreto. "Notificación en el celular y ya lo descargas listo", "sin pasar horas en Canva".
- El problema antes de la venta. "¿Cansado de abrir Canva y cerrarlo sin publicar nada?"
- Verbo simple y frase corta. Si "no funcionó" lo dice, no escribimos "presentó un comportamiento inesperado".
Lo que evitamos
- Jerga de marketing y de tecnología: "solución innovadora", "revolucionar", "disruptivo".
- Hype de IA y promesas vagas. Hablamos del resultado práctico.
- Formalidad corporativa: "estimado cliente", "venga a conocer nuestra plataforma".
- Resultado garantizado. El resultado varía según el nicho y la constancia, y lo decimos.
- Raya (—) en cualquier texto público. Se convierte en punto, coma o frase aparte.
- Contar cuántas páginas tiene el sitio dentro del texto. El número cambia y nadie vuelve a corregirlo.
Marcas de IA
Nada de esto sale, y no es un gusto de ZapPost: vale para todo texto publicado, el nuestro y el de cualquier cliente.
| Qué | En su lugar |
|---|---|
| Raya (—) y semirraya (–) | Coma, punto, dos puntos o paréntesis. |
| Estructura binaria | "No es X, es Y", "menos X, más Y", "sin X, sin Y": di solo lo que es. La negación delante no suma nada. |
| Muletilla de redacción | "Cabe destacar", "es importante señalar", "en resumen", "dicho esto": bórrala. La frase funciona sin ella. |
| Tic de IA | "La lógica es la siguiente", "y eso lo cambia todo", "al final del día": ve directo a lo que viene después. |
| Superlativo de anuncio | "Revolucionario", "increíble", "poderoso", "imperdible": describe lo que hace la cosa. |
| Llamada de portal | "Sumérgete", "descubre el secreto", "no vas a creer": di el tema directo. |
| Relleno de introducción | "Hoy en día", "en el mundo actual", "cada vez más": empieza por la información. |
| Anglicismo numérico | "10+ años", "5x más grande": "más de 10 años", "cinco veces más grande". |
| Nombre interno del trabajo | "Pieza", "arte", "creativo", "copy": el nombre que usa el cliente. Post, carrusel, texto del post, historia, Reels. |
| Frase que sirve para cualquier negocio | Si la frase cabe en nutricionista, dentista y abogado sin cambiar una palabra, quien lee nota que no fue escrita para él. Usa el término del sector. Si no lo conoces, no escribas la frase. |
Cómo habla Zapinho
Dentro de la app y en las redes, la mascota tiene voz propia: optimista, juguetona, celebra las victorias pequeñas y nunca es malintencionada.
Aquí se vale la jerga ("tranqui"): es el personaje hablando, no el texto del sitio.
zapinho
Un amigo relajado, optimista y siempre listo para ayudar. Cree que todo emprendedor puede crecer en Instagram, solo necesita un empujoncito (y buenos posts, claro).
Quién es
- Optimista de más. Ve una oportunidad en todo, como ese colega que siempre está motivado.
- Relajado. Habla como amigo, no como marca.
- Interesado de verdad. Quiere saber cómo va el negocio del cliente, y no está solo vendiendo.
- Celebra las victorias pequeñas. Cada seguidor nuevo y cada venta es motivo de fiesta.
- Sin filtro positivo. Bromea, a veces es irónico, nunca es malintencionado.
Las seis versiones
Todas tienen la misma base: cuerpo azul, contorno oscuro, el globo y el rayo. Lo que cambia es el accesorio y la expresión, según el contexto.
Dónde entra
- Notificaciones dentro de la app, celebrando lo que hizo la persona.
- Anuncios y correo. Marketing fuera del sitio.
- Post, historia y Reels, siempre en una de las versiones de arriba.
- Onboarding: bienvenida, guías, tutoriales.
- Mensajes de error y de éxito, para que suenen humanos.
Dónde no entra
En las páginas de zappost.ai. Inicio, precios, herramientas, blog, ayuda: en ninguna. El sitio tiene un registro adulto y usa el logo sin mascota. Si entra, es una vez, en algún rincón de la página.
- No estirar, no deformar, no quitarle partes (el globo y el rayo son parte de él).
- No cambiar el color del cuerpo. El ajuste de contraste es la única excepción.
- No usarlo en contextos negativos o agresivos.
- No ponerlo sobre un fondo que dificulte leer la cara.
Medidas y color
- 128px de alto, como mínimo, en interfaces. 256px en material de marketing.
- 8px de respiro por todos los lados, como mínimo.
- Cuerpo en el azul de la marca:
#3B7BF0sobre fondo oscuro,#1E5FE3sobre fondo claro. Contorno#1a2e5c. - El accesorio puede tener otro color (gorro verde, signo de dólar dorado). Zapinho en sí siempre es azul.
Todavía no existen: versión en SVG, animación en Lottie y ajuste para tema oscuro (las gafas desaparecen sobre fondo oscuro).
posts
El kit zappost-marca es el del perfil de la propia ZapPost. Vale para @zappost.brasil y no se le ofrece a ningún cliente, porque es la marca de la casa y no una paleta elegida para un público.
Los dos slides
El slide alternado invierte el tema en vez de oscurecerse un poco más. Primero el alternado era el #1e2330 de las tarjetas del sitio (4% de diferencia, desaparecía en el celular), después #262c3d (1,29 de contraste, todavía sutil). En los dos intentos el error era el mismo: cambiar solo el fondo y mantener la tinta clara. Ahora el slide claro trae el par entero, fondo y tinta, y el contraste de un slide al otro es de 16,4.
Radio de esquina de 12px. Manrope 700 en el título, 400 en el texto. Caveat 700 para notas a mano.
Los colores del kit
| Nombre en el kit | Valor | Para qué |
|---|---|---|
| fundo | #14171f | Fondo del slide oscuro. |
| fundo-alt | #1e2330 | Segundo tono del mismo tema. Los dos lados del chat en el diálogo, la alternancia del explicador y del antes-y-después. |
| tinta | #eef0f5 | Texto principal en oscuro. |
| tinta-suave | #8a8f9e | Texto de apoyo en oscuro (5,55 de contraste sobre el fondo plano). |
| destaque | #3B7BF0 | Azul del slide oscuro. |
| tinta-destaque | #ffffff | Texto sobre el azul. |
| fundo-inverso | #F4F5F8 | Fondo del slide claro. |
| tinta-inversa | #14171f | Texto principal en claro. |
| tinta-suave-inversa | #5a6072 | Texto de apoyo en claro. |
| destaque-inverso | #1E5FE3 | Azul del slide claro. El #3B7BF0 sobre blanco cae a 2,7. |
| tinta-suave-foto | #c3c8d4 | Texto de apoyo sobre slide con foto. |
Alternado e inverso
Son dos cosas distintas.
- fundo-alt es el segundo tono del mismo tema, vecino del fondo. El diálogo lo usa en los dos lados del chat; el explicador, la foto anotada, la historia con fecha, el antes-y-después, la tarjeta de oferta y el creativo moderno lo usan para alternar.
- fundo-inverso es el tema opuesto, con fondo y tinta cambiados juntos.
Cuando el inverso ocupó el nombre fundo-alt, el diálogo salió con globo blanco y texto blanco, y un slide entero blanco con la firma invisible. Nadie había tocado el diálogo.
Sobre foto
El gris de apoyo normal (#8a8f9e) fue calibrado contra el fondo plano. Con una imagen debajo cae a 2,51 en las partes claras y desaparece. En un slide con foto, el texto de apoyo usa tinta-suave-foto (#c3c8d4), que aguanta 4,83 en el peor tramo.
Sitio y redes
Logo sin mascota. Tema claro y oscuro automático. Inter, en revisión. Zapinho como máximo una vez, en algún rincón.
Logo con Zapinho. Manrope y Caveat. El kit de arriba, con slide oscuro y slide claro alternando. Zapinho habla con su propia voz.
El producto
Donde vive el cliente: studio.zappost.ai, en tema oscuro. Captura de referencia de tono y de color.
archivos
El logo, Zapinho y las fuentes, listos para descargar. Usa la versión correcta para cada lugar: sin mascota en lo que habla del producto, con Zapinho en las redes.
Logos
PNG para el logo con Zapinho, WebP para el logo del sitio.
| Horizontal con Zapinho | logo-horizontal.png (1365 × 768) |
| Cuadrado con Zapinho | logo-quadrada.png (1080 × 1080) |
| Sitio, fondo claro | logo-zappost-preta.webp |
| Sitio, fondo oscuro | logo-zappost-branca.webp |
Zapinho
Las seis versiones, en PNG de 1024 × 1024 con fondo blanco.
| Fiesta | zapinho-comemorando.png |
| Admiración | zapinho-com-estrelas-nos-olhos.png |
| Dinero | zapinho-pensando-em-dinheiro.png |
| Amor | zapinho-apaixonado.png |
| Relajado | zapinho-de-oculos.png |
| Vaquero | zapinho-cowboy.png |
Fuentes
Las cuatro son gratuitas. Las de las piezas están en Google Fonts; las del sitio, en Fontshare.
| Manrope | fonts.google.com/specimen/Manrope. 700 en los títulos, 400 en el texto. |
| Caveat | fonts.google.com/specimen/Caveat. 700, para notas con aire de escritura a mano. |
| Clash Display | fontshare.com/fonts/clash-display. 600 y 700, en los títulos del sitio. |
| Satoshi | fontshare.com/fonts/satoshi. 400, 500 y 700, en el texto del sitio. |
Cómo usar
- Logo sin mascota en todo lo que habla del producto: sitio, presentación, documento.
- Logo con Zapinho en las redes sociales y en anuncios.
- No lo estires, no lo recortes y no le cambies el color. Sobre fondo oscuro, usa la versión blanca.
- Zapinho mide como mínimo 128px de alto en pantalla y lleva 8px de respiro alrededor.
¿Un uso que no está aquí? Habla con nosotros.