Guía de Uso: EdbuildSoft

Bienvenido a la documentación oficial de EdbuildSoft. Aquí aprenderás paso a paso cómo sacar el máximo provecho a todas las herramientas que ofrecemos para optimizar tu flujo de trabajo.

1. Primeros pasos

Para comenzar a utilizar la aplicación, debes iniciar sesión con tus credenciales. Si eres un usuario nuevo, te enviarán una invitación para configurar tu contraseña.

2. Navegando por la interfaz

La interfaz principal está diseñada para ser intuitiva y facilitar una gestión fluida. El sistema se divide claramente en dos regiones principales: un panel de control lateral (menú de navegación) y el área de trabajo central donde se despliega la información.

Figura 1: Interfaz principal de la plataforma web de EdBuildSoft.

A. Panel de Control Lateral (Menú de Navegación)

Este panel se ubica a la izquierda de la pantalla y organiza las herramientas del sistema en módulos jerárquicos adaptados a tu rol.

Detalle del menú de navegación lateral.

• Perfil de Organización y Rol: En la parte superior se identifica el espacio de trabajo (burstgames), el rol del usuario (Admin) y su estado (Online).
• Indicador de Módulos: Un recuadro informativo te recuerda cuántas secciones tienes habilitadas según tus permisos (ej. 9 modules available).
• Sección OVERVIEW (Vista General):
  • Dashboard: Tu vista general con las métricas clave, gráficos de rendimiento y estados globales de los proyectos activos.
• Sección WORKSPACE (Espacio de Trabajo):
  • Projects: Acceso directo al listado detallado, registros históricos y seguimiento operativo de cada obra.
  • Agenda: Calendario integrado para visualizar fechas límite, compromisos próximos e hitos del equipo.
• Sección PLANNING (Planificación):
  • Budgets: Control financiero, presupuestos asignados, gastos en tiempo real y balances generales.
  • Plan Generator: Herramienta interactiva para crear, editar y exportar planes técnicos directamente desde el navegador.
• Sección EXECUTION (Ejecución):
  • Checklist: Gestión de tareas de campo, recolección de evidencias fotográficas o documentales y control de progreso diario.
  • Inventory: Monitoreo y control de existencias de materiales, herramientas, niveles de stock y consumo en las obras.
• Sección ANALYTICS (Analítica):
  • Reports: Generación de reportes avanzados para analizar la productividad, indicadores consolidados y exportación de datos.
• Sección ADMINISTRATION (Administración y Configuración):
  • Ajustes de Perfil: Ubicado en la esquina inferior izquierda, muestra el identificador de tu cuenta corporativa. Al hacer clic aquí, accedes directamente a la Configuración para gestionar los ajustes de tu perfil, preferencias y credenciales de seguridad.

B. Área de Trabajo Central

Es la zona dinámica del sistema que cambia según el módulo seleccionado en el panel lateral. Por defecto, al iniciar sesión visualizas el Dashboard, el cual despliega de forma prioritaria:

• Tarjetas de resumen con métricas críticas (proyectos activos, retrasados, tareas pendientes y ejecución del presupuesto).
• Lista interactiva y visual de los proyectos en desarrollo con sus respectivas barras de progreso y alertas de estatus.
• Un panel secundario a la derecha enfocado exclusivamente en los Próximos Hitos (Upcoming Milestones) cronológicos.

3. Módulo: Administrador (Administrator)

El módulo de Administrador es el panel central de configuración global del sistema. Está diseñado exclusivamente para usuarios con roles de alta jerarquía (como Admin) y permite gestionar los catálogos base, los planes de suscripción, los niveles de acceso y los usuarios de la organización.

Vista general del módulo de Administración.

1. Encabezado del Módulo y Accesos Rápidos

Ubicado en la parte superior del área de trabajo central, sirve para identificar la sección activa:

• Título y Subtítulo: Muestra la etiqueta principal "Administrator" acompañada de la descripción operativa "Manage catalogs and users".
• Botones de Etiquetas: Justo debajo, se incluyen dos botones de acceso rápido o etiquetas organizacionales con iconos descriptivos: 6 módulos y Acceso rápido.
• Barra de Búsqueda Global: Un campo de texto con el marcador Search que permite filtrar rápidamente entre las distintas opciones de configuración y catálogos de esta pantalla.

2. Sección: Suscripción (Subscription)

Bloque dedicado al control comercial, facturación y niveles de licencias contratados para el espacio de trabajo:

Detalles del plan y facturación actual.

• My Plan and Billing: Permite visualizar los detalles del plan actual y gestionar los métodos de pago o facturación de la organización.
• View Plans: Espacio interactivo para explorar y comparar los diferentes planes de suscripción disponibles en la plataforma para escalar o modificar el servicio.

3. Sección: Catálogos (Catalogs)

Esta sección contiene las plantillas y bases de datos maestras que alimentan el comportamiento de los demás módulos de trabajo de la plataforma (como Checklist, Agenda y Budgets):

• Checklist Template: Permite definir y estructurar tareas estandarizadas que pueden ser precargadas automáticamente en los checklists de los nuevos proyectos de construcción.

  Configuración de la plantilla base de Checklist.

• Agenda Types: Configuración y administración de los diferentes tipos de eventos, reuniones e hitos permitidos en el calendario del sistema.

  Configuración de los tipos de agenda del sistema.

• Document Categories: Clasificación y ordenamiento de las categorías para los documentos cargados en el sistema (ej. contratos, planos, facturas).

  Categorías de documentos y gastos del sistema.

• Budget Categories: Catálogo maestro para organizar, nombrar y clasificar los conceptos de gastos y partidas presupuestarias.

4. Sección: Roles y Permisos (Roles & Permissions)

Área enfocada en la seguridad del sistema y el control de accesos basados en la estructura del equipo:

Gestión de roles y permisos del sistema.

• Roles Management: Herramienta para crear, editar o eliminar los roles del sistema (ej. Administrador, Supervisor de Obra, Cliente) y asignar meticulosamente qué módulos y acciones tiene permitido ver o modificar cada uno.

5. Sección: Usuarios (Users)

Ubicada en la parte inferior del panel de administración:

• User Management: Panel de control para dar de alta a nuevos colaboradores, suspender accesos, editar información del personal y asignarles un rol específico dentro de la organización.

4. Dashboard: Tu Centro de Control

El Dashboard es la primera pantalla que ves al entrar a la aplicación. Aquí encontrarás un resumen general del estado de tus obras mediante Indicadores Clave de Rendimiento (KPIs) y el detalle de tus próximos hitos.

Figura 1: Vista general del Dashboard con las tarjetas de KPIs.

Sección de Resumen (Métricas Clave)

Justo debajo del saludo de bienvenida y el título 'Dashboard', se presenta una fila de tarjetas informativas dinámicas:

Figura 2: Detalle de las tarjetas de KPIs.

• Active Projects (Azul): El número total de obras que se están ejecutando actualmente.
• Delayed (Naranja oscuro): Obras que han superado su fecha de finalización programada.
• Completed Late (Amarillo): Proyectos que ya finalizaron, pero fuera de la fecha límite.
• Completed On Time (Verde): Obras entregadas exitosamente dentro del plazo establecido.
• Pending Tasks (Rojo): El volumen total de tareas que aún requieren acción en todos tus planos.
• Budget Use (Verde financiero): Expone una relación rápida del presupuesto ejecutado frente al presupuesto total asignado.

Vista de Proyectos Activos (Active Projects)

Esta es la sección central del tablero, donde se listan de forma vertical las obras en desarrollo.

Figura 3: Vista de proyectos activos y sus estados.

• Filtros de Estado: En la parte superior izquierda, se incluyen botones rápidos (All, In Progress, Delayed, Completed) para segmentar visualmente la lista.
• Tarjetas de Proyecto: Cada proyecto se representa con un contenedor que incluye:
  • Nombre y Ubicación: Título principal de la obra y dirección física asociada.
  • Etiqueta de Estado (Badge): Un indicador visual con un código de color específico para su estatus actual (ej. Delayed en rojo, In Progress en azul).
  • Bordes Dinámicos: El borde izquierdo de la tarjeta se ilumina con el color del estado correspondiente.
  • Barra de Progreso: Una línea horizontal que muestra el porcentaje de avance real del proyecto.
  • Equipo Asignado: Iconos circulares en la esquina inferior izquierda que muestran los miembros vinculados.
• Acceso al Detalle: Al hacer clic sobre cualquier tarjeta, ingresarás directamente a la vista detallada del proyecto (profundizaremos en esto más adelante en el módulo de Proyectos).

Panel Lateral: Próximos Hitos

Situado en la columna derecha de la pantalla, este módulo organiza cronológicamente los eventos y entregas críticas más cercanas:

Figura 4: Próximos hitos mostrados en el panel lateral.

• Contador de Hitos: Un indicador numérico azul muestra el total de eventos en puerta.
• Tarjetas de Fecha: Cada hito incluye un bloque de calendario a la izquierda con el mes y día, seguido del nombre de la actividad y su hora o fecha límite de entrega (Deadline).
• Acceso a la Agenda: Al hacer clic sobre cualquier hito, serás redirigido directamente al módulo de Agenda (se explicará más adelante en esta guía).

5. Módulo: Proyectos (Projects)

El módulo de Proyectos es el espacio dedicado a la gestión, supervisión y seguimiento detallado de todas las obras individuales en la plataforma. A diferencia del Dashboard, esta sección desglosa métricas operativas específicas, fechas clave y herramientas de organización para cada proyecto.

Figura 5: Vista principal del módulo de Proyectos.

1. Resumen Estadístico de Proyectos (KPIs Superiores)

En la parte superior del área de trabajo, se despliega un contador general (ej. 5 proyectos) acompañado de cuatro tarjetas horizontales que clasifican el estado actual de las obras:

• Not Started: Cantidad de proyectos que han sido creados pero cuya fecha de inicio aún no se ejecuta.
• In Progress: Proyectos que se encuentran actualmente en fase de desarrollo o construcción activa.
• Delayed: Alertas de proyectos que presentan un retraso respecto a su planificación original.
• Completed: Obras que han sido finalizadas con éxito.

2. Barra de Herramientas, Búsqueda y Filtros

Ubicada inmediatamente debajo del resumen estadístico, permite localizar y segmentar rápidamente la lista de obras:

• Barra de Búsqueda: Un campo de texto con un icono de lupa que permite filtrar proyectos escribiendo su nombre, cliente o ubicación. A su extrema derecha, cuenta con un botón de papelera para limpiar el texto ingresado de forma rápida.
• Filtros Rápidos por Estado: Botones interactivos con códigos de color para segmentar la lista visible con un solo clic: All (Azul), Not Started (Gris), In Progress (Azul claro), Delayed (Rojo), Completed (Verde).
• Proyectos Eliminados (Papelera): Al hacer clic en el icono de basura situado sobre la barra de búsqueda, se abrirá una vista con todos los proyectos eliminados. Tienes un plazo de 30 días para recuperarlos antes de que se eliminen de forma permanente.

Figura 6: Vista de proyectos eliminados y opción de recuperación.

3. Tarjetas Detalladas de Proyecto (Project Cards)

Cada elemento de la lista representa un proyecto y expone de manera transparente sus datos logísticos esenciales:

• Encabezado y Estado: Se muestra el nombre comercial de la obra en negrita y en la esquina superior derecha una etiqueta (badge) con el estatus en tiempo real.
• Cronograma de Fechas (Timeline): Indica con precisión el día programado de inicio y la fecha estimada de finalización (Start / End). En proyectos terminados, añade una línea destacada que registra la fecha exacta de cierre (Completed on).
• Ubicación y Dirección: Identifica con un icono de mapa el domicilio o coordenadas asignadas a la construcción.
• Información del Cliente: En la parte inferior izquierda de cada tarjeta se especifica el nombre o la razón social del contratante.
• Acciones Rápidas: En la esquina inferior derecha se integran accesos directos: un icono de papelera para eliminar/archivar, y una flecha de navegación (>) para acceder a la vista interna detallada.

4. Botón de Creación Global (Acción Principal)

En la esquina inferior derecha de la pantalla se ubica un botón flotante azul con el símbolo de más (+). Este control permanece accesible en todo momento y sirve como el disparador principal para crear y dar de alta un nuevo proyecto en el sistema.

5. Vista de Detalles del Proyecto

Al hacer clic sobre la tarjeta de cualquier proyecto o en su flecha de navegación (>), la plataforma desplegará la Vista de Detalles del Proyecto. Esta sección ofrece un desglose profundo del estado operativo, las métricas de avance y los datos generales de la obra seleccionada de manera centralizada.

La cabecera de detalles está compuesta por los siguientes elementos clave:

Vista de la cabecera de detalles y KPIs del proyecto.

1. Panel de Información General (Cabecera)

En la esquina superior izquierda se consolidan los datos de identificación de la obra:

• Etiqueta de Estatus: Un indicador visual destacado (ej. Delayed en color rojo) que advierte de inmediato la condición de la obra.
• Nombre del Proyecto: El título principal asignado a la construcción (ej. Residencial Robles).
• Cliente y Ubicación: Iconos descriptivos que muestran el nombre del contratante (Robles Semido) y la dirección física registrada (Conocido Lopez).
• Fechas del Ciclo de Vida: El cronograma oficial con el día de inicio (Start 2026-02-22) y la fecha estimada de cierre (End 2026-03-24).

2. Barra de Avance y Controles Rápidos

• Barra de Progreso Dinámica: Una línea horizontal que se ilumina con el color del estatus actual para indicar gráficamente el porcentaje de ejecución completado del proyecto (ej. 71%).
• Botones de Acción Global: En la esquina superior derecha se localizan dos herramientas interactivas:
  • Icono de Reloj: Historial de cambios o línea de tiempo del proyecto.
  • Icono de Lápiz: Permite editar los datos generales, modificar las fechas o reajustar los parámetros iniciales de la obra.

3. Fila de Métricas Operativas (KPIs)

Justo debajo del progreso, se ubican tres tarjetas informativas con métricas directas sobre el avance de las actividades de campo:

• Tasks (20/28): Indica la relación de tareas completadas frente al total de tareas asignadas para el proyecto. Una barra de progreso inferior ayuda a visualizar este indicador de un vistazo.
• Days Overdue (69): Un contador crítico en color rojo que calcula con precisión el número de días de desfase o retraso acumulados respecto al calendario original.
• Blueprints (11): El total de planos, diseños arquitectónicos o esquemas técnicos vinculados y cargados dentro del repositorio de esta obra.

4. Gestión del Equipo de Trabajo (Team)

En la franja inferior del contenedor se sitúa el control de personal:

• Miembros Asignados: Muestra las iniciales en círculos de color (ej. BG, AR, ER) correspondientes a los ingenieros, supervisores o colaboradores que tienen permisos y responsabilidades dentro de este proyecto en específico.

6. Submódulo: Documentos del Proyecto (Project Documents)

Continuando dentro de los detalles del proyecto, encontrarás la sección dedicada a la gestión de archivos, planos y comprobantes vinculados a la obra. Este submódulo funciona como un repositorio digital centralizado para almacenar y organizar toda la documentación técnica y financiera del proyecto seleccionado.

La interfaz está diseñada con los siguientes componentes:

Vista del submódulo de Documentos del Proyecto.

1. Cabecera y Control de Carga

• Menú Desplegable de Sección (Project Documents ∨): Ubicado en la esquina superior izquierda, este selector permite alternar de forma rápida entre las diferentes pestañas o categorías de la vista interna del proyecto.
• Botón Añadir (+ Add): Situado en el extremo superior derecho, es la acción principal que despliega una ventana emergente o explorador de archivos para cargar nuevos documentos, imágenes o planos al repositorio de la obra.

2. Filtros de Categorías

Justo debajo del título de la sección, se presentan botones interactivos que permiten segmentar visualmente el tipo de archivos que se muestran en la lista:

• All (Azul): Filtro por defecto que despliega la totalidad de los archivos cargados, sin importar su procedencia o clasificación.
• Expenses (Gris): Filtro rápido para aislar y visualizar exclusivamente los comprobantes, facturas o archivos asociados a los gastos y transacciones financieras del proyecto.

3. Repositorio y Listado de Archivos

El cuerpo central de la sección organiza los documentos en un formato de lista limpia y apilada verticalmente. Cada fila representa un archivo individual e incluye:

• Icono del Tipo de Archivo: Localizado al inicio de cada tarjeta, ayuda a identificar visualmente el formato del documento de forma inmediata:
  • Icono de Documento: Representa archivos de texto, PDFs o contratos (ej. Cemnto, lol).
  • Icono de Imagen/Galería: Indica archivos de tipo fotográfico, capturas de evidencia en campo o imágenes conceptuales (ej. Piedrerias, asdasd).
• Metadatos del Archivo: Debajo del nombre de cada archivo se muestra de forma transparente la fecha exacta de subida al sistema (ej. 28/5/2026 o 11/3/2026).
• Acción de Eliminación (Icono de Papelera): En el extremo derecho de cada fila, se integra un botón rojo con el icono de papelera que permite remover el documento del servidor (sujeto a los permisos de rol del usuario).

4. Control de Paginación

• Botón "Load more": Ubicado en la base central del listado, este control permite cargar dinámicamente bloques adicionales de documentos antiguos en caso de que el proyecto cuente con un volumen extenso de archivos, evitando la saturación y optimizando los tiempos de carga de la página.

7. Submódulo: Plano Interactivo (Interactive Plan)

Siguiendo con las herramientas integradas en los detalles del proyecto, la plataforma ofrece el módulo de Plano Interactivo. Esta potente herramienta web permite a los equipos de ingeniería, supervisión y administración visualizar los planos arquitectónicos o de ingenierías de la obra y realizar anotaciones, geolocalizar tareas y delimitar áreas en tiempo real directamente sobre el dibujo técnico.

Vista de la interfaz del Plano Interactivo.

1. Selector de Especialidades (Pestañas de Planos)

En la parte superior izquierda se ubican pestañas dinámicas que permiten alternar instantáneamente entre los diferentes planos técnicos cargados para la obra:

• Especialidades Predeterminadas: Filtros rápidos como Architectural (seleccionado por defecto), Drenaje, Electrical e Hidraulic.
• Botón Añadir (+): Permite dar de alta y cargar nuevas categorías o especialidades de planos según los requerimientos específicos de la construcción.

2. Barra de Herramientas de Anotación y Marcado

Justo debajo de las pestañas de especialidad, se localiza una barra de herramientas flotante con iconos interactivos para realizar modificaciones y superposiciones visuales sobre el plano:

• Seleccionar / Mover: Icono de cruz direccional para desplazarse por el documento o arrastrar elementos.
• Formas Geométricas: Herramientas de rectángulo y círculo para delimitar áreas específicas en el espacio de trabajo (visibles en el plano en colores como azul y rojo).
• Marcadores de Ubicación (Pins): Iconos de chincheta/pin para geolocalizar puntos exactos de interés, incidencias o tareas pendientes (visibles en el plano en colores verde, azul oscuro y rojo).
• Herramientas de Dibujo y Edición: Iconos de pluma y lápiz para trazar líneas libres o polígonos personalizados.
• Lista de Anotaciones: Icono de viñetas para desplegar un resumen de los elementos incrustados.
• Control de Estado (Move): Ubicado en el extremo derecho de la barra para alternar el modo de interacción con el lienzo.

3. Filtro Temático

• Botón "Filter by Category": Situado debajo de la barra de herramientas, este menú desplegable permite al usuario ocultar o mostrar capas específicas de marcas (por ejemplo, ver solo las tareas pendientes o solo las delimitaciones de áreas), evitando la saturación visual del plano técnico.

4. Visor Central del Plano y Controles de Navegación

El área central renderiza el plano técnico seleccionado (en este caso, un plano de planta etiquetado como "New Residence"). Sobre este plano se integran controles clave de navegación:

• Paginación de Planos: En la parte inferior central se ubica un selector numérico con flechas laterales (< 2 / 11 >) que permite hojear rápidamente entre las diferentes páginas, hojas o niveles del set de planos actual. Adicionalmente, una etiqueta negra en la esquina inferior derecha del plano confirma la hoja activa (2 of 11).
• Controles de Zoom (+ / −): En la esquina inferior derecha de la pantalla se localizan botones flotantes para acercar o alejar la vista del plano, permitiendo inspeccionar detalles a gran escala o revisar especificaciones técnicas milimétricas.

5. Acciones de Archivo Inferiores

En el pie del visor se ubican dos enlaces de mantenimiento rápido:

• View full image: Abre el plano en su resolución nativa y completa en una pestaña nueva para una visualización sin obstrucciones de la interfaz.
• Replace Plan: Permite actualizar el archivo base cargado por una versión más reciente o corregida, manteniendo las anotaciones previas o permitiendo una reconfiguración limpia.

8. Submódulo: Lista de Tareas y Registro (Checklist / Log)

Ubicado también dentro de los detalles del proyecto, el submódulo de Checklist / Log es la herramienta operativa central para el control, asignación y seguimiento del progreso diario de las actividades de obra. Permite a los supervisores administrar las tareas pendientes, filtrar asignaciones y auditar cuáles actividades se entregaron fuera de tiempo o están en ejecución.

La interfaz está estructurada de la siguiente manera:

Vista de la interfaz de la Lista de Tareas (Checklist / Log).

1. Cabecera de Control y Clasificación Principal

• Título de la Sección: Identificado a la izquierda como "Checklist / Log".
• Botón Añadir (+ Add): Ubicado en la esquina superior derecha, permite dar de alta nuevas actividades o tareas operativas dentro del proyecto de forma manual.
• Selector de Entorno: Un interruptor de pestañas anchas que divide la naturaleza de las tareas:
  • General Tasks: Enfocado en actividades globales o administrativas de la obra.
  • Blueprint Tasks (Seleccionado): Enfocado estrictamente en aquellas tareas que se encuentran directamente ancladas o geolocalizadas sobre los planos técnicos del submódulo Interactive Plan.

2. Panel de Búsqueda, Ordenamiento y Filtrado Avanzado

Justo debajo del selector principal se agrupa un robusto sistema de filtros para segmentar listas extensas de actividades:

• Barra de Búsqueda: Campo con marcador Search... para localizar tareas escribiendo palabras clave de su título o categoría.
• Criterios de Ordenamiento (Sort): Botones rápidos para cambiar la jerarquía visual de la lista: Newest first (activo por defecto), Oldest first, Closest to expire y Overdue first.
• Filtros por Estado (Status): Permite aislar actividades según su etapa actual mediante las opciones: All, Open, In Progress, Completed y Cancelled.
• Filtros por Asignación (Assigned to): Permite ver las actividades asignadas a miembros específicos del equipo. Incluye opciones rápidas como All o usuarios específicos de la organización como bgstudio, arqui_juan y ernesto.

3. Listado Integrado de Tareas

El cuerpo central despliega las actividades en filas independientes y limpias. Cada tarjeta de tarea proporciona de manera transparente los siguientes indicadores:

• Casilla de Verificación e Icono: Un recuadro de confirmación a la izquierda (☑) que muestra el estado de validación de la actividad junto a su título principal (ej. Armazon, Zapata, Piedrerias). Cuando una tarea ha sido completada, el texto del título se muestra tachado de forma automática.
• Categoría o Partida: Una viñeta de color identifica la categoría técnica a la que pertenece el concepto dentro del catálogo (ej. un punto azul para Cimentación o un punto morado para Acabado).
• Etiqueta de Incidencia o Tiempo: Si la actividad sufrió un desfase respecto al cronograma, el sistema le adosa un indicador visual de alerta en color amarillo con la leyenda Completed late (Completada con retraso).
• Contadores de Interacción: Iconos complementarios que registran la actividad interna de la tarea:
  • Icono de Mensaje: Indica el número de comentarios o notas de bitácora añadidos por los supervisores en campo (ej. 💬 1).
  • Icono de Clip: Indica la existencia de archivos, fotos de evidencia o documentos adjuntos a esa tarea específica (ej. 📎 1).
• Responsable Asignado: En el extremo derecho de cada fila, se muestra un avatar circular gris con las iniciales del colaborador encargado de supervisar o ejecutar la actividad (ej. BG o AR).

9. Proceso de Creación de Tareas y Suministros (Modal Paso a Paso)

Cuando un supervisor o administrador inicia la creación de una nueva actividad en el proyecto, la plataforma despliega un asistente configurado en 3 pasos secuenciales para garantizar que toda la información técnica, logística y de almacén quede registrada correctamente.

Paso 1: Detalles de la Tarea (Task Details)

En esta primera etapa se definen las propiedades generales y de geolocalización de la actividad:

Paso 1: Detalles generales de la tarea.

• Task Title (Obligatorio): Campo de texto para ingresar el nombre de la actividad (ej. "Armazón" o "Reparación de grieta").
• Task Description (Opcional): Bloque de texto libre para añadir especificaciones técnicas o instrucciones detalladas sobre cómo ejecutar la labor.
• Marker Type: Define la representación visual que tendrá la tarea sobre el plano técnico. Las opciones disponibles son:
  • Pin: Marcador de punto exacto.
  • Area: Contenedor rectangular para delimitar zonas.
  • Circle: Radio circular de afectación.
• Associate to Catalog (Opcional): Menú desplegable para vincular la tarea a una partida o categoría preconfigurada en el catálogo maestro (ej. Cimentación, Acabados).
• Assignee: Campo para seleccionar e indicar qué colaborador o supervisor del equipo será el responsable directo de ejecutar y validar la tarea.
• Deadline: Selector con formato de calendario para establecer la fecha límite de entrega de la actividad.

Paso 2: Asignación de Materiales (Materials)

Si el usuario cuenta con los privilegios correspondientes, el sistema le permite asociar recursos físicos a la tarea:

Paso 2: Solicitud de materiales desde inventario.

• Seleccionar Material: Un menú desplegable conectado en tiempo real con el inventario de la obra para elegir el insumo requerido.
• Quantity: Campo numérico para especificar la cantidad exacta de unidades necesarias (ej. piezas, bultos, metros).
• Botón "+ Add another material": Permite agregar múltiples filas de insumos dentro de la misma solicitud de tarea.

Paso 3: Sincronización de Agenda (Agenda)

La última etapa del asistente automatiza la comunicación del cronograma:

Paso 3: Opciones de sincronización de la agenda.

• Sync Agenda: El sistema consulta si se desea indexar esta actividad en el calendario global.
• Botón "Add to Agenda": Al activar esta casilla interactiva, la plataforma creará automáticamente un evento en el módulo Agenda referenciando el título de la tarea y su fecha límite (Deadline), notificando al equipo involucrado antes de proceder a oprimir el botón "Save".

Flujo Final de Salida de Almacén (Reglas de Negocio)

Una vez que el usuario hace clic en "Save", el sistema evalúa la información registrada y los permisos aplicados para determinar el cierre del proceso:

• Escenario A: Con Solicitud de Materiales (Genera Vale de Salida) Si el usuario tenía los permisos habilitados y agregó insumos en el Paso 2, el sistema procesa una orden de suministro y despliega la pantalla de Vale de Salida (Out Ticket). Esta ventana genera de forma automática un Código QR dinámico y único. El supervisor en campo deberá presentar este código QR escaneable en el almacén de la obra para que el bodeguero valide la transacción, descuente los insumos del stock del módulo Inventory y le entregue físicamente los materiales.

  Generación automática del código QR para el vale de salida.

• Escenario B: Sin Solicitud de Materiales (Solo Checklist) Si el usuario no agregó materiales a la tarea (o si su rol en la plataforma no cuenta con los permisos necesarios para el manejo de suministros), el sistema simplemente creará y guardará la actividad dentro del Checklist del proyecto. En este caso, el proceso finaliza de inmediato, la tarea se integra a la lista operativa y no se generará ningún tipo de vale de salida ni código QR de almacén, devolviendo al usuario directamente a la pantalla de trabajo.

6. Módulo: Agenda (Calendar)

El módulo de Agenda es el componente de planificación temporal de la plataforma. Funciona como un calendario interactivo y centralizado que consolida cronológicamente todos los hitos, eventos clave y fechas límite de entrega (deadlines) de los proyectos activos en un formato de cuadrícula mensual estándar.

La interfaz está constituida por los siguientes elementos de control y visualización:

Vista principal del módulo de Agenda y calendario.

1. Barra de Controles de Navegación Temporal

Ubicada en la franja superior de la pantalla, permite al usuario gestionar el rango de tiempo visible en la cuadrícula:

• Indicador de Mes y Año: En la esquina superior izquierda se despliega el nombre del mes y el año en curso (ej. June 2026). Un indicador azul circular al lado del texto denota que nos encontramos visualizando el mes correspondiente a la fecha actual del sistema.
• Flechas de Desplazamiento (< / >): Situadas en los extremos superiores, permiten hojear el calendario hacia atrás o hacia adelante para revisar la planeación de meses pasados o futuros.
• Botón "Today": Ubicado en el extremo superior derecho, funciona como un acceso rápido para regresar instantáneamente la vista del calendario al mes y día actual con un solo clic.

2. Barra de Leyendas y Filtros de Eventos

• Etiqueta de Clasificación (Deadline): Situada justo debajo del indicador de mes, esta etiqueta con el icono de un reloj sirve como identificador visual o filtro rápido. Indica que los bloques de color rojo desplegados en la cuadrícula corresponden a fechas límite de cumplimiento obligatorio para las tareas de la obra.

3. Matriz Central del Calendario (Vista Mensual)

El cuerpo principal de la interfaz organiza los días en bloques ordenados vertical y horizontalmente:

• Cabecera de Días de la Semana: Una franja gris superior que divide el calendario en siete columnas estándar, comenzando en domingo (Sun) y concluyendo en sábado (Sat).
• Indicador del Día Actual: El número correspondiente al día en curso se resalta automáticamente con un contenedor circular azul brillante (ej. el día 1 de junio en la imagen) para que el operador localice su posición temporal de inmediato.
• Bloques Dinámicos de Tareas: Las actividades registradas en el sistema se incrustan directamente dentro de la casilla del día asignado. Se representan como barras horizontales de color rojo que exponen el título de la entrega:
  • Hito del 2 de Junio: Muestra el bloque correspondiente a la tarea programada Test Task.
  • Hitos del 30 de Junio: Despliega dos entregas críticas paralelas agendadas para el fin de mes: Test Build y Task 5.

4. Botón de Creación Flotante

• Acción Principal (+): En la esquina inferior derecha de la pantalla permanece un botón flotante azul con el símbolo de más. Este control interactivo permite a los administradores o coordinadores de obra añadir un nuevo hito, recordatorio o fecha límite directamente a la agenda, abriendo un asistente de configuración rápido sin necesidad de salir de la pestaña actual.

  Vista del modal de creación de eventos en la Agenda.

7. Módulo: Presupuestos (Budgets)

El módulo de Presupuestos es la herramienta de control financiero centralizada de la plataforma. Su objetivo principal es ofrecer una transparencia absoluta sobre los recursos económicos de la organización, permitiendo auditar el presupuesto total asignado, monitorear los gastos acumulados en tiempo real y analizar el balance financiero global e individual por cada obra en desarrollo.

La interfaz está estructurada visualmente en tres niveles de análisis:

Vista general del módulo de Presupuestos y control financiero.

1. Panel de Métricas Financieras Globales (KPIs Consolidados)

Ubicado en la parte superior del área de trabajo, este contenedor agrupa el estado financiero consolidado de todos los frentes de trabajo activos:

• Projects with budget: Cuantifica el número total de obras individuales que cuentan con recursos económicos asignados en el sistema (ej. 2).
• Total Budget: Sumatoria total de los fondos financieros aprobados e inyectados en la plataforma (ej. $5,500,000.00).
• Total Expenses: Registra de forma acumulativa el total de dinero devengado, facturado y gastado en la suma de todos los frentes (ej. $31,170.00).
• Balance: El saldo disponible restante de la organización (calculado mediante la fórmula: Total Budget - Total Expenses). Se resalta en color verde para indicar una salud financiera positiva (ej. $5,468,830.00).

2. Portafolio de Proyectos (Project Portfolio)

Justo debajo del resumen global, se localiza el desglose individualizado por obra. Cada proyecto se organiza dentro de un contenedor desplegable (acordeón):

• Encabezado del Proyecto: Al hacer clic en la pestaña (ej. Residencial Robles), esta se expande para mostrar sus datos financieros internos. A su extrema derecha se ubica un contador rápido con el gasto actual de la obra ($30,490.00), un icono de advertencia en color rojo y el acceso directo "Edit Budget" para ajustar las partidas.
• Métricas de la Obra: Al expandirse, muestra tres tarjetas horizontales con los montos específicos asignados a ese proyecto:
  • Total Budget: Dinero asignado exclusivamente a esta obra (ej. $5,000,000.00).
  • Total Expenses: Egresos acumulados en este proyecto (ej. $30,490.00).
  • Balance: Fondo disponible exclusivo para el desarrollo de esta construcción (ej. $4,969,510.00).

3. Gráficas, Resúmenes e Historial de Egresos

Una vez desplegada la obra en el portafolio, se habilitan tres herramientas avanzadas de auditoría interna:

• Comparativa Gráfica (Chart Comparison): Módulo visual que renderiza gráficos estadísticos de barras para contrastar de manera inmediata los presupuestos planificados frente a los gastos reales consumidos (Allocated vs. Spent).
• Resumen por Categoría (Summary by Category): Segmenta y distribuye el flujo de dinero basándose en los catálogos maestros. Cada fila muestra una barra de progreso que indica cuánto presupuesto se ha consumido por partida técnica (ej. partidas como Armado o Materiales), contrastando el gasto frente al límite asignado en el extremo derecho.
• Historial de Gastos (Expense History): Un registro de contabilidad lineal y detallado donde se asientan todas las transacciones realizadas:
  • Buscador Interno: Barra de texto con el marcador Search by concept or category... para filtrar compras específicas de forma rápida.
  • Controles de Carga (+ Add / Export): Botones dedicados para registrar un nuevo gasto de caja de forma manual o exportar el estado de cuenta del proyecto en formatos descargables.
  • Tabla de Transacciones: Columnas estructuradas que clasifican cada movimiento con su fecha de registro (Date), el nombre del insumo o servicio (Concept), la etiqueta del catálogo asociada (Category), el monto total facturado (Amount), los archivos de evidencia o facturas adjuntas (Att.), y herramientas para editar o eliminar el registro.

4. Botón de Registro Global

• Acción Principal (+): En la esquina inferior derecha de la pantalla, permanece accesible el botón flotante azul con el símbolo de más (+), diseñado como el atajo rápido de la plataforma para dar de alta nuevas estructuras presupuestarias desde cualquier sección del módulo.

  Vista del modal de creación de un nuevo presupuesto.

8. Módulo: Generador de Planos (Plan Generator)

El Plan Generator es una herramienta de dibujo técnico interactiva integrada directamente en el navegador. Su propósito es permitir a los ingenieros, arquitectos y proyectistas bosquejar, estructurar y exportar planos de planta rápidos sin necesidad de recurrir a pesados softwares externos de CAD, optimizando la etapa de planificación de las obras.

A continuación se detalla el flujo de trabajo y los componentes de la interfaz a través de sus pantallas principales:

1. Panel de Gestión de Planos (Mis Planos)

Al ingresar al módulo, lo primero que visualiza el usuario es su repositorio de diseños local:

Vista del panel de gestión de planos guardados.

• Creación Nueva (+ New Plan): Un contenedor con líneas punteadas que actúa como disparador para abrir un lienzo en blanco e iniciar un diseño desde cero.
• Muestrario de Proyectos (My Plans): Una lista en cuadrícula que almacena las miniaturas de los planos guardados por el usuario (ej. plano-2, mi-casa, Plano 4). Cada tarjeta incluye un botón de eliminación rápido (icono de papelera roja) en la esquina superior derecha para depurar el catálogo.

2. El Lienzo de Dibujo e Interfaz Principal

Al abrir o crear un plano, el sistema carga un entorno de diseño técnico asistido sobre un fondo reticulado (cuadrícula):

Vista del lienzo de dibujo técnico y cálculo de cotas.

• Cálculo Automático de Cotas: Conforme se trazan los muros, el motor del generador calcula en tiempo real las dimensiones exactas de las paredes interiores, exteriores y los grosores de construcción (mostrando acotaciones automáticas en metros, ej. 8.02 m, 4.83 m).
• Selectores de Unidades: En la barra superior central, el usuario puede alternar rápidamente la escala de medición entre metros (m) y pies (ft).
• Herramientas de Precisión: Iconos superiores para activar o desactivar líneas de guía/reglas (regla azul) y bloquear o desbloquear la edición de los elementos del lienzo (icono de candado).

3. Barra de Herramientas de Construcción (Menú Build)

Ubicada en el extremo izquierdo de la pantalla, una barra vertical oscura resguarda los menús operativos. Al seleccionar el icono de herramientas (llave inglesa y destornillador), se despliega el panel flotante "Build", el cual contiene los bloques constructivos esenciales:

Barra de herramientas de construcción (Build).

• Draw Room: Permite trazar habitaciones o espacios cuadrangulares predefinidos de manera ágil.
• Draw Wall: Herramienta de dibujo lineal libre para levantar muros personalizados en cualquier ángulo.
• Draw Surface: Define áreas de pisos, losas o texturas superficiales específicas en el mapa.
• Place Doors: Inserta puertas batientes, corredizas o accesos con abatimiento configurable (como se observa ya colocado en el centro del plano).
• Place Windows: Añade aperturas de ventanas en los muros para delimitar la iluminación del plano (identificado como un bloque azul en el muro derecho).
• Place Structurals: Permite posicionar elementos de carga esenciales como columnas, castillos o vigas de soporte.

4. Módulo de Exportación y Compatibilidad

Una vez finalizado el diseño estructural, el icono de exportación (carpeta con flecha saliente) abre una ventana modal interactiva para descargar el archivo en múltiples formatos según el destino técnico requerido:

Opciones de exportación de planos en múltiples formatos.

• Formatos de Imagen Tradicionales: Permite descargar el plano como imagen física (.JPG o .PNG) seleccionando la resolución deseada según el nivel de detalle indispensable:
  • SD: (960 x 540 px)
  • HD: (1920 x 1080 px)
  • 4K: (3840 x 2160 px)
• Formatos Profesionales e Ingeniería (Alternative):
  • PDF (Document): Ideal para anexar directamente como documentación oficial o reportes del proyecto.
  • DXF (CAD): (Próxima mejora en optimización) Exporta el plano en formato de vectores compatible con AutoCAD, Revit y otros programas nativos de arquitectura.
  • SVG (Vector): Descarga el dibujo a escala vectorial limpia para diseño gráfico o manuales web.
• Modos de Renderizado e Impresión: El asistente permite alternar entre vistas bidimensionales (2D) y el esqueleto de modelado (3D), e incluye casillas para decidir si se imprime la barra de escala (Show scale bar) o el nombre de las habitaciones (Show floor name).

9. Módulo: Centro de Tareas (Task Center / Checklist)

El módulo Task Center (identificado en el menú lateral como Checklist) funciona como el núcleo operativo global de la plataforma. A diferencia de las listas de tareas individuales que se encuentran dentro de la vista de cada obra, este módulo unifica y centraliza el estado de las actividades de todos los proyectos de la organización en una sola pantalla, permitiendo a los administradores y directores operativos supervisar el rendimiento general del personal y detectar cuellos de botella de manera inmediata.

La interfaz está estructurada bajo los siguientes componentes:

Vista general del Centro de Tareas global (Task Center).

1. Panel de Métricas de Control de Tareas (KPIs Globales)

Ubicado en la parte superior del módulo, proporciona un resumen numérico y acumulativo de la carga de trabajo en toda la empresa:

• Task Center (Contador Principal): Junto al título se muestra un indicador azul con el volumen total de alertas o tareas que requieren atención prioritaria (ej. 20).
• Total Tasks: Cantidad histórica y acumulada de tareas registradas en la plataforma (ej. 50).
• Pending: El número total de actividades que se encuentran actualmente abiertas o en proceso de ejecución por parte del equipo de campo (ej. 20).
• Completed: Cuantifica cuántas tareas han sido finalizadas y validadas con éxito en todos los frentes de obra (ej. 30).
• Overdue: Un contador crítico en color rojo que resalta aquellas tareas cuya fecha límite de entrega ya venció y siguen sin completarse (ej. 11).

2. Barra de Filtrado Avanzado

Justo debajo de las tarjetas de métricas se incorporan herramientas de segmentación rápida:

• Filtros por Estado: Botones interactivos para reducir el listado visual según las necesidades de la auditoría: All (activo por defecto), Pending, Completed y Overdue.
• Filtro de Planos (No Blueprint): Una casilla de verificación (checkbox) que, al ser activada, aísla y muestra únicamente las tareas generales del proyecto, ocultando aquellas que están geolocalizadas o ancladas a una hoja técnica en el submódulo de planos interactivos.

3. Portafolio de Tareas por Proyecto (Estructura de Acordeón)

El cuerpo central de la pantalla organiza las actividades agrupándolas por su respectiva obra mediante contenedores desplegables:

• Encabezado del Proyecto: Cada fila representa una obra activa (ej. Residencial Robles). A la extrema derecha de cada pestaña se muestra la relación de progreso numérico (ej. 20/31, 5/5) y un círculo de color con el conteo de incidencias o retrasos específicos de ese frente.
• Desglose de Actividades Internas: Al dar clic para expandir un proyecto, se revela el listado de sus tareas con sus propiedades individuales:
  • Estatus de Verificación: Cada tarea posee un cuadro de selección a la izquierda. Si está completada, se muestra con una palomita verde (☑) y el título tachado; si sigue activa, se muestra el recuadro vacío.
  • Etiqueta de Estado: En el extremo derecho de la fila de la tarea se ratifica su estatus en mayúsculas (COMPLETED en verde u OPEN en gris).
  • Contadores de Soporte: Iconos debajo del título que indican el volumen de archivos adjuntos (icono de clip) y la cantidad de comentarios registrados en la bitácora de esa asignación (icono de mensaje).
• Control de Expansión Interna (See more): En la base del proyecto desplegado, este botón permite cargar de forma limpia el resto de las tareas secundarias de la obra sin saturar el rendimiento visual del navegador.

10. Módulo: Inventario (Inventory)

El módulo de Inventario proporciona las herramientas operativas indispensables para supervisar, auditar y controlar el flujo físico de los recursos de la organización. Su arquitectura unificada permite administrar tanto las existencias disponibles en el almacén como las solicitudes de aprovisionamiento de materiales de construcción vinculadas a las tareas de campo.

La interfaz está segmentada en cuatro pestañas de control principales que estructuran el ciclo de vida del material:

1. Almacén Principal (Main Warehouse)

Esta pestaña funciona como el libro de contabilidad de existencias activas en tiempo real. Despliega una tabla automatizada con el desglose del stock disponible y su valor financiero acumulado:

Vista del Almacén Principal y control de existencias.

• Buscador y Herramientas: Cuenta con una barra de búsqueda rápida por texto, un botón de exportación de datos (Export) y un filtro de ordenamiento por costos (Highest Cost).
• Columnas de Control de Stock:
  • Item / SKU: Identifica el nombre del insumo y su código de catálogo único (ej. Clavos CLVO-3000, Cemento Gris CEM-0001).
  • Quantity: Cuantifica las unidades reales físicas resguardadas en la bodega (ej. 52 unidades de Cemento Gris).
  • Unit Cost: El precio unitario base de adquisición del material (ej. $189.00).
  • Total Cost: El valor financiero total del stock de ese insumo en almacén, calculado de forma matemática aplicando el volumen por su costo unitario (Quantity x Unit Cost, ej. $9,828.00 para el cemento).
  • Unit of Measure: La unidad métrica estandarizada de despacho (ej. Caja, Pieza, Metro cuadrado (m²), Litro (L)).

2. Solicitudes Pendientes (Pending Requests)

Es el área logística donde el encargado de almacén recibe y procesa los vales de salida generados por los supervisores en las obras:

Gestión de Solicitudes Pendientes mediante escaneo QR.

• Lector de Códigos QR (Scan QR): Un botón destacado que activa la cámara del dispositivo para escanear directamente los vales de salida de los trabajadores, localizando instantáneamente la solicitud en la lista.
• Estructura de Despacho de Pedidos:
  • Project & Status: Detalla a qué obra se asignarán los insumos y muestra la etiqueta amarilla de estatus PENDING.
  • Requested Materials: Especifica el volumen exacto y tipo de insumo solicitado (ej. • 2 pieza of Yeso o • 1 L of Gasolina).
  • Date: Registra la fecha de la solicitud.
  • Action (Dispatch Request): Botón de acción principal. Al hacer clic, el bodeguero confirma la entrega física, lo que deduce automáticamente las unidades del inventario global de la pestaña Main Warehouse y mueve el registro al historial.

3. Historial de Despachados (Dispatched)

Un registro de auditoría de archivo ciego y lineal que almacena todos los movimientos históricos aprobados de salida de materiales de la organización:

Historial de materiales despachados a proyectos.

• Trazabilidad de Consumo: Muestra con transparencia qué proyecto consumió los insumos (ej. Juan Comercio, Bienestar de los mochis, Residencial Robles), qué materiales específicos salieron de la bodega, la fecha exacta de la liberación y la etiqueta verde de confirmación definitiva con el estado DISPATCHED.

4. Catálogo Maestro de Materiales (Catalog)

Esta pestaña representa la base de datos de referencia que alimenta a todo el sistema. Aquí se configuran las propiedades fijas de los insumos antes de ingresar físicamente al almacén:

Catálogo Maestro de materiales e insumos.

• Item: Nombre del producto acompañado de su descripción técnica (ej. Varilla 1/2 - Varilla de medio metro).
• Supplier: Permite vincular y registrar de forma informativa el proveedor directo o casa de materiales asociada a la compra de ese insumo (ej. Madereria Chihuahua, Construrama).
• Actions (Controles de Mantenimiento): En el extremo derecho de cada fila se integran herramientas individuales:
  • Icono de Lápiz: Abre el editor para corregir nombres, códigos SKU, unidades de medida o actualizar costos unitarios base.
  • Icono de Papelera: Remueve permanentemente el artículo del catálogo maestro.
• Botón de Alta Global (+): El botón flotante azul en la esquina inferior derecha abre el asistente para dar de alta un producto completamente nuevo en el sistema.

11. Módulo: Reportes (Reports)

El módulo de Reportes es el núcleo analítico e informativo de la plataforma. Su función principal es unificar el rendimiento operativo, el avance de las tareas y el estado del portafolio en métricas consolidadas, ofreciendo un asistente interactivo para exportar resúmenes ejecutivos y auditorías financieras en formatos compatibles con herramientas externas (PDF y Excel).

La interfaz y sus flujos de descarga estructurados se desglosan a continuación:

1. Panel Analítico y Vista Previa de Proyectos

Al ingresar a la sección, el sistema presenta un tablero de control estadístico:

Vista del panel analítico y estado del portafolio.

• Indicadores Superiores Consolidados: Muestra métricas rápidas de la organización como el total de proyectos (6), las obras completadas (2) y la tasa global de cumplimiento de tareas (61% Global Task Completion Rate).
• Tarjetas de Estado del Portafolio: Bloques de color que clasifican los proyectos según su condición actual (Total de Proyectos: 6, Activos: 2, Retrasados: 1, Tareas Completadas: 61%).
• Módulo Projects Preview (Vista Previa): Una tabla lineal que expone el estado de salud de cada obra de un vistazo, listando de forma transparente el nombre del frente de trabajo, su etiqueta de estatus (Delayed, Completed, Not Started, In Progress) y su porcentaje real de progreso (desde 0% hasta 100%).

2. Flujo de Exportación A: Generación de PDF (Executive Summary)

Al hacer clic en el botón azul "Generate PDF", la plataforma despliega un asistente de configuración por etapas:

Asistente de configuración para la generación de reportes en PDF.

• Configuración de Rango (Range Configuration): El usuario debe especificar un rango de fechas con un día de inicio (Start) y fin (End) utilizando los selectores de calendario. El sistema incluye una regla de negocio clara: el rango máximo permitido para la consulta es de 30 días (* The maximum allowed range is 30 days).
• Selección del Tipo de Reporte: Permite elegir la plantilla base del documento:
  • Generate Custom Report: Abre un segundo nivel de personalización avanzada, donde el usuario marca mediante casillas de verificación (checkboxes) exactamente qué proyectos incluir en el documento y qué secciones operativas desea adjuntar (ej. Project Summary, Task Status, Budget Overview, Evidence Gallery).

    Opciones avanzadas para personalizar el reporte PDF.

  • Progress Report: Genera un informe automatizado enfocado puramente en el porcentaje de cumplimiento de las listas de verificación (checklists).

3. Flujo de Exportación B: Descarga a Excel (Expenses)

Cuando el administrador o auditor financiero requiere realizar cruces de datos avanzados, presupuestarios o de contabilidad, la plataforma ofrece la descarga directa de hojas de cálculo:

Segmentación de datos para la exportación a Excel.

• Botón Export to Excel: Ubicado en la barra horizontal de color verde de la pantalla principal.
• Ventana de Segmentación de Datos: Al accionarse, despliega el modal interactivo "Export to Excel". Este panel permite al operador marcar o desmarcar de manera individual cuáles proyectos del portafolio se indexarán en la base de datos descargable, permitiendo una extracción selectiva o masiva con un solo clic en el botón de confirmación "Export".

12. Módulo: Centro de Notificaciones (Notifications)

El centro de Notificaciones es el componente encargado de mantener a los usuarios informados en tiempo real sobre los eventos críticos, cambios de estado y asignaciones dentro de la plataforma. Este espacio centraliza las alertas del sistema para asegurar que el equipo operativo y administrativo responda rápidamente a las necesidades de cada obra.

La interfaz está diseñada con los siguientes elementos de interacción y lectura:

Vista del Centro de Notificaciones y sus alertas.

1. Cabecera y Acción Global

• Título de la Sección: Identificado en la parte superior izquierda como "Notifications".
• Marcar como leído ("Mark as read"): Un enlace rápido en la esquina superior derecha que permite limpiar visualmente el indicador de alertas pendientes, cambiando el estado de todas las notificaciones actuales a "Leídas" con un solo clic.

2. Filtros de Segmentación Avanzada

Justo debajo del título, se integra una botonera de filtros que permite aislar las alertas por su estado de lectura o por el módulo de procedencia:

• Filtros por Estado de Lectura:
  • Todas: (Filtro activo por defecto en color azul) Muestra el historial completo de alertas.
  • No leídas: Aísla únicamente las novedades que requieren la atención primaria del usuario.
  • Leídas: Despliega el registro histórico de notificaciones ya revisadas.
• Filtros por Categoría (Módulos): Permite filtrar los mensajes según la naturaleza del evento para agilizar el flujo de trabajo:
  • Proyectos: Alertas sobre altas, bajas o cambios estructurales en las obras.
  • Agenda: Recordatorios de eventos, reuniones o hitos próximos a vencer.
  • Checklist: Notificaciones vinculadas estrictamente a tareas asignadas, comentarios o bitácoras de campo.
  • Presupuesto: Avisos financieros, alertas de reajustes o registros de gastos elevados.

3. Listado Integrado de Alertas (Feed de Notificaciones)

El cuerpo principal presenta los avisos de forma cronológica en bloques independientes. Cada tarjeta utiliza un código de iconos para identificar la urgencia del mensaje:

• Alertas de Atención Crítica: (Icono de Triángulo de Advertencia Rojo) Diseñadas para notificar retrasos o anomalías graves que impactan el cronograma (ej. "Attention! You have 10 overdue task(s).").
• Alertas de Asignación Directa: (Icono de Información Azul) Mensajes automáticos que notifican al usuario cuando ha sido nombrado responsable de una nueva actividad en el sistema (ej. "You have been assigned the task: Task 5", "task3", o "task1").
• Alertas Informativas del Sistema: (Icono de Información Gris) Avisos institucionales sobre el ciclo de vida de los frentes de trabajo o descripciones detalladas de actividades en campo (ej. "Project 'Bienestar de los mochis' status changed to: Completed").

4. Control de Paginación Dinámica

• Enlace "Load more notifications": Ubicado en la base central de la pantalla, este control permite al usuario expandir el feed de alertas de forma descendente para auditar o revisar un historial más antiguo de interacciones sin necesidad de recargar la página por completo.

13. Módulo: Chat Interno (Messaging System)

El sistema de Chat Interno es la herramienta de comunicación e interacción instantánea integrada en la plataforma. Su objetivo es centralizar las conversaciones de los equipos de trabajo directamente en el sistema, permitiendo coordinar actividades de obra, resolver dudas de los checklists y mantener una bitácora de acuerdos sin necesidad de recurrir a aplicaciones de mensajería externas.

La interfaz se divide en dos secciones principales:

Vista del sistema de mensajería y canales de chat interno.

1. Panel de Canales y Contactos (Barra Lateral Izquierda)

Este panel organiza los diferentes entornos de comunicación disponibles para el usuario:

• Global Chat: Ubicado en la parte superior con un icono de planeta tierra, funciona como el canal general de la organización. Es un espacio abierto donde todos los miembros del equipo pueden enviar avisos masivos, alertas globales o anuncios institucionales.
• Sección DIRECT MESSAGES (Mensajes Directos): Lista de manera vertical los chats individuales y privados con los diferentes colaboradores de la empresa. Cada contacto se muestra con su respectiva foto de perfil o avatar e identificador de cuenta (ej. el chat seleccionado actualmente es bgstudio, seguido en la lista por otros miembros del equipo como arqui_juan y ernesto).

2. Ventana de Conversación Activa (Área de Chat Central)

Es el espacio dinámico donde se desarrollan las interacciones del contacto o canal seleccionado:

• Cabecera del Chat: Una franja superior de color azul que confirma el nombre del usuario o canal con el que se está interactuando (ej. bgstudio) junto con un botón de guion (−) en el extremo derecho para minimizar o colapsar la ventana flotante de mensajería.
• Historial de Mensajes: El cuerpo central del contenedor renderiza la conversación de forma cronológica. Cuando un chat es completamente nuevo o se ha limpiado el historial, el sistema muestra el texto de asistencia informativa: "No messages yet. Start the conversation!".
• Barra de Entrada de Texto y Herramientas (Pie de Chat): Ubicada en la base, contiene los controles para redactar y enriquecer los mensajes:
  • Icono de Clip: Botón dedicado para adjuntar archivos, imágenes de evidencia, documentos de texto o planos técnicos de forma directa en la conversación.
  • Caja de Texto Interactiva (Type a message...): Campo de entrada libre donde se redacta el mensaje. Cuenta con soporte nativo para menciones integradas; al escribir el símbolo @ seguido del nombre de un usuario, el sistema despliega un menú rápido para etiquetar directamente a un miembro del equipo y enviarle una alerta prioritaria.
  • Botón de Envío (Icono de Avión de Papel): Control circular azul situado en la esquina inferior derecha que procesa y transmite el mensaje redactado de forma instantánea al receptor.

14. Módulo: Configuración del Perfil (User Settings)

El panel de Configuración del Perfil es el espacio donde los usuarios pueden gestionar sus credenciales de seguridad, ajustar las preferencias visuales de la aplicación, revisar el estado de su nivel de cuenta y modificar la información de su identidad digital dentro de la plataforma.

La interfaz está organizada de manera vertical en los siguientes bloques operativos:

Vista del panel de configuración de perfil de usuario.

1. Tarjeta de Identidad y Plan de Usuario (Cabecera)

Ubicada en la parte superior, centraliza los datos generales del perfil activo:

• Avatar y Foto de Perfil: Un contenedor circular con un icono de cámara superpuesto que permite al usuario hacer clic para cargar o actualizar su fotografía corporativa.
• Nombre de Usuario e Identificador: Muestra el nombre de la cuenta (bgstudio) acompañado de un icono de corona azul que resalta de forma visual el tipo de cuenta, seguido del correo electrónico de contacto oficial (burstgamesstudio@burstgamesstudio.com).
• Etiqueta de Rol: Un botón azul sólido que ratifica los permisos globales asignados al usuario actual (ej. Admin).
• Estado de Suscripción (Current Plan): Un contenedor destacado que indica el nivel de la licencia activa que posee la organización (ej. ENTERPRISE).

2. Sección: Preferencias (Preferences)

Agrupa las opciones de personalización para adaptar el comportamiento visual y lingüístico del entorno de trabajo:

• Dark Mode: Un interruptor deslizante (toggle) a la derecha que permite alternar instantáneamente la apariencia de la interfaz entre el modo claro y el modo oscuro.
• Currency: Abre un submenú interactivo para cambiar el tipo de divisa preferido con el que se renderizarán los costos y estados financieros en los módulos de Budgets e Inventory.
• Language: Da acceso a las opciones de traducción de la plataforma para cambiar el idioma predeterminado de los textos de la aplicación.
• Reset Guided Tour: Permite reiniciar el tutorial interactivo inicial del sistema, volviendo a mostrar las guías introductorias de asistencia para los frentes de trabajo.

3. Sección: Seguridad (Security)

Concentra las herramientas de protección de datos y autenticación de la cuenta:

• Connected Accounts: Módulo interactivo para administrar, vincular o revocar los métodos de inicio de sesión de terceros (ej. cuentas de Google, GitHub u otros proveedores de identidad).
• Change Password: Acceso directo al asistente de seguridad para actualizar o restablecer la contraseña de acceso actual del usuario de forma segura.

4. Sección: Cuenta (Account)

• Botón Cerrar Sesión (Logout): Una barra horizontal destacada en color rojo en la parte inferior del panel. Funciona como la acción de salida segura para terminar la sesión activa en el dispositivo actual y devolver al usuario a la pantalla de inicio de sesión (Login).