6ea70bd34f
- Nueva estructura de carpetas según Skynet v7 - Añadidos schemas SQL completos - Documentación de entidades, componentes e integraciones - Modelo de seguridad actualizado - Infraestructura y operaciones reorganizadas
143 lines
4.4 KiB
Markdown
143 lines
4.4 KiB
Markdown
# Mind Link
|
||
|
||
**Tipo:** Aplicación Web
|
||
**Versión:** v11
|
||
**Estado:** En desarrollo
|
||
|
||
---
|
||
|
||
## Descripción
|
||
|
||
Interfaz de comunicación visual tipo mindmap/linktree. Presenta nodos principales (categorías) con subnodos desplegables (documentos) conectados por líneas animadas.
|
||
|
||
---
|
||
|
||
## Arquitectura Visual
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────────────────────┐
|
||
│ MIND LINK │
|
||
├─────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────┐ ┌─────────────────────┐ │
|
||
│ │ NODO │──────────────│ SUBNODO 1 │ │
|
||
│ │ 120x120 │ │ 180x101 │ │
|
||
│ │ │──────────────│ SUBNODO 2 │ │
|
||
│ └─────────┘ └─────────────────────┘ │
|
||
│ │
|
||
└─────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## Especificaciones Técnicas
|
||
|
||
### Dimensiones
|
||
|
||
| Elemento | Valor | Notas |
|
||
|----------|-------|-------|
|
||
| Nodo principal | 120×120 px | Cuadrado |
|
||
| Subnodo | 180×101 px | Ratio 16:9 |
|
||
| Radio esquinas nodo | 20px | |
|
||
| Radio esquinas subnodo | 15px | |
|
||
| Grosor líneas/bordes | 3px | |
|
||
| Gap entre subnodos | 20px | Vertical |
|
||
| Gap entre grupos | 50px | Vertical |
|
||
| Gap nodo a subnodo | 70px | Horizontal |
|
||
|
||
### Tipografía
|
||
|
||
| Elemento | Tamaño | Peso | Color |
|
||
|----------|--------|------|-------|
|
||
| Título página | 32px | 600 | #1a1a1a |
|
||
| Título nodo | 18px | 500 | Color del nodo |
|
||
| Título subnodo | 16px | 500 | Color del nodo |
|
||
|
||
### Colores por Defecto
|
||
|
||
```
|
||
#FF6B35 - Naranja (nodo 1)
|
||
#E5A000 - Amarillo (nodo 2)
|
||
#06D6A0 - Verde (nodo 3)
|
||
#0891B2 - Cyan (nodo 4)
|
||
#3B82F6 - Azul (nodo 5)
|
||
#8B5CF6 - Violeta (nodo 6)
|
||
#EC4899 - Rosa (nodo 7)
|
||
```
|
||
|
||
---
|
||
|
||
## Iconos de Acción
|
||
|
||
Posicionados en las 4 esquinas del subnodo:
|
||
|
||
```
|
||
┌─────────────────────┐
|
||
│ 🕐 👁 │ 🕐 = historial
|
||
│ │ 👁 = preview
|
||
│ │
|
||
│ ⬇ 🔗 │ ⬇ = descarga
|
||
└─────────────────────┘ 🔗 = enlace
|
||
```
|
||
|
||
| Icono | Campo | Función |
|
||
|-------|-------|---------|
|
||
| 👁 | tiene_preview | Abrir modal con documento |
|
||
| ⬇ | tiene_descarga | Descargar archivo |
|
||
| 🔗 | tiene_enlace | Copiar URL |
|
||
| 🕐 | tiene_historial | Mostrar versiones |
|
||
|
||
---
|
||
|
||
## Animaciones
|
||
|
||
| Elemento | Duración | Función | Delay |
|
||
|----------|----------|---------|-------|
|
||
| Movimiento vertical nodo | 400ms | ease-out | - |
|
||
| Revelado de líneas | 450ms | linear | 80ms |
|
||
| Aparición subnodos | instantánea | - | 30ms |
|
||
|
||
---
|
||
|
||
## Estructura de Datos
|
||
|
||
### Configuración
|
||
|
||
| Campo | Tipo | Descripción |
|
||
|-------|------|-------------|
|
||
| titulo | String | Título principal |
|
||
| mostrar_titulo | Boolean | Mostrar/ocultar |
|
||
| colores | String | Hex separados por comas |
|
||
| fuente | String | Nombre de fuente |
|
||
|
||
### Nodos
|
||
|
||
| Campo | Tipo | Descripción |
|
||
|-------|------|-------------|
|
||
| id | String | Identificador único |
|
||
| titulo | String | Nombre categoría |
|
||
| imagen | URL | Imagen 120×120 |
|
||
| subnodos | Array | Lista documentos |
|
||
|
||
### Subnodos
|
||
|
||
| Campo | Tipo | Descripción |
|
||
|-------|------|-------------|
|
||
| id | String | Identificador único |
|
||
| titulo | String | Nombre documento |
|
||
| imagen | URL | Miniatura 16:9 |
|
||
| tiene_preview | Boolean | Icono ojo |
|
||
| tiene_descarga | Boolean | Icono descarga |
|
||
| tiene_enlace | Boolean | Icono enlace |
|
||
| tiene_historial | Boolean | Icono reloj |
|
||
|
||
---
|
||
|
||
## Pendiente
|
||
|
||
- [ ] Conexión real con API
|
||
- [ ] Sistema de autenticación con PIN
|
||
- [ ] Funcionalidad real de iconos
|
||
- [ ] Responsive móvil
|
||
- [ ] Integración en aplicación empresarial
|