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 anillos

Cada anillo se construye con los dos anteriores. Los anillos siguen Fib(0..5): 0, 1, 1, 2, 3, 5. Los dos 1 son anillos distintos, una unidad y la unión que la relaciona con lo que viene después, así que cada anillo se nombra por su id (0, 1a, 1b, 2, 3, 5) y no por su valor de Fibonacci.

  1. Tokens

    Anillo 0

    El vocabulario atómico (color, espaciado, radios, tipografía) desde el que se componen todos los anillos superiores. El punto del que parte la espiral.

  2. Primitivas

    Anillo 1a

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

  3. Patrones

    Anillo 1b

    Composiciones de primitivas que resuelven una interacción recurrente: diálogos, formularios, desplegables, pestañas. La unión: relacionan la unidad con todo lo que se construye encima. Estructurales, no contextuales.

  4. Enantiómeros

    Anillo 2

    Especializaciones de un patrón que conservan su identidad estructural, reflejadas según el contexto: un ProductCard y un HomeHeroCard como variantes quirales 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 todos los enlaces pero no pueden superponerse, 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 anillo 2 es donde el propio par se convierte en la unidad de entrega: dos componentes (o dos porciones de estado) que se entregan juntos con un contrato de transición, no dos artefactos que se parecen por casualidad.

  5. Features

    Anillo 3

    Flujos de usuario de principio a fin construidos con patrones y enantiómeros: inicio de sesión, checkout, edición de perfil. Donde el design system se encuentra con los objetivos de producto.

  6. Composiciones

    Anillo 5

    Layouts y páginas: la geometría que reparte las features en una superficie y las composiciones completas que el usuario ve. La cima de la espiral.

Las relaciones

Cada anillo se construye con los anteriores. Las primitivas leen tokens. Los patrones componen primitivas. Los enantiómeros especializan patrones. Las features ensamblan enantiómeros en flujos. Las composiciones reparten las features en layouts y páginas. Esto no es una taxonomía de categorías: es un orden de construcción.

Los anillos, 0, 1, 1, 2, 3, 5, son Fibonacci: cada uno suma los dos anteriores. No es decorativo, y es una forma, no un cupo de módulos. Un design system que escala como la naturaleza (ramificación, crecimiento, empaquetamiento) es uno en el que cada anillo tiene más variedad que el anterior y el ritmo de crecimiento se mantiene acotado. El crecimiento lineal (1, 2, 3, 4, 5, 6) se queda corto ante cómo se multiplican las composiciones; el exponencial (1, 2, 4, 8, 16) promete de más. Fibonacci es la forma que tienen de verdad los sistemas naturales.

El eje quiral no se limita al anillo 2: recorre los seis anillos, y cada anillo tiene su propio par enantiomérico. Los tokens tienen átomos (locales o compartidos), las primitivas tienen hooks (confirmado o borrador), los patrones tienen patrones de estado (lectura o escritura), las features tienen una mitad de servidor y otra de cliente, y las composiciones tienen estado autoritativo o efímero. Lo que distingue al anillo 2 no es que sea el hogar de la quiralidad, sino que su cardinalidad de entrega es dos: el anillo en el que entregas un par empaquetado (editor+visor, borrador+confirmado) con el contrato de transición conectado entre las dos mitades. La quiralidad es la propiedad; el anillo 2 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.

ChiralFM