# ALBA Design System

> Simple por fuera, profundo por dentro. Una sala de control creativa, no otro dashboard SaaS.

**División:** Índice · **Tipo:** design system (tokens + UI kits) · **Estado:** 🟡 estable (primera pasada)

## Qué es

ALBA es el sistema de diseño que le da cuerpo a la División Index de FractAIll. No mira a la web genérica: mira al software profesional nativo —Camtasia, Logic Pro, DaVinci Resolve, Linear— y roba su mejor lección. Simple por fuera, profundo por dentro. Ese es el lema, y es también la promesa.

## Qué hace

- Define tokens de color, escala de superficies, tipografía y motion para todos los productos.
- Entrega UI kits para las superficies reales: IndexBase, IndexVid y FullFrame Studio.
- Fija el wordmark —minúsculas, display redondeado y pesado, con un resalte naranja a mitad del nombre— y la voz visual, en español, sin pose corporativa.
- Sostiene a **MASA**, la capa estructural de interacción (workspaces, paneles, timelines, agentes) que se construye encima.

## Por qué cambia el juego

Los design systems suelen ser catálogos muertos de botones. ALBA es un **substrato vivo**: lo que hace que IndexVid, IndexBase y FullFrame se sientan partes de un mismo organismo en vez de tres apps que comparten logo. ALBA pone el estilo, MASA pone la estructura —es a OMNI lo que GNOME es a un escritorio—. Juntos consiguen que una división entera respire al mismo ritmo, algo que las suites de la industria llevan décadas prometiendo y rara vez logran.

## Dónde vive

- Capa de diseño compartida de la División Index, presente en IndexBase, IndexVid y FullFrame Studio.

## Mapa SoF · capas y componentes

- **1 · Objetivo** — darle un cuerpo visual coherente a toda la División Index para que sus apps se sientan un mismo organismo (componentes: lema "simple por fuera, profundo por dentro", promesa de coherencia, referencia al software pro nativo como Camtasia, Logic Pro, DaVinci Resolve y Linear).
- **2 · Visión** — un design system que no es catálogo muerto sino substrato vivo, donde el estilo precede a las apps (componentes: ALBA pone el estilo, MASA pone la estructura, analogía "es a OMNI lo que GNOME es a un escritorio").
- **3 · Estructura** — las partes visibles del sistema (componentes: tokens de color, escala de superficies, tipografía, motion, UI kits para IndexBase, IndexVid y FullFrame Studio, wordmark en minúsculas con resalte naranja).
- **4 · Funcionamiento** — cómo se comporta al vestir cada producto (componentes: aplicación de tokens y kits sobre las superficies reales, voz visual en español sin pose corporativa, soporte a MASA encima).
- **5 · Fondo** — qué lo sostiene por dentro, en términos generales y públicos (componentes: una capa de diseño compartida y reutilizable que sirve de raíz común a las apps de la División Index, dentro del ecosistema FractAIll).
- **6 · Distribución** — cómo llega al usuario (componentes: presencia integrada en IndexBase, IndexVid y FullFrame Studio; los productos nacen ya hablando ALBA en lugar de adoptarlo después).

**Lectura fractal:** el componente **wordmark** se abre en sus propias capas — su objetivo es dar reconocimiento instantáneo a la división; su visión es minúsculas con display redondeado y pesado; su estructura es el resalte naranja a mitad del nombre; y su distribución es aparecer idéntico en cada superficie de IndexBase, IndexVid y FullFrame.