EXPE — Esports Experience Production & Entertainment. Sistema visual Arena Slash: gamer profesional, premium, competitivo, tecnológico, moderno y oscuro. Que EXPE se perciba como una productora tecnológica especializada en esports y entretenimiento, no como un team gamer genérico.
Legibilidad → Limpieza → Impacto
Fundamento
Para qué existe EXPE.
Misión
Producir transmisiones y experiencias de esports con estándar de televisión, para que cada torneo —sin importar su tamaño— se vea, se sienta y se recuerde como un gran evento. Lo hacemos con tecnología propia que lee la competencia en tiempo real, un equipo que dirige en vivo y una obsesión por que el dato en pantalla nunca pase por manos humanas.
Visión
Ser la productora de referencia en esports de habla hispana: el estándar que un organizador espera cuando quiere que su competencia se vea profesional, y la casa donde jugadores, marcas y audiencias se encuentran alrededor de un mismo momento.
Precisión
El dato llega del juego, no de alguien tipeando. Si está en pantalla, es verdad.
Oficio
Una transmisión se dirige, no se deja correr. Hay alguien decidiendo qué ve el público, siempre.
Respeto por la competencia
La producción existe para que se entienda el juego, no para taparlo con adornos.
Palabra
Prueba técnica el día anterior, grabación entregada y la identidad guardada para la próxima edición.
Logotipo
Wordmark, isotipo y versiones.
El wordmark es la firma principal. La X es protagonista y el slash rojo la atraviesa recortando las letras: ese corte es el gesto que identifica la marca y no debe rellenarse.
Logo principal
Uso por defecto en web, presentaciones y overlays de transmisión.
Isotipo (XP)
Avatar, favicon, marca de agua y emblema de esquina en pantalla.
Alternativa 01 · con descriptor
Primera aparición de la marca ante un público nuevo.
Alternativa 02 · horizontal
Cabeceras estrechas, firmas de correo y banners horizontales.
Alternativa 03 · monocromática
Una sola tinta, bordados, grabados y fondos claros.
Área de resguardo
Deja libre, como mínimo, la altura de la E del wordmark en los cuatro lados. Nada entra en ese margen: ni texto, ni bordes, ni otro logo.
Tamaño mínimo
Wordmark completo: 96 px de ancho en pantalla, 25 mm impreso. Isotipo XP: 24 px. Por debajo de eso, el slash deja de leerse y se pierde la marca.
Fondos permitidos
Negro, gris muy oscuro o fotografía oscura con suficiente contraste. Sobre fondo claro o imagen compleja, usa la versión monocromática.
Qué no hacer
No lo estires ni lo comprimas, no lo rotes, no le cambies el color al slash, no le pongas sombra ni contorno, y no lo encierres en una caja de color.
Color
Setenta, veinte, diez.
El rojo se usa como acento: marca lo importante y desaparece del resto. Si el rojo domina la pantalla, algo está mal aplicado.
Background
#090909
Fondo maestro de todo el sitio
Surface
#151515
Tarjetas, paneles y bandas de sección
Surface Alt
#1C1C1C
Nivel elevado: paquete destacado, celdas activas
Primary Red
#9E111B
Botón principal en reposo, bordes de énfasis
Accent Red
#D11A26
Hover, slashes, cifras, estado en vivo
Text Primary
#F5F5F5
Titulares y texto de lectura
Text Secondary
#8A8A8A
Bajadas, descripciones, metadatos
Border
#2A2A2A
Separadores, marcos y grillas
Tipografía
Rajdhani para gritar, Inter para explicar.
Rajdhani aporta la voz competitiva: condensada, angular, en mayúsculas. Inter sostiene toda la lectura. Ambas son gratuitas y de código abierto, servidas desde el propio dominio.
Display · Títulos
Rajdhani
ABCDEFGHIJKLMNÑOPQRSTUVWXYZ 0123456789
Pesos en uso: 600 SemiBold y 700 Bold. Siempre en mayúsculas para titulares, con interlineado cerrado (0.86 – 0.95).
UI · Texto
Inter
ABCDEFGHIJKLMNÑOPQRSTUVWXYZ 0123456789
Pesos en uso: 400 Regular, 500 Medium y 600 SemiBold. Interlineado 1.65 – 1.75 para lectura cómoda sobre fondo oscuro.
| Rol | Fuente | Peso | Tamaño | Ejemplo |
|---|---|---|---|---|
| Hero | Rajdhani | 700 Bold | clamp(3rem · 8.5rem) | PRODUCIMOS |
| H1 | Rajdhani | 700 Bold | clamp(2.4rem · 5.2rem) | Cuéntanos de tu torneo |
| H2 | Rajdhani | 700 Bold | clamp(2rem · 3.9rem) | Quince piezas |
| H3 | Rajdhani | 600 SemiBold | 1.3 – 1.7rem | Ponemos el observer |
| Body | Inter | 400 Regular | 0.95 – 1.05rem | El dato llega del juego, no de alguien tipeando. |
| Buttons | Inter | 600 SemiBold | 0.875rem | Cotizar mi torneo |
| Labels | Inter | 500 Medium | 0.62 – 0.69rem · tracking 0.2em | AL AIRE · DOTA 2 |
Lenguaje visual
Qué sí y qué no.
Este es el filtro que separa una productora tecnológica de un team gamer genérico. Ante la duda, se quita.
Usar con moderación
- Diagonales y slashes, con moderación y siempre en el mismo ángulo.
- Esquinas cortadas para botones y tarjetas destacadas.
- Líneas técnicas, frames y grillas muy sutiles como textura de fondo.
- Referencias a HUD y a lenguaje de broadcast: etiquetas, contadores, estados.
- Fade, slide corto, reveal y slashes que se dibujan al entrar en pantalla.
- El rojo como acento que marca lo importante, nunca como fondo dominante.
Evitar siempre
- RGB excesivo o degradados multicolor de gaming genérico.
- Neón exagerado y glow alrededor de todo.
- Mascotas, criaturas o personajes de team gamer.
- Fuego, rayos, chispas y efectos de energía.
- Interfaces recargadas: si compite con la competencia, sobra.
- Movimiento constante, flashes o partículas que distraigan de la lectura.
Same game. Bigger stories.
¿Necesitas los archivos del logo en SVG, PNG o vectorial para un patrocinador o una pieza impresa? Escríbenos a contacto@expe.app.