3 capas. 25 controles. Cero código.
Cada pantalla generada tiene 3 capas de personalización independientes más propiedades individuales por campo. Configuras el comportamiento exacto que necesitas sin escribir una línea de código.
Configuración, no programación
Donde otros te piden un desarrollador para cada cambio, SPARTANE te da parámetros configurables por pantalla, por campo y por comportamiento. El motor mecánico lee tu configuración y genera exactamente lo que defines — determinístico, auditable y sin sorpresas.
Modelo de Personalización
3 capas + 1 transversal
Cada pantalla generada se configura en capas independientes. Cambias una sin afectar las demás.
Capa 1 — Entity Binding
Qué tabla alimenta la pantalla
Vinculación a entidad
Define qué tabla o entidad de base de datos alimenta cada pantalla. Puede vincular una entidad principal y opcionalmente entidades de detalle, historial o referencia.
Ejemplo: una pantalla de Aprobación vincula 3 entidades — la solicitud principal, el log de decisiones y los datos maestros de referencia.
Capa 2 — Field Binding
Qué campo mapea a cada rol semántico
Mapeo campo → función
Cada pantalla tiene roles semánticos predefinidos (título, estado, fecha, archivo, etc.) que mapeas a los campos físicos de tu entidad. El motor genera el control UI correcto automáticamente.
Ejemplo: en un Kanban, CAMPO_COLUMNA mapea a tu campo de estado, CAMPO_TITULO a tu campo de nombre, CAMPO_ASIGNADO a tu FK de usuario.
Capa 3 — Behavior
Switches y parámetros de comportamiento
Comportamiento configurable
Cada tipo de pantalla tiene switches específicos que controlan su comportamiento. Son valores simples (0/1, listas, números) que el motor lee para generar la variante exacta.
Ejemplo: un Calendario tiene VISTA_DEFAULT (MES/SEMANA/DIA), DRAG_RESIZE (0/1) y EVENTOS_MULTIDIA (0/1). Cambias el switch y el motor regenera.
Capa Transversal — Campo Individual
7 propiedades por cada campo
Configuración a nivel campo
Cada campo de cualquier entidad tiene propiedades de presentación configurables que aplican en todas las pantallas donde aparece. Sin código, sin CSS.
Controles de Interfaz
25 tipos de control UI
Cada campo se renderiza con el control apropiado según su tipo de dato y rol semántico. Tú eliges o el motor lo asigna automáticamente.
| Control | Uso típico | Tipo de dato |
|---|---|---|
| TEXTINPUT | Campos de texto corto, nombres, códigos | NVARCHAR |
| TEXTAREA | Descripciones, notas, logs | NVARCHAR(MAX) |
| RICH_TEXT | Contenido con formato HTML | NVARCHAR(MAX) |
| NUMBER_INPUT | Cantidades, montos, porcentajes | INT / DECIMAL |
| DROPDOWN | Selección de catálogo | FK a catálogo |
| AUTO_COMPLETE | Búsqueda con sugerencias | FK a entidad |
| DATE_PICKER | Fechas sin hora | DATE |
| DATETIMEPICKER | Fechas con hora exacta | DATETIME |
| TIMEPICKER | Solo hora | TIME |
| TOGGLE / CHECKBOX | Valores booleanos | BIT |
| FILE_UPLOAD | Archivos, imágenes, documentos | SpartanFile |
| BADGE | Estados, categorías con color | INT (catálogo) |
| CHIP | Etiquetas múltiples, tags | FK / Lista |
| AVATAR | Foto de usuario asignado | FK → Spartan_User |
| COLOR_PICKER | Selección de color | NVARCHAR(7) |
| ICON | Íconos de material design | NVARCHAR |
| CRON_EDITOR | Expresiones cron visuales | NVARCHAR |
| IMAGE | Imagen de perfil o cabecera | SpartanFile |
| SEMAFORO | Indicador visual rojo/amarillo/verde | INT |
| LINK | URL o archivo descargable | NVARCHAR / File |
Layouts
15 layouts de formulario
Define cómo se organizan visualmente los campos en cada pantalla. Desde una columna simple hasta un wizard paso a paso.
Columnas
SINGLE_COLUMN · TWO_COLUMNS · TWO_COLUMNS_WIDE_LEFT · TWO_COLUMNS_WIDE_RIGHT · THREE_COLUMNS · FULL_WIDTH
Paneles
SIDEBAR_LEFT · SIDEBAR_RIGHT · SPLIT_HORIZONTAL · SPLIT_VERTICAL · MASTER_DETAIL
Estructurados
HEADER_BODY · HEADER_BODY_FOOTER · TABS · WIZARD
Componentes
25 componentes UI
Bloques de interfaz que el motor combina para construir cada pantalla según su tipo y layout.
Behaviors por Tipo
Cada pantalla tiene sus propios switches
Los parámetros de behavior varían según el tipo de pantalla. Aquí un resumen de las configuraciones clave.
| Tipo de pantalla | Parámetros de Behavior | Libertad |
|---|---|---|
| Dashboard | LAYOUT_TIPO (2x2/3x3/Fluida) · TEMA_COLORES · AUTO_REFRESH_SEGUNDOS · KPI_TIPO_CHART | Alta |
| Calendario | VISTA_DEFAULT (Mes/Semana/Día) · DRAG_RESIZE · EVENTOS_MULTIDIA | Alta |
| Kanban | LIMITE_WIP · QUICK_ADD · COLAPSAR_COLUMNAS | Alta |
| Wizard | STEPPER_ORIENTACION · GUARDADO_PARCIAL · NAVEGACION_LIBRE | Alta |
| Galería | VISTA_DEFAULT (Grid/Lista/Carousel) · TIPOS_ARCHIVO · TAMAÑO_MAXIMO_MB | Alta |
| Aprobación | REQUIERE_MOTIVO · BATCH · NIVELES · DIAS_SLA · PERMITE_DELEGAR | Alta |
| Importación | MODO (Insert/Update/Upsert) · TAMAÑO_MAX · PLANTILLA_DESCARGABLE | Media-Alta |
| Monitor | INTERVALO_REFRESH · RANGO_TIEMPO · MODO_ALERTAS · TEMA_OSCURO | Media |
| Mapa | MAP_PROVIDER (Leaflet/Mapbox/Google) · ZOOM · CENTER · CLUSTERING | Alta |
| Scheduler | MODO (Cron/Citas/Turnos/Reservaciones) · VALIDAR_CONFLICTOS · AUTO_REFRESH | Alta |
| Pivot Table | MOSTRAR_TOTALES · HEATMAP_ACTIVO · PERMITIR_DRILL_DOWN | Alta |
| Auditoría | VISTA_DEFAULT (Timeline/Grid/Ambos) · MOSTRAR_DIFF · INTERVALO_REFRESH | Alta |
Reglas de Presentación
6 sub-patrones visuales
Reglas que controlan la apariencia y accesibilidad de la interfaz sin tocar el código.
PRE-UX
Comportamiento visual
Controla estados visuales de componentes: loading, empty, error, disabled. Cada uno con su variante de presentación.
PRE-VIZ
Estilos condicionales
Semáforos, badges por umbral y estilos condicionales. Si el valor supera X, el badge cambia de color automáticamente.
PRE-I18
Internacionalización
Soporte multi-idioma por locale. Labels, tooltips, placeholders y mensajes de error traducidos automáticamente.
PRE-RTL
Right-to-Left
Soporte para idiomas RTL como árabe y hebreo. El layout completo se invierte automáticamente.
PRE-A11
Accesibilidad WCAG 2.1 AA
Controles de accesibilidad: labels ARIA, navegación por teclado, contraste, screen readers, focus management.
PRE-THM
Dark/Light Mode
Theming con CSS custom properties. Modo claro y oscuro con transición suave. Personalizable por tenant.
Resumen Ejecutivo
Libertad de diseño por sección
| Sección | Parámetros | Libertad | ¿Hardcoded? |
|---|---|---|---|
| Galería (archivos) | 9 configuraciones | Alta | No |
| Importación masiva | 10 configuraciones | Media-Alta | No |
| Aprobación | 10 configuraciones | Alta | No |
| Comparación | 9 configuraciones | Alta | No |
| Reglas de negocio | 155+ sub-patrones | Muy Alta | No |
| Layouts | 15 opciones | Alta | No |
| Componentes UI | 25 tipos | Alta | No |
| Propiedades de campo | 7 propiedades | Muy Alta | No |
Lectura Recomendada
Continua explorando
Configura, no programes
Agenda una demo y ve cómo personalizar pantallas, layouts y comportamientos sin escribir código.
Preguntas
¿Cuánta libertad tienes para personalizar? Toda. Sin vendor lock-in, sin limitaciones artificiales.
