Todo equipo termina con un design system. La única pregunta es si lo construyes intencional desde temprano o accidentalmente después de 3 años de deuda visual.
Las 5 capas mínimas 1. **Design tokens** (color, spacing, typography, radius). 2. **Componentes primitivos** (Button, Input, Card, Badge). 3. **Componentes compuestos** (Form, Modal, Table). 4. **Patrones** (empty states, loading, errors). 5. **Documentación viva** (Storybook o similar).
Cuándo empezar - **Solo founder + designer**: capa 1 y 2 desde día 1 (en variables CSS). - **3+ personas construyendo UI**: capa 3 y 4. - **5+ productos o superficies**: capa 5 con Storybook.
El error del "vamos a hacerlo bien desde el inicio" Construir un design system exhaustivo antes de tener producto es procrastinación disfrazada. Empieza mínimo y evoluciónalo con cada componente que construyas.
Stack recomendado 2026 - **Tokens**: variables CSS + Tailwind config. - **Componentes**: shadcn/ui como base, custom encima. - **Documentación**: Storybook 8+ o Ladle. - **Distribución**: monorepo con Nx o Turborepo si tienes múltiples apps.
Un sistema en producción vale más que uno perfecto en Figma Cada componente que exists en el código y no en el Figma es una victoria. La documentación siempre va detrás del código, no delante.
R
Rayden Gonzalez
Diseño y construyo sitios web premium para negocios que quieren vender de verdad.