Fase 1 · Configuración
Design System
Estas reglas gobiernan los recursos que la herramienta genera. No gobiernan esta interfaz: son dos sistemas distintos y confundirlos es el error más caro disponible acá.
Gradiente corporativo
No crear gradientes nuevos
Paleta
5morado oscuro
#140622
morado
#3B1164
naranja oscuro
#9C3732
naranja
#F05948
amarillo
#FFD914
Tipografía
Poppins, familia únicaRiesgos críticos
heading
Poppins Bold
Espacios confinados
subheading
Poppins SemiBold
Uso correcto de EPP
texto
Poppins Regular
Bloqueo y etiquetado
destacado
Poppins Medium
Sistema gráfico
Trazo 2 pxoutline, lineal, minimalista, vectorial. Los iconos de esta aplicación están dibujados con estas mismas reglas y desde este mismo vocabulario.
- Checkpoints
- Rutas
- Acreditaciones
- Inteligencia Artificial
- Nodos
- Conexiones
- Validación
- Flujo de procesos
Espaciado
Base 8 pxComponentes y presentaciones
- Radio de cards
- 16 px
- Radio de botones
- 12 px
- Tamaños de icono
- 24, 32, 48 px
- Formato de presentación
- 16:9
- Máximo de bullets
- 6
Comprobación determinista
Estas reglas no viven sólo como texto en un prompt. Se aplican como validadores por código sobre cada recurso generado, y acá se pueden ejercitar a mano.
Comprobar un SVG
Las mismas comprobaciones deterministas que se aplicarán a cada icono generado: paleta, grosor de trazo, ausencia de relleno, efectos prohibidos y viewBox normalizado. No opina sobre el dibujo — sólo sobre las reglas que el design system declara.
Nunca utilizar
- Sombras fuertes
- Efectos 3D
- Glassmorphism
- Neumorphism
- Texturas
- Fondos complejos
- Fotomontajes
- Iconografía inconsistente
- Más de una familia tipográfica
- Paletas distintas a la corporativa
Estas prohibiciones se aplicarán como validadores deterministas sobre cada recurso generado, no como sugerencias en el prompt.
Versiones
1 publicada(s)Documento publicado
Ver el markdown de la versión 1
# Design System Todas las piezas generadas por IA deben mantener una identidad visual coherente con Mine-Class, transmitiendo innovación, confianza, seguridad y tecnología. Las salidas deben conservar una apariencia moderna, limpia y profesional. ## Paleta de Colores #140622 (Morado Oscuro) #3B1164 (Morado) #9C3732 (Naranja Oscuro) #F05948 (Naranja) #FFD914 (Amarillo) ## Gradiente Corporativo Utilizar únicamente el siguiente gradiente cuando sea necesario. Inicio: #3B1164 Fin: #F05948 No crear nuevos gradientes. ## Tipografía Familia tipográfica oficial: Poppins Heading: Poppins Bold Subheading: Poppins SemiBold Texto: Poppins Regular Destacados: Poppins Medium No utilizar otras familias tipográficas. ## Iconografía Estilo: outline, lineal, minimalista, vectorial. Bordes redondeados. Trazo aproximado: 2 px Los iconos deben mantener el mismo grosor de línea y el mismo nivel de detalle. Evitar iconos con rellenos sólidos, sombras o efectos tridimensionales. ## Sistema Gráfico Toda la iconografía debe inspirarse en los conceptos de: - Checkpoints - Rutas - Acreditaciones - Inteligencia Artificial - Nodos - Conexiones - Validación - Flujo de procesos ## Estilo de Ilustraciones Vectoriales, flat, minimalistas, líneas limpias, formas geométricas. Pocas sombras, sin texturas, sin degradados complejos. Fondos blancos o muy limpios. Proporciones ligeramente estilizadas, aproximadamente 6 a 7 cabezas de altura. ## Espaciado Sistema base: 8 px Valores permitidos: 8 px 16 px 24 px 32 px 40 px 48 px 64 px 80 px 96 px ## Componentes Cards: radio 16 px Botones: radio 12 px Iconografía: 24 px, 32 px, 48 px Padding interno: 24-32 px Separación entre bloques: 48-64 px ## Presentaciones Formato: 16:9 Cada diapositiva debe contener un mensaje principal y un máximo de seis bullets, iconografía consistente, amplio espacio en blanco y jerarquía clara. ## Nunca utilizar - Sombras fuertes - Efectos 3D - Glassmorphism - Neumorphism - Texturas - Fondos complejos - Fotomontajes - Iconografía inconsistente - Más de una familia tipográfica - Paletas distintas a la corporativa