¿Necesitas ayuda? Escriba su cadena de búsqueda. Se requiere un mínimo de 4 caracteres.

Buscar Artículos

Abrir lista de categorías

Identidad Visual de IDEA Aeronautica

Tabla de contenidos
  1. 1. Logos
  2. 2. Paleta de colores
  3. 3. Tipografia
  4. 4. Componentes visuales del ERP
  5. 5. Archivos fuente (Drive)
  6. 6. Referencia
Nivel: N3 – Coordinadores / Diseno
Fuente de verdad de la identidad visual de IDEA Aeronautica. Todo material grafico, interfaz de usuario, documento o pieza de comunicacion debe respetar estas definiciones. Los archivos fuente (logos, iconos, fuentes) se encuentran en Google Drive.
PENDIENTE: Los archivos fuente de logos (AI, SVG, PNG) deben subirse a una carpeta estandarizada en Google Drive y enlazarse aqui. Mientras tanto, este documento define las reglas que aplican.

1. Logos

1.1 Logo principal

ElementoEspecificacion
NombreIDEA Aeronautica — Logo horizontal
Uso principalHeader del ERP, documentos oficiales, papeleria
Formatos disponiblesSVG (vectorial), PNG (fondo transparente), AI (editable)
Fondo claroLogo en color original (azul oscuro + acento)
Fondo oscuroLogo en blanco (version invertida)
Espacio de respetoMinimo 1x la altura del icono alrededor del logo
Tamano minimo120px de ancho (digital) / 3cm (impreso)

1.2 Variantes del logo

VarianteUsoDonde
Horizontal completoIcono + texto «IDEA Aeronautica»Header del ERP, documentos, web
Icono soloSolo el simbolo (sin texto)Favicon, app icon, avatar en chats
Vertical / apiladoIcono arriba, texto abajoUniformes, merchandising, posters
MonocromaticoTodo en un solo color (azul o blanco)Sellos, fondos complejos, impresion B/N

1.3 Logos de unidades de negocio

UnidadLogoRelacion con marca madre
CIA (Centro de Instruccion Aeronautica)Variante del logo IDEA + «CIA»Submarca — hereda paleta principal
AerotiendaLogo propioSubmarca — paleta compatible
BistroLogo propioSubmarca — paleta compatible
Base NauticaLogo propioSubmarca — paleta compatible
OMA (Organizacion de Mantenimiento)Variante del logo IDEA + «OMA»Submarca — hereda paleta principal

2. Paleta de colores

2.1 Colores primarios

NombreHEXRGBUso
Azul IDEA (principal)#1d4ed829, 78, 216Botones primarios, header, links, acciones principales
Azul oscuro (sidebar)#1e293b30, 41, 59Sidebar, fondos oscuros, texto principal
Blanco#ffffff255, 255, 255Fondos de cards, texto sobre oscuro
Gris claro (fondo)#f8fafc248, 250, 252Fondo general del dashboard, areas de contenido

2.2 Colores semanticos

NombreHEXUsoEjemplo
Verde (exito)#16a34aConfirmaciones, pagos exitosos, estatus «Al dia»Badge «Activo», pago aprobado
Ambar (alerta)#f59e0bAdvertencias, vencimientos proximos«Certificado vence en 5 dias»
Rojo (error/peligro)#dc2626Errores, mora, estatus «Suspendido»«Cuota vencida», badge «Vencido»
Morado (UX/info)#a855f7Tips, callouts informativos, onboardingTooltips de guia, tour de bienvenida
Azul claro (info)#3b82f6Callouts informativos, links secundariosBanners de nivel, notas informativas

3. Tipografia

UsoFuentePesoTamanoEjemplo
Titulos (h1)InterBold (700)32pxNombre de la pagina: «Mi Panel»
Subtitulos (h2)InterSemibold (600)24pxSecciones: «Requiere tu atencion»
Subtitulos (h3)InterMedium (500)18pxSubsecciones dentro de cards
CuerpoInterRegular (400)14-16pxTexto general, tablas, formularios
EtiquetasInterMedium (500)12pxBadges, tags, labels de formulario
Codigo / tecnicoJetBrains MonoRegular13pxNombres de tablas, SQL, IDs tecnicos

Fuente de carga: Google Fonts — Inter | Google Fonts — JetBrains Mono

4. Componentes visuales del ERP

ComponenteEstiloEspecificacion
CardsFondo blanco, borde redondeado 12px, sombra suaveshadow-sm, hover: shadow-md con transicion 300ms
Botones primariosAzul IDEA (#1d4ed8), texto blanco, redondeado 8pxHover: #1e40af (mas oscuro). Padding 10px 20px
Botones secundariosBorde azul, fondo transparente, texto azulHover: fondo azul 10% opacity
InputsBorde gris #d1d5db, redondeado 8px, foco azulFocus: ring azul 2px. Placeholder gris claro
Badges / TagsPill shape, fondo semitransparente del color«Activo» = verde, «Vencido» = rojo, «Alumno CIA» = azul
TablasHeader gris claro, filas alternadas, hover highlightBordes sutiles. Texto alineado izquierda
IconosLucide Icons (open source)Tamano 20px en menu, 16px inline. Stroke 1.5px

5. Archivos fuente (Drive)

PENDIENTE DE ESTANDARIZAR: Se debe crear la siguiente estructura en Google Drive y enlazar aqui: 
Google Drive / IDEA / Identidad Visual /
├── Logos/
│   ├── IDEA-horizontal-color.svg
│   ├── IDEA-horizontal-blanco.svg
│   ├── IDEA-icono-color.svg
│   ├── IDEA-icono-blanco.svg
│   └── Submarcas/ (CIA, Aerotienda, Bistro, OMA...)
├── Paleta/
│   ├── paleta-colores.pdf
│   └── tailwind-config.json (colores para desarrollo)
├── Tipografia/
│   └── (links a Google Fonts — no se descargan)
└── Templates/
    ├── Presentacion-IDEA.pptx
    ├── Documento-oficial.docx
    └── Firma-email.html

6. Referencia

DocumentoRelacion
Diseno de Interfaz del Modulo de UsuariosAplica estos colores, fuentes e iconos en los mockups
Stack TecnologicoTailwind CSS + shadcn/ui implementan esta identidad
Definicion de Estandar PremiumFilosofia de calidad visual y de servicio
Mercadeo — Identidad visual de marcaComo se aplica la marca en merchandising, gorras, termos, papeleria
Nomenclatura — Identidad Institucional (941/964)Codigos documentales de la identidad corporativa
0
0
4
  • Facebook
  • Twitter
  • Linkedin