CEA · USB Cali Marca · Propuesta
Cuatro piezas,
un mismo CEA.
Identidad propuesta para el Centro de Innovación Pedagógica y Educación Digital: un estándar que se mantiene y un nombre que evoluciona, construidos con el mismo módulo.
Propuesta de marca Pendiente de validación institucional. El encabezado del sitio ya muestra el logotipo de la Universidad junto al símbolo del CEA; el resto de la identidad actual sigue en uso hasta su aprobación.
Una sigla que es estándar,
un nombre que evoluciona.
CEA · el estándar
Cuatro piezas · la innovación
En la educación superior colombiana, CEA nombra al Centro de Enseñanza y Aprendizaje. La oficina de la USB Cali hoy es el Centro de Innovación Pedagógica y Educación Digital, pero conserva la sigla. Mantenerla es una decisión de pertenencia: el Centro sigue hablando el idioma común del sector.
La marca traduce esa doble condición. El cuadrado es el estándar: una forma completa, estable y reconocible, como el lugar del CEA en cualquier universidad. Las piezas que lo forman son la evolución: la innovación pedagógica se entiende como reorganizar, ensayar y encajar, y el módulo de la retícula es un píxel, la unidad de lo digital.
El tetris es reconocible por cualquier generación y remite a aprender jugando: probar, girar, acomodar hasta que el conocimiento encaja. Cuatro formas distintas no se bastan solas; juntas cierran el cuadrado. Es la idea que el sitio enuncia: muchas posibilidades, un mismo propósito.
L superior
Formación Docente
Abre el cuadrado por arriba y lo acompaña: la formación es el punto de partida de la práctica docente.
L interior
Gestión Curricular
Se entrelaza con Formación: currículo y formación no se separan. En el equipo, una misma profesional acompaña ambas áreas.
Cuadrado
Educación Digital
La base estable sobre la que se apoya el resto: ambientes virtuales, plataformas y modalidades.
Columna
Inteligencia Artificial
El eje vertical que atraviesa todas las filas: la IA es transversal al modelo pedagógico.
Evolución, no ruptura. El color de tres piezas viene del logotipo actual del CEA (naranja, azul y turquesa), y el naranja coincide con el institucional de la Universidad de San Buenaventura. La Inteligencia Artificial entra con un violeta nuevo, porque es lo nuevo del Centro.
Un símbolo,
tres estados.
La forma cambia de estado según el mensaje;
las piezas y su orden nunca cambian.
C, E y A
en la misma retícula.
Cada letra mide 3 × 4 módulos:
la altura exacta del símbolo.
- C Naranja San Buenaventura · heredado del logotipo actual
- E Azul CEA · heredado del logotipo actual
- A Turquesa CEA · heredado del logotipo actual
Las letras no son una fuente: se dibujan con el mismo módulo, la misma separación y los mismos radios que las piezas. La A tiene techo plano y contraforma cuadrada para que cada módulo toque a otro por un lado; así la letra es una sola forma continua, como cada pieza. El descriptor se compone en Montserrat, la tipografía de la Universidad para los nombres de sus dependencias, y se ubica tras una línea divisoria a la altura de cuatro módulos.
Construcción
y área de protección.
- Módulo (m)
- Celda de la retícula 4 × 4. Todo se mide en módulos.
- Separación
- 0,16 m entre piezas y entre letras.
- Radio
- 0,16 m en esquinas exteriores; la mitad en las interiores.
- Área de protección
- 1 m libre alrededor de cualquier versión.
- Tamaño mínimo
- Símbolo: 16 px · 8 mm. Horizontal: 120 px · 30 mm (sin descriptor por debajo de 180 px · 45 mm).
Versiones
del logo.
Horizontal Versión principal. Sitio, documentos, presentaciones.
Vertical Piezas altas, pendones, portadas.
Horizontal sin descriptor Cuando el nombre completo ya aparece cerca.
Símbolo Avatares, favicon, sellos, espacios cuadrados.
Respaldada Comunicaciones externas sin el logo oficial de la USB al lado.
Color sobre noche Fondos oscuros de la marca.
Una tinta Impresión a una tinta, sellos, grabado.
Negativo Sobre fotografía o fondos de color.
Color
de las cuatro áreas.
Tono para papel y tono para noche;
validados para daltonismo y contraste.
- Noche #f37012
Naranja San Buenaventura
Formación Docente
- HEX
- #f37012
- RGB
- 243 112 18
- CMYK*
- 0 54 93 5
- Sobre papel
- 2,8:1 · Solo gráfico
- Noche sobre noche
- 5,6:1 · AA texto
- Noche #5b78f0
Azul CEA
Gestión Curricular
- HEX
- #0860a0
- RGB
- 8 96 160
- CMYK*
- 95 40 0 37
- Sobre papel
- 6,3:1 · AA texto
- Noche sobre noche
- 4,2:1 · AA grande
- Noche #14b0bd
Turquesa CEA
Educación Digital
- HEX
- #1399b0
- RGB
- 19 153 176
- CMYK*
- 89 13 0 31
- Sobre papel
- 3,3:1 · AA grande
- Noche sobre noche
- 6,3:1 · AA texto
- Noche #a66cf0
Violeta IA
Inteligencia Artificial
- HEX
- #8a5cf6
- RGB
- 138 92 246
- CMYK*
- 44 63 0 4
- Sobre papel
- 4,1:1 · AA grande
- Noche sobre noche
- 4,7:1 · AA texto
Noche #0d2227 · Fondos inmersivos
Tinta #183a43 · Texto y versión a una tinta
Papel #fafbf7 · Fondo de lectura
* CMYK aproximado por conversión directa; requiere prueba de impresión y perfil del proveedor. Las piezas son color gráfico: para texto sobre papel se usa la tinta. El azul cumple AA en texto; el violeta y el turquesa, solo en titulares grandes; el naranja sobre papel, solo como forma.
Tipografía
de la marca.
Aa
Manrope
Titulares y cifras. Geométrica y abierta, conversa con el módulo. Pesos 500 y 700.
Aa
Source Sans 3
Texto corrido, navegación y formularios. Cómoda en párrafos largos. Pesos 400 y 600.
01
Monoespaciada del sistema
Rótulos, numeración y metadatos, en mayúsculas espaciadas. Remite al código y al dato.
Montserrat
Nombre de la dependencia, es decir, el descriptor del logo: «Centro de Innovación Pedagógica y Educación Digital». Es la tipografía de la imagen corporativa de la Universidad para sus dependencias internas. Se usa en Light, Regular y Bold, en normal o en cursiva según el uso. En los logos el descriptor va todo en Bold, en normal.
Solo para el nombre de la dependencia: titulares, texto y cifras siguen en las tipografías anteriores.
Las cuatro son libres (licencia OFL). El sitio sirve localmente Manrope y Source Sans 3; Montserrat solo se carga en esta página y se entrega en el kit, en la carpeta fuentes.
Recursos
gráficos.
Glifos de área Cada pieza sola funciona como ícono de su área: viñetas, menús, señalética.
Retícula de puntos El campo de fondo: puntos de 1 px cada 28 px, a baja opacidad.
Pieza en partículas Portadas por área y fondos de presentaciones.
Red Líneas finas con pulsos para mostrar conexiones entre áreas y personas.
Movimiento
con sentido.
- Ensamblar Las piezas llegan en turnos hasta cerrar el cuadrado. Para aperturas y cierres.
- Dispersar Se separan en partículas. Para transiciones entre temas.
- Pulsar Un punto recorre una línea de la red. Para mostrar relaciones.
- Iluminar La pieza activa sube de intensidad y las demás se atenúan. Para destacar un área.
Curva compartida cubic-bezier(.16, 1, .3, 1); 250–600 ms en interfaz y 1,2–2 s en piezas audiovisuales. Con movimiento reducido, el símbolo aparece ensamblado y quieto.
Usos
incorrectos.
No girar ni reubicar piezas
No cambiar los colores de las áreas
No usar contornos
No añadir sombras ni efectos
No deformar
No usar sobre fondos sin contraste
Respaldo de
la Universidad.
Marca respaldada: el CEA habla con voz propia
y siempre como parte de la USB Cali.
Universidad de San Buenaventura
- El logotipo de la Universidad va primero, sin modificarse, a la misma altura visual del símbolo del CEA.
- Entre ambos, una línea de tinta al 35 % con 2 módulos de separación a cada lado.
- Cuando el logotipo de la USB no esté presente, se usa la versión respaldada con la línea «Universidad de San Buenaventura Cali».
- Los sellos de acreditación y vigilancia se ubican en la zona institucional de cada pieza, no junto al logo del CEA.
Aplicaciones
de referencia.
Maquetas para orientar la producción;
los textos son de ejemplo.
Avatar para redes
Plan de Formación Docente
Siempre hay algo nuevo por aprender.
Publicación 4:5
Nombre Apellido
Cargo · Centro de Innovación Pedagógica y Educación Digital
Firma de correo
Muchas posibilidades. Un mismo propósito.
Pendón
Nombre Apellido
Docente participante
Credencial de evento
Fondo de videollamada
Descargas
del kit.
Generado desde la misma geometría del sitio
con scripts/render-brand.ts.
| Versión | Color | Color noche | Una tinta | Negativo | Naranja | Píxel |
|---|---|---|---|---|---|---|
| Horizontal | SVG | SVG | SVG | SVG | SVG | SVG |
| Horizontal sin descriptor | SVG | SVG | SVG | SVG | SVG | SVG |
| Vertical | SVG | SVG | SVG | SVG | SVG | SVG |
| Símbolo | SVG | SVG | SVG | SVG | SVG | SVG |
| Logotipo | SVG | SVG | SVG | SVG | SVG | SVG |
| Respaldada | SVG | SVG | SVG | SVG | SVG | SVG |
Recursos expresivos (SVG)
Aplicaciones (PNG)
Tipografía Montserrat (WOFF2 y licencia)
Los SVG con descriptor incrustan Montserrat Bold; la versión respaldada incrusta además Manrope para la línea de la Universidad. Para producción en imprenta, el diseñador debe convertir el texto a curvas.