La Arquitectura de las Cosas — De la Naturaleza a lo Virtual

La taxonomía con forma de Fibonacci en la que vive todo módulo de Chiralkit — y los ejes que le dan mano.

Los seis niveles

Cada nivel se compone del anterior. La cantidad en cada nivel sigue la secuencia de Fibonacci: 1, 1, 2, 3, 5, 8.

  1. Tokens

    Fibonacci count — 1

    El vocabulario atómico — color, espaciado, radios, tipografía — desde el que se componen todos los niveles superiores.

  2. Primitivos

    Fibonacci count — 1

    Elementos de UI de un solo propósito construidos directamente desde tokens: botones, badges, inputs, labels. La unidad más pequeña reconocible del sistema.

  3. Patrones

    Fibonacci count — 2

    Composiciones de primitivos que resuelven una interacción recurrente: diálogos, formularios, dropdowns, pestañas. Estructurales, no contextuales.

  4. Enantiómeros

    Fibonacci count — 3

    Especializaciones de un patrón que conservan su identidad estructural, reflejadas para un contexto — un ProductCard y un HomeHeroCard como variantes chirales de un Card base. El concepto que da nombre al proyecto.

    En química, un enantiómero es una de las dos moléculas que comparten todos los átomos y enlaces pero no pueden superponerse una sobre otra — como una mano izquierda y una derecha. En Chiralkit, un enantiómero es la misma idea aplicada al diseño: dos componentes que heredan el ADN estructural de un patrón compartido, reflejado para dos contextos distintos. Esto es lo que separa a Chiralkit de un catálogo de componentes. El nivel 3 es donde el par mismo se vuelve la unidad de empaquetado — dos componentes (o dos slices de estado) que se shipean juntos con un contrato de transición, no dos artefactos que se parecen por casualidad.

  5. Features

    Fibonacci count — 5

    Flujos de usuario end-to-end construidos desde patrones y enantiómeros: sign-in, checkout, edición de perfil. Donde el design system se encuentra con los objetivos de producto.

  6. Páginas

    Fibonacci count — 8

    Composiciones completas ensambladas desde features y chrome compartido. La superficie que el usuario realmente ve; la cima de la espiral.

Las relaciones

Cada nivel se construye desde el anterior. Los primitivos leen tokens. Los patrones componen primitivos. Los enantiómeros especializan patrones. Las features ensamblan enantiómeros en flujos. Las páginas componen features. Esto no es una taxonomía de categorías — es un orden de construcción.

La cantidad en cada nivel — 1, 1, 2, 3, 5, 8 — es Fibonacci. No es decorativo. Un design system que escala como la naturaleza (ramificación, crecimiento, empaquetamiento) es uno donde cada nivel tiene más variedad que el anterior y la tasa de crecimiento se mantiene acotada. El crecimiento lineal (1, 2, 3, 4, 5, 6) subestima la realidad combinatoria; el exponencial (1, 2, 4, 8, 16) promete de más. Fibonacci es la forma que realmente tienen los sistemas naturales.

El eje chiral no está localizado en el nivel 3 — recorre los seis niveles. Cada nivel tiene su propio par enantiomérico: los tokens tienen atoms (local vs. shared), los primitivos tienen hooks (committed vs. draft), los patrones tienen state patterns (read vs. write), las features tienen mitades server vs. client, las páginas tienen estado authoritative vs. ephemeral. Lo que hace distinto al nivel 3 no es que sea el hogar de la chirality — es que su cardinalidad de entrega es dos: el anillo donde shippeás un par empaquetado (editor+viewer, draft+committed) con el contrato de transición cableado entre las mitades. La chirality es la propiedad; el nivel 3 es el eje de empaquetado.

Cada anillo tiene dos caras enantioméricas: una cara visual (el design system tal como ship hoy) y una cara estado (la forma del estado reactivo que hace pareja con ella). Las dos caras comparten el mismo grafo de dependencia y la misma magnitud de cambio Fibonacci — no hay descuento por trabajar solo un lado. La cara estado está especificada de forma prescriptiva como ChiralkitState; un futuro ChiralkitStore cubre la espiral de persistencia que se acopla a la cara estado por sus anillos exteriores.