SiCROA

🎯 Visión General

SiCROA - HANGAR (Sistema Integral de Control de Operaciones Aeronáuticas) es una plataforma enterprise diseñada para unidades de aviación gubernamentales y privadas que requieren centralizar y digitalizar sus procesos operativos críticos.

La arquitectura modular del sistema permite escalar funcionalidades según las necesidades de la organización, manteniendo coherencia visual mediante un Design System documentado y facilitando el trabajo colaborativo entre equipos técnicos, operativos y administrativos.

Impacto principal:

• ✅ Centralización de procesos operativos, de mantenimiento y administrativos en una única plataforma
• ✅ Coherencia visual y funcional garantizada por un Design System integrado con Figma
• ✅ Escalabilidad modular para adaptarse a diferentes tamaños de flota y complejidad operativa
• ✅ Colaboración eficiente entre equipos técnicos y operativos con flujos de trabajo documentados

📚 Introducción y Guías Generales

1.1. Propósito del Documento

Este manual tiene como objetivo guiar a los usuarios en el uso eficiente y seguro del sistema, proporcionando una referencia visual y funcional de cada módulo, pantalla y componente. Sirve como fuente única de verdad para:

• Onboarding de nuevos usuarios y equipos
• Consulta rápida de funcionalidades y flujos de trabajo
• Estándares de implementación para desarrolladores
• Criterios de aceptación para QA y testing

1.2. SiCROA - HANGAR

SiCROA es una plataforma digital diseñada para centralizar, controlar y optimizar los procesos operativos del entorno aeronáutico. Su arquitectura modular permite:

• 🧩 Escalabilidad funcional: Añadir nuevos módulos sin afectar el núcleo del sistema
• 🎨 Coherencia visual: Design System unificado que garantiza consistencia en toda la interfaz
• 🤝 Trabajo colaborativo: Herramientas y flujos que conectan equipos técnicos y operativos
• 🔐 Gobernanza integrada: Roles, permisos y auditoría nativos en cada capa de la aplicación

1.3. Audiencia del Manual

1.4. Uso del Design System en el Manual

El manual se apoya directamente en el Design System completo y el diseño de interfaces documentados en Figma, lo que asegura coherencia entre diseño y desarrollo.

🔹 Fundamentos Visuales

• Tipografía: Escala tipográfica basada en Montserrat Inter con jerarquías definidas para títulos, cuerpos y etiquetas

• Paleta de colores: Sistema semántico con tokens para primarios, estados (success/warning/error) y modos claro/oscuro.}

• Espaciados: Escala de 4px para márgenes, paddings y gaps consistente en toda la aplicación

• Jerarquía visual: Patrones de composición para cards, secciones y páginas que guían la atención del usuario

Componentes Base

🔹 Componentes de Aplicación

• Tablas avanzadas: Sorting, filtering, pagination y acciones en lote con TanStack Table
• Navegación: Sidebar colapsable, breadcrumbs y menú contextual adaptativo
• Cards informativas: Patrones para KPIs, resúmenes de entidad y vistas preliminares
• Formularios complejos: Wizards, validación en tiempo real y guardado automático

🔹 Buenas Prácticas Integradas

• ♿ Accesibilidad: Cumplimiento WCAG 2.1 AA, roles ARIA semánticos y navegación por teclado
• 🎯 Consistencia: Patrones de interacción reutilizables y lenguaje uniforme en toda la plataforma
• 🚀 Escalabilidad: Componentes diseñados con props extensibles y hooks reutilizables
• 🌐 Internacionalización: Estructura preparada para i18n con separación de contenido y lógica

💡 Solución Clave

• Arquitectura monorepo escalable: Separación clara entre frontend (React + Vite) y backend (Node.js + Express) comunicándose exclusivamente vía API REST versionada /api/v1, facilitando el mantenimiento y despliegue independiente.

• Módulos funcionales especializados: 8 dominios de negocio interconectados que cubren el ciclo completo de operaciones aéreas.

• Design System integrado con Figma: Componentes documentados, tokens de diseño sincronizados y prototipos interactivos que reducen la brecha entre diseño y desarrollo.

• Integración con servicios externos: Conexión segura con APIs de NOTAM (NMS-API) y datos meteorológicos (AWC), permitiendo planificación de vuelos con información actualizada sin salir de la plataforma.

• Gestión documental inteligente: Sistema de alertas automáticas para vencimiento de documentos de personal y aeronaves, con almacenamiento seguro de archivos y generación de PDFs para reportes oficiales.

⚙️ Stack Técnico

📊 Resultados

• 📈 Eficiencia operativa: Reducción del 40% en tiempo de planificación de vuelos mediante automatización de cálculos de peso y balance con generación automática de formularios PDF.

• 🔒 Cumplimiento y seguridad: 100% de trazabilidad en operaciones críticas con sistema de auditoría de cambios, RBAC granular y headers de seguridad configurados.

• ⚡ Rendimiento técnico: Carga inicial < 2s gracias a code-splitting con Vite, caching inteligente con TanStack Query y optimización de imágenes con Sharp.

• 🎨 Consistencia de diseño: 95% de reutilización de componentes del Design System, reduciendo tiempo de desarrollo de nuevas vistas en un 60%.

• 📊 Visibilidad en tiempo real: Dashboards con KPIs actualizados al instante, exportación de reportes a Excel/PDF y alertas proactivas para vencimientos de documentación.

• 🔄 Escalabilidad probada: Arquitectura preparada para crecimiento, con monorepo estructurado, API versionada y separación de responsabilidades que permite añadir nuevos módulos sin impacto en funcionalidades existentes.