El diseño es el código
Cómo la lógica de los autómatas celulares transformará los sistemas de diseño agénticos, y por qué el futuro del desarrollo web quizá ya esté escrito en reglas simples
Se está produciendo una profunda transformación en la intersección entre los sistemas de diseño, la inteligencia artificial y la teoría de la computación. Es un cambio tan fundamental que pone en cuestión lo que entendemos por "diseño" en la era de los agentes autónomos.
Durante décadas hemos tratado el diseño y el código como disciplinas separadas: el diseño como el territorio de la creatividad humana y el juicio estético, y el código como la traducción mecánica de esas ideas a una forma ejecutable. Pero a medida que los agentes de IA ensamblan interfaces de usuario de forma autónoma, consumen los sistemas de diseño como infraestructura legible por máquinas y generan código a partir de tokens semánticos, nos acercamos a un punto de convergencia que resuena con una idea mucho más antigua de la teoría de la computación.
¿Qué idea? El diseño es el código.
No es solo una frase pegadiza. Es el reconocimiento de que quizá nos dirigimos hacia un mundo en el que los sistemas de diseño funcionan como autómatas celulares: reglas simples que dan lugar a comportamientos complejos y emergentes. Un mundo donde la distinción entre "diseñar" algo y "programarlo" se disuelve por completo. Donde los agentes autónomos no se limitan a usar los sistemas de diseño, sino que son sistemas de diseño en acción.
El momento de la convergencia
El 11 de diciembre de 2025, Brad Frost (creador de Atomic Design) se reunió con Dominic Nguyen (cofundador de Chromatic) en una sesión en directo sobre "Sistemas de diseño agénticos en 2026". Su mensaje fue claro: los agentes de IA ya están ensamblando interfaces con los mismos componentes que usan los equipos humanos. Los sistemas de diseño deben evolucionar hasta convertirse en infraestructura legible por máquinas, o correrán el riesgo de quedar como vestigios de una época pasada.
Como anunció el equipo de Storybook: "La IA empieza a usar los sistemas de diseño exactamente tal como están documentados. Las lagunas en los ejemplos, los estados & las restricciones conducen directamente a resultados de interfaz impredecibles".
Esta entrada explora las profundas conexiones entre los autómatas celulares, el comportamiento emergente y el futuro de los sistemas de diseño agénticos. Seguiremos el rastro de los fundamentos teóricos, desde las máquinas autorreplicantes de von Neumann hasta los enjambres de agentes de IA de hoy.
Veremos cómo Drupal y las plataformas CMS modernas están integrando la IA a través de módulos como Schema.org Blueprints y Drupal AI. Y reflexionaremos sobre lo que todo esto significa para diseñadores, desarrolladores y el futuro de la creación de productos digitales.
Los autómatas celulares y la lógica de la emergencia
La belleza de las reglas simples
En 1970, el matemático John Conway presentó el Juego de la vida, un "juego de cero jugadores" que se convertiría en uno de los sistemas más estudiados de la teoría de la computación. Las reglas son de una sencillez asombrosa:
- Toda célula viva con menos de dos vecinas vivas muere (subpoblación)
- Toda célula viva con dos o tres vecinas vivas sobrevive
- Toda célula viva con más de tres vecinas vivas muere (sobrepoblación)
- Toda célula muerta con exactamente tres vecinas vivas pasa a estar viva (reproducción)
De estas cuatro reglas, expresadas en un puñado de condiciones binarias, surge un universo asombroso de complejidad. Los planeadores (gliders) recorren cuadrículas infinitas. Los osciladores laten con ritmos perpetuos. Los cañones lanzan flujos de patrones por el espacio celular. Y, lo más notable, está demostrado que el Juego de la vida es Turing completo: todo lo que puede calcularse de forma algorítmica puede, en principio, calcularse dentro de la sencilla cuadrícula de Conway.

Figura 1: el cañón de planeadores de Gosper en el Juego de la vida de Conway. Este patrón produce un flujo continuo de planeadores y demuestra cómo unas reglas sencillas pueden generar una complejidad infinita que se perpetúa a sí misma.
Esta es la primera lección de los autómatas celulares: la complejidad no es un requisito previo para un comportamiento complejo. Unas reglas simples, aplicadas de forma constante sobre un sustrato, pueden dar lugar a patrones y comportamientos que nadie programó de manera explícita.
Vídeo esencial: introducción a los autómatas celulares
Una introducción a los autómatas celulares, incluidos el Juego de la vida de Conway y los Bucles de Langton, que se autorreplican
Este vídeo muestra varias animaciones, entre ellas la autodestrucción final que se produciría si se permitiera que los Bucles de Langton se replicaran sobre un toro grande (donde los lados opuestos de la cuadrícula están unidos).
Recursos adicionales del vídeo:
Los Bucles de Langton y la autorreplicación
En 1984, Christopher Langton llevó este principio más lejos con sus bucles autorreplicantes, un autómata celular que demostró verdaderos principios de vida artificial. A diferencia del Juego de la vida de Conway, que muestra complejidad emergente, los Bucles de Langton muestran una reproducción.
emergente. Cada bucle consta de un límite cíclico que encierra un "genoma" codificado en estados de las celdas. Este genoma fluye sin cesar alrededor del bucle y sale por un brazo de construcción, que levanta un bucle hijo a lo largo de 151 pasos de tiempo. Cuando termina, el hijo se separa de su progenitor y ambos siguen replicándose.
Figura 2: el Bucle de Langton en su configuración inicial. La información genética circula por el bucle y dirige la construcción de los bucles hijos mediante el brazo que se extiende.
"Si es posible una máquina que se reproduzca a sí misma dentro de un autómata celular, entonces quizá las máquinas puedan alcanzar la vida misma."
- Christopher Langton, "Studying Artificial Life with Cellular Automata" (1986)
Las implicaciones son profundas. Los Bucles de Langton demuestran que la autorreplicación no exige la complejidad de las células biológicas ni las capacidades de construcción universal del diseño original de von Neumann. Solo requiere:
- Un conjunto de reglas simples y locales
- Un mecanismo para codificar instrucciones
- Un proceso mediante el cual se ejecuten esas instrucciones
Las reglas son el organismo. El diseño es el código.
En 1999, Hiroki Sayama presentó los evoloops, variantes que incorporan la disolubilidad estructural y las interacciones fenotípicas, lo que permite mutaciones espontáneas y dinámicas evolutivas. Estos bucles evolucionan mediante colisiones físicas directas durante la replicación, lo que conduce a variaciones del genotipo, mayor diversidad morfológica y un crecimiento de la complejidad a lo largo de las generaciones. A diferencia de la replicación fija de Langton, los evoloops demuestran mutaciones heredables sin intervención externa.
Regla 110 y computación universal
La exploración que hizo Stephen Wolfram de los autómatas celulares elementales culminó en un descubrimiento sorprendente: la Regla 110, una de las solo 256 reglas posibles para el tipo más simple de autómata celular unidimensional, es capaz de realizar computación universal.
La Regla 110 puede especificarse por completo indicando el resultado para cada una de las ocho combinaciones posibles de una celda y sus dos vecinas. Sin embargo, esta regla trivialmente simple (ocho decisiones binarias) puede simular una máquina de Turing universal.
Figura 3: autómata celular Regla 110. A pesar de su sencilla definición, la Regla 110 muestra un comportamiento de Clase 4 (patrones complejos que no son ni del todo estables ni del todo caóticos) y se ha demostrado que es Turing completa.
"No hace falta nada parecido a la CPU de un ordenador entero para hacer computación universal. Basta con esta pequeña regla."
- Stephen Wolfram, "A New Kind of Science"
En 2004, Matthew Cook publicó una demostración de que la Regla 110, con un patrón de fondo repetitivo concreto, es Turing completa. La demostración muestra que la Regla 110 puede emular sistemas de etiquetas cíclicos, que a su vez pueden emular cualquier máquina de Turing. De los 88 autómatas celulares elementales únicos posibles, la Regla 110 es el único para el que se ha demostrado directamente la completitud de Turing.
El Principio de Equivalencia Computacional que propuso Wolfram sugiere algo todavía más radical: los sistemas que superan un umbral mínimo de complejidad son, en esencia, equivalentes en sus capacidades de cómputo. Un cerebro humano, un sistema meteorológico y la Regla 110 son, en cierto sentido profundo, computacionalmente equivalentes.
Las cuatro clases de autómatas celulares de Wolfram
- Clase 1: La evolución conduce a un estado homogéneo
- Clase 2: La evolución conduce a estructuras periódicas separadas
- Clase 3: La evolución conduce a patrones caóticos y aleatorios
- Clase 4: La evolución conduce a patrones complejos con estructuras localizadas, capaces de computación universal
La Regla 110 muestra un comportamiento de Clase 4, que Wolfram describe como situado en el "borde del caos": un límite crítico donde las reglas simples producen el máximo poder de cómputo.
La metacélula 0E0P: autorreplicación verdadera
En octubre de 2018, Adam P. Goucher completó la construcción de la metacélula 0E0P, un patrón del Juego de la vida de Conway capaz de autorreplicarse de verdad. A diferencia de las metacélulas anteriores, que necesitaban copias preexistentes cerca, la metacélula 0E0P puede construir copias de sí misma desde cero, incluida su propia cinta de instrucciones.
Este logro es un hito de la vida artificial: un sistema que puede propagarse por un sustrato computacional usando solo reglas locales. El 23 de noviembre de 2013, Dave Greene construyó el primer replicador del Juego de la vida que crea una copia completa de sí mismo, cinta de instrucciones incluida, lo que demuestra que incluso el sencillo autómata de dos estados de Conway puede sostener una reproducción ilimitada.
Explora más: vídeos sobre autómatas celulares
Busca más contenido fascinante sobre autómatas celulares:
▶️ Búsqueda en YouTube: "cellular automata the design is the code"
Los sistemas de diseño como sustratos computacionales
Del diseño atómico al diseño agéntico
La metodología Atomic Design de Brad Frost, presentada en 2013, revolucionó nuestra forma de pensar los sistemas de diseño. Al dividir las interfaces en átomos (elementos básicos como botones y campos de entrada), moléculas (combinaciones sencillas), organismos (secciones complejas de la interfaz), plantillas (maquetaciones de página) y páginas (implementaciones finales), Atomic Design aportó una estructura jerárquica para gestionar la complejidad.
Pero lo notable, visto en retrospectiva, es esto: Atomic Design ya encarnaba los principios de los autómatas celulares sin reconocerlos de forma explícita.
| Principio de los autómatas celulares | Equivalente en Atomic Design |
|---|---|
| Reglas locales | Cada nivel de componente tiene reglas sobre cómo puede combinarse con los demás |
| Emergencia | Las páginas complejas emergen de la combinación de elementos más simples |
| Reproducibilidad | Los mismos átomos, combinados según las mismas reglas, producen resultados coherentes |
| Escalabilidad | El sistema escala sin control centralizado: cada componente «conoce» su propio comportamiento |
| Autoorganización | Los design tokens propagan los cambios por todo el sistema de forma automática |
«Cuando el sistema de diseño es aburrido, libera a diseñadores y desarrolladores para hacer cosas nuevas, para resolver problemas nuevos. El sistema de diseño carga con el peso de lo aburrido, para que diseñadores y desarrolladores no tengan que hacerlo.»
- Josh Clark, «The Most Exciting Design Systems Are Boring»
En febrero de 2023, Brad Frost escribió sobre «Design Systems in the Time of AI»:
«La IA es una consumidora natural de sistemas de diseño... Lo cierto es que buena parte del trabajo con componentes de un sistema de diseño es realmente mecánico y predecible. Ya usamos herramientas como PlopJS para generar el código base de un componente que encaje con la forma del resto de la biblioteca. Agradecería que la IA me ayudara a generar muchas de esas piezas base de uso común.»
- Brad Frost
La naturaleza mecánica y predecible de los sistemas de diseño es justo lo que los hace aptos para funcionar al estilo de los autómatas celulares. Cuando las reglas son claras, locales y se aplican de forma coherente, los agentes pueden operar de manera autónoma, igual que las células del Juego de la vida de Conway no necesitan un controlador central para producir planeadores y osciladores.
El imperativo de que sea legible por máquinas
La iniciativa Storybook MCP (Model Context Protocol) representa una evolución crítica en esta dirección. Anunciada a finales de 2025, Storybook MCP ofrece a los agentes de programación con IA metadatos de componentes legibles por máquinas a partir de configuraciones de Storybook ya existentes.
La clave está en que los agentes no necesitan código en bruto ni documentación visual. Necesitan:
- Manifiestos de componentes: Metadatos estructurados de cada componente: sus props, variantes, vínculos con design tokens y ejemplos de uso
- Nomenclatura semántica: Tokens cargados de intención, como
action.primary.confirm, que transmiten significado a los agentes y no solo valores - Ciclos de validación: La capacidad de ejecutar pruebas, ver los fallos y autocorregirse
«Storybook MCP ayuda a los agentes a seguir tus patrones y a superar tus pruebas. Les da dos cosas que nunca habían tenido: metadatos de componentes legibles por máquinas y un ciclo iterativo para autocorregir sus errores.»
Storybook MCP incluye un ciclo de corrección autónoma. Permite que los agentes ejecuten las pruebas de tus componentes (de interacción y de accesibilidad), vean qué falla y arreglen sus propios errores. El desarrollador solo tiene que intervenir cuando las pruebas pasan. Se acabó hacer de niñera de los prompts.
Esta es justamente la arquitectura de un autómata celular aplicada al diseño: reglas locales (las especificaciones de los componentes), interacciones entre vecinos (los patrones de composición) y actualizaciones iterativas (validación y autocorrección).
Mi manifiesto de componentes como genoma
La comparación con los bucles de Langton resulta aún más acertada si pensamos en cómo funcionan los manifiestos de componentes. En el sistema de Langton, el «genoma» codificado en las células que circulan contiene las instrucciones para construir un bucle nuevo. En un sistema de diseño legible por máquinas, el manifiesto del componente contiene las instrucciones para ensamblar interfaces.
Un manifiesto de componente podría especificar:
{
"name": "Button",
"variants": ["primary", "secondary", "destructive"],
"sizes": ["sm", "md", "lg"],
"props": {
"label": "string",
"disabled": "boolean",
"onClick": "function"
},
"tokens": {
"background": "color.action.primary",
"borderRadius": "radius.md",
"padding": "space.3"
},
"constraints": [
"Must have accessible contrast ratio",
"Label required for non-icon buttons",
"Minimum touch target 44x44px"
],
"examples": [
{ "variant": "primary", "label": "Submit", "size": "md" },
{ "variant": "destructive", "label": "Delete", "size": "sm" }
]
}Este manifiesto es a la vez una especificación de diseño y código ejecutable; mejor dicho, las instrucciones a partir de las cuales se puede generar código ejecutable. El agente que consume este manifiesto no necesita entender la estética ni la experiencia de usuario en el sentido humano. Necesita seguir las reglas, combinar los elementos según sus restricciones y producir resultados válidos.
Estoy de acuerdo con Brad Frost en usar un formato yaml.
Los componentes de Drupal usan el formato yaml. Algo como
$schema: https://git.drupalcode.org/project/drupal/-/raw/HEAD/core/assets/schemas/v1/metadata.schema.json
name: Button
status: experimental
description: Use Bootstrap custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.
props:
type: object
properties:
html_tag:
type: string
title: The HTML tag to use for the button (button | a). Defaults to `button`.
default: button
enum:
- button
- a
url:
type: string
title: URL Link
description: URL link for the button when the HTML tag is an anchor link.
$ref: "ui-patterns://url"
color:
type: string
title: Color
description: Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.
default: ''
enum:
- ''
- primary
- secondary
- success
- danger
- warning
- info
- dark
- light
- link
outline:
type: boolean
title: Outline
description: In need of a button, but not the hefty background colors they bring? Replace the default modifier classes with the .btn-outline-* ones to remove all background images and colors on any button.
default: false
size:
type: string
title: Size
description: Bootstrap button size
default: ''
enum:
- ''
- btn-sm
- btn-lg
disabled:
type: boolean
title: Disabled
description: Disabled button
default: false
button_utility_classes:
type: array
title: Utility Classes
default: []
items:
type: 'string'
description: An array of utility classes that can be used to add extra Bootstrap utility classes or custom classes to this component.
attributes:
type: object
title: Attributes
description: HTML attributes for the containing element.
$ref: 'ui-patterns://attributes'
slots:
content:
type: string
title: Content
description: The content for the button
minLength: 1
examples:
- Press
- Submit now
- Save
- Login
- Read more
El diseño es el código.
- Variantes
- Tokens
- Props
Restricciones (podríamos añadirlas a los componentes)
Reglas de los slots (qué se puede colocar en otros slots, o qué se permite colocar en mi slot)
Reglas
Ejemplos
Animaciones ( Permitido o recomendado usar )
Después, observa y experimenta con el comportamiento.
como en https://storybook.demo.varbase.vardot.com/?path=/story/atoms-button--primary
Los design tokens como variables de entorno
Los design tokens son otra pieza clave del rompecabezas. En los autómatas celulares, las células responden a su entorno inmediato: el estado de las células vecinas. En los sistemas de diseño, los componentes responden a los design tokens: los valores contextuales que determinan su apariencia y su comportamiento.
Las arquitecturas de tokens modernas usan varias capas:
- Tokens base: Valores en bruto como
color.blue.500: #3B82F6 - Tokens semánticos: Referencias basadas en la intención, como
color.action.primary: color.blue.500 - Tokens de componente: Aplicaciones acotadas, como
button.background.primary: color.action.primary
Cuando un agente genera un componente Button, no necesita saber que «primary» significa azul. Solo tiene que hacer referencia a button.background.primary y confiar en que el sistema de tokens lo resolverá al valor correcto. El entorno (la capa de tokens) contiene la información; el componente (la célula) solo tiene que responder a ella.
Herramientas como Tokens Studio han evolucionado para tratar los design tokens como grafos computacionales con resolvedores: nodos que toman decisiones semánticas sobre qué tokens base usar según el contexto. Esto convierte los design tokens, que eran valores estáticos, en sistemas dinámicos basados en reglas.
El ecosistema de Drupal y la integración de la IA
Integrar la IA en los sistemas de gestión de contenidos es un laboratorio perfecto para explorar los principios de «el diseño es el código». Los CMS como Drupal ya encarnan los conceptos centrales: tipos de contenido estructurados, definiciones de campos, relaciones y reglas de composición.
Nunca pensé que podríamos decir algo así. Para mí esto era lo último en tecnología.
El ordenador definitivo que podríamos tener. Desarrolladores que parecen venidos del futuro de Star Trek, hablándole al ordenador para que programe por ellos.
La experiencia del agente (AX) y el nuevo usuario
Diseñar para las máquinas
A principios de 2025, Mathias Biilmann, CEO de Netlify, presentó el concepto de «Agent Experience» (AX), una nueva disciplina centrada en cómo interactúan los agentes de IA con los productos y las plataformas.
El cambio es fundamental. Durante décadas, la UX (experiencia de usuario) se optimizó para la cognición, la percepción y el comportamiento humanos. La DX (experiencia del desarrollador) se optimizó para los desarrolladores humanos que crean software. La AX reconoce que los agentes se están convirtiendo en usuarios principales de los sistemas digitales, y tienen necesidades completamente distintas:
- No les importa la estética visual: solo datos estructurados y analizables
- No navegan por las interfaces: llaman a APIs y consumen manifiestos
- No leen la documentación como los humanos: necesitan contexto legible por máquinas
- No emiten juicios subjetivos: siguen reglas y restricciones
"Los agentes de IA no son personas: no les importa el tamaño de un botón, la legibilidad de la tipografía, la hermosa paleta de colores de tu sitio web ni las animaciones llamativas de tu aplicación. Entonces, ¿qué es lo que a los agentes de IA 'les importa'? Es una pregunta que hoy no tiene una respuesta concreta, pero que será cada vez más importante en los próximos años."
- AX Research
La respuesta: reglas claras, comportamientos predecibles, datos bien estructurados y bucles de retroalimentación que les permitan verificar y corregir sus acciones.
El desafío de la doble interfaz
Diseñar para AX significa construir dos interfaces a la vez:
- Interfaz de humano a agente: Donde las personas supervisan, aprueban, editan y guían el comportamiento del agente: la capa de «centro de control». Piensa en paneles y colas de aprobación, no en formularios y botones.
- Interfaz de agente a sistema: Donde los agentes interactúan con APIs, bases de datos y herramientas: la capa «operativa». Debe ser robusta, estar bien documentada y optimizada para la eficiencia de las máquinas.
Esto refleja la arquitectura de los autómatas celulares, donde coexisten dos perspectivas distintas:
- La perspectiva local: cada celda (agente) sigue reglas sencillas basadas en sus vecinas inmediatas
- La perspectiva global: surgen patrones complejos que solo son visibles a gran escala
"El diseño de la experiencia de agente (AX) debería lograr una gran usabilidad para los agentes y de los agentes. Así, una gran AX conduce a una gran experiencia de usuario (UX). Si el agente de IA se encuentra con un proceso o protocolo roto, o incluso con una redacción incoherente entre sistemas, no puede realizar esa tarea. Es una mala experiencia para el agente que, a su vez, lleva a una mala experiencia para el cliente o el empleado."
- Kat Holmes, directora de experiencia (Chief Experience Officer), Salesforce
De UX a AX: la evolución del diseño digital
| UX (usuarios humanos) | DX (desarrolladores) | AX (agentes de IA) |
|---|---|---|
| Interfaces visuales | APIs y SDK | Manifiestos legibles por máquina |
| Conexión emocional | Documentación | Contexto estructurado |
| Flujos de navegación | Ejemplos de código | Definiciones de herramientas |
| Accesibilidad | Seguridad de tipos | Especificaciones de restricciones |
| Mensajes de error | Trazas de pila (stack traces) | Bucles de retroalimentación para la autocorrección |
Estigmergia y comunicación indirecta
Uno de los conceptos más poderosos de la inteligencia de enjambre es la estigmergia: la coordinación indirecta mediante huellas en el entorno. Las hormigas no se comunican directamente sobre dónde hay comida; dejan rastros de feromonas que otras hormigas siguen. El entorno se convierte en un medio de comunicación.
En los sistemas de diseño agénticos, la estigmergia adopta la forma de:
- Bibliotecas de componentes compartidas: los agentes «ven» qué componentes existen y cómo se han usado
- Design tokens: valores semánticos que codifican las decisiones de diseño como hechos del entorno
- Documentación de patrones: ejemplos de uso que sirven de rastro de feromonas para los futuros agentes
- Suites de pruebas: reglas de validación que acotan el espacio de resultados válidos
- Historial de Git: un registro de decisiones pasadas al que los agentes pueden recurrir
Cuando un agente genera una interfaz con un componente, deja huellas: en el código, en la documentación, en los patrones que establece. Los futuros agentes que se enfrenten a tareas similares se verán influidos por esas huellas, lo que crea una forma de inteligencia colectiva que ningún agente posee por sí solo.
Patrones de diseño agéntico
Andrew Ng y otros han identificado cuatro patrones clave para los sistemas de IA agénticos:
- Reflexión: la IA evalúa su propio resultado y lo mejora de forma iterativa
- Uso de herramientas: la IA interactúa con herramientas, APIs y sistemas externos
- Planificación:La IA divide las tareas complejas en subtareas y las ejecuta de forma secuencial
- Multiagente: Varios agentes especializados colaboran en tareas complejas
Estos patrones se corresponden directamente con los conceptos de los autómatas celulares:
| Patrón agéntico | Equivalente en autómatas celulares |
|---|---|
| Reflexión | Las celdas se actualizan según la evaluación del estado actual |
| Uso de herramientas | Las celdas interactúan con variables del entorno |
| Planificación | Evolución a lo largo de varias generaciones hacia configuraciones estables |
| Multiagente | Distintos tipos de celdas con reglas especializadas (autómatas multicelulares) |
El diseño es el código: una lectura más profunda
Lo que realmente significa «el diseño es el código»
Cuando decimos «el diseño es el código», estamos afirmando varias cosas a la vez:
1. Equivalencia semántica
Las decisiones de diseño, bien codificadas, se vuelven ejecutables. Un token de diseño no es solo un valor: es una instrucción. La especificación de un componente no es solo documentación: es un programa. Cuando los agentes consumen estos artefactos, ejecutan el diseño tanto como lo implementan.
2. Capacidad generativa
Igual que la Regla 110 puede calcular cualquier cosa computable, un sistema de diseño lo bastante completo puede generar cualquier interfaz válida. El sistema contiene el potencial de todas sus expresiones válidas. Lo que surja dependerá únicamente de las condiciones iniciales (los requisitos) y de las reglas (las restricciones).
3. Complejidad emergente
Las interfaces más sofisticadas no se diseñan de arriba abajo; emergen de la aplicación coherente de reglas simples. Un botón bien diseñado, usado con coherencia, produce un lenguaje visual cohesionado sin que nadie haya planificado esa cohesión de forma explícita.
4. Irreducibilidad computacional
Algunos resultados de diseño no se pueden predecir sin ejecutar realmente el sistema. No puedes saber qué aspecto tendrá una interfaz ensamblada por un agente sin dejar que el agente la ensamble. Es el principio de irreducibilidad computacional de Wolfram aplicado al diseño.
5. Automodificación
Como los evoloops, que mutan durante la replicación, los sistemas de diseño preparados para agentes pueden evolucionar con el uso. Los componentes que generan los agentes pasan a formar parte de la biblioteca que consumirán los agentes futuros. El sistema aprende, se adapta y crece.
La metáfora de los autómatas celulares, ampliada
| Autómatas celulares | Sistemas de diseño agénticos |
|---|---|
| Cuadrícula de celdas | Lienzo de elementos de interfaz |
| Estados de las celdas | Instancias de componentes y sus props |
| Vecindad | Contexto de maquetación y componentes adyacentes |
| Reglas de actualización | Restricciones de composición y tokens de diseño |
| Generaciones | Ciclos de renderizado y actualizaciones de estado |
| Patrones emergentes | Interfaces completas y flujos de usuario |
| Autorreplicación | Bibliotecas de componentes que permiten crear componentes nuevos |
| Computación universal | Sistemas de diseño capaces de expresar cualquier interfaz válida |
| Planeadores (patrones que se desplazan) | Patrones reutilizables que se propagan entre productos |
| Vidas estáticas (patrones estables) | Componentes consolidados que no cambian |
| Osciladores | Componentes animados, estados de carga, transiciones |
Más allá de la metáfora: una convergencia real
Pero esto no es solo una metáfora. La convergencia es real y está ocurriendo ahora mismo:
- Storybook MCP convierte las bibliotecas de componentes en instrucciones legibles por máquina que los agentes ejecutan
- Model Context Protocol estandariza cómo acceden los agentes a las herramientas y al contexto, creando un sustrato universal para las operaciones agénticas
- Las arquitecturas multiagente reparten el trabajo entre agentes especializados (arquitecto, programador, revisor) que interactúan según protocolos, como células con funciones diferenciadas
- Bucles de autorreparaciónPermitir que los agentes ejecuten pruebas, detecten errores e iteren: los mismos mecanismos de retroalimentación que usan los autómatas celulares para evolucionar hacia configuraciones estables
- Schema.org Blueprints hacen que las estructuras de contenido sean legibles por máquinas y tengan significado semántico
- Drupal AI proporcionan la infraestructura para que los agentes de IA creen, modifiquen y gestionen contenido de forma autónoma
No abordamos «el diseño es el código» como una postura filosófica. Lo estamos construyendo como infraestructura técnica.
Implicaciones y el camino por delante
Para diseñadores
El papel del diseñador está pasando de «creador de rectángulos» a «definidor de reglas». Como observó Brad Frost:
«Los diseñadores y desarrolladores que ven su trabajo como crear rectángulos tienen mucho de qué preocuparse. Pero los que ven su trabajo como resolver problemas —y, de paso, tienen que crear o manejar algunos rectángulos para resolverlos— tienen mucho menos que temer».
- Brad Frost
En el futuro agéntico, los diseñadores:
- Definirán tokens semánticos y las relaciones entre ellos
- Establecerán restricciones de composición y patrones
- Crearán reglas de validación que los agentes deberán cumplir
- Cuidarán y harán evolucionar las reglas que gobiernan la emergencia
- Diseñarán los mecanismos de retroalimentación que permiten la autocorrección
- Darán forma a las «funciones de aptitud» que determinan qué resultados son aceptables
Es diseño en un nivel más alto de abstracción: diseñar las reglas que producen diseños, en lugar de los diseños en sí. Como definir las reglas de un autómata celular en vez de dibujar cada celda una por una.
Para desarrolladores
Los desarrolladores se convierten en arquitectos de sistemas de agentes. Como describe Anthropic:
«El ámbito del desarrollo de software ha mostrado un potencial notable para las funciones basadas en LLM, con capacidades que han evolucionado desde el autocompletado de código hasta la resolución autónoma de problemas».
Los desarrolladores tendrán que:
- Crear interfaces legibles por máquinas entre agentes y sistemas
- Diseñar bucles de retroalimentación y mecanismos de validación
- Construir el andamiaje dentro del cual surge el comportamiento emergente
- Mantener la supervisión humana como árbitro final
- Definir los protocolos con los que se comunican los agentes
- Implementar el «código pegamento» que conecta distintos sistemas de agentes
Para el desarrollo web y las plataformas CMS
La integración de la IA en plataformas como Drupal apunta hacia un futuro en el que:
- Los modelos de contenido pasan a ser consumibles por agentes gracias a estándares como Schema.org
- Los flujos editoriales cuentan con la ayuda de agentes con redacción, moderación y optimización impulsadas por IA
- La búsqueda evoluciona del emparejamiento de palabras clave a la comprensión semántica mediante embeddings y bases de datos vectoriales
- La personalización se vuelve autónoma con agentes que aprenden las preferencias de los usuarios y adaptan el contenido en tiempo real
- El desarrollo se acelera porque los agentes generan componentes, pruebas y documentación
La apuesta del ecosistema de Drupal por la IA, con módulos como Drupal AI, Drupal Canvas, Schema.org Blueprints y la integración de proveedores de IA, demuestra que ese futuro ya se está construyendo.
Para las organizaciones
La ventaja competitiva será de las organizaciones cuyos sistemas de diseño estén más «listos para agentes». Los sistemas listos para agentes se caracterizan por:
- Cobertura completa de estados y variantes de los componentes
- Nombres semánticos que transmiten la intención
- Documentación y contexto legibles por máquinas
- Infraestructura de validación y pruebas
- Restricciones claras que acotan el espacio de resultados válidos
- APIs diseñadas para el consumo por agentes (AX-first)
- Arquitecturas de contenido basadas primero en Schema.org
Para el futuro de los productos digitales
El estado final se parece a una ecología digital: innumerables agentes que operan según reglas locales y producen interfaces emergentes que ningún diseñador ni desarrollador planificó, pero que de algún modo encajan entre sí porque las reglas de fondo son sólidas.
Esto no es tan descabellado como suena. Es precisamente cómo funcionan los sistemas biológicos, cómo crecen las ciudades, cómo operan los mercados. La cuestión no es si llegaremos a ese estado, sino cómo afrontaremos la transición.
Conclusión: el código está vivo
John von Neumann, el polímata que inventó los autómatas celulares, estaba movido por una pregunta fundamental: ¿Cuál es la complejidad mínima necesaria para la autorreproducción? Su respuesta, el constructor universal de von Neumann, demostró que la autorreplicación no requiere maquinaria biológica. Solo requiere reglas que codifiquen su propia aplicación.
Setenta años después, descubrimos que el mismo principio vale para los sistemas de diseño. El requisito mínimo para la generación autónoma de interfaces no es la inteligencia artificial general ni una creatividad de nivel humano. Es un conjunto de reglas completo, coherente y legible por máquina que los agentes puedan ejecutar.
Cuando los bucles de Langton se replican por una cuadrícula celular, no decimos que los bucles estén «diseñando» nuevos bucles. La replicación es simplemente lo que producen las reglas. Y sin embargo el resultado, colonias en constante expansión de patrones autosimilares, es innegablemente generativo, creativo en cierto sentido funcional.
Cuando los agentes de IA ensamblan interfaces a partir de componentes de un sistema de diseño, siguiendo tokens semánticos y restricciones de composición, hacen algo parecido. La «creatividad» no reside en los agentes, sino en las reglas que ejecutan: reglas que diseñaron personas, pero que ahora funcionan de forma autónoma.
El sentido más profundo
Este es el sentido más profundo de «el diseño es el código»: no solo que las especificaciones de diseño se vuelvan ejecutables, sino que los sistemas de diseño cobren vida. Crecen. Replican sus patrones. Evolucionan con el uso. Muestran comportamientos que nadie programó de forma explícita.
Estamos en el umbral de una nueva era de la creación digital. Los agentes ya están aquí. Los protocolos se están formando. Los sistemas de diseño se están convirtiendo en sustratos para la vida artificial.
El diseño es el código.
Y el código está cobrando vida.
Artículos y proyectos clave
- Design Systems in the Time of AI - Brad Frost
- Storybook MCP Sneak Peek - Storybook
- Introducing AX: Why Agent Experience Matters - Mathias Biilmann
- Building Effective Agents - Anthropic
Recursos de Drupal AI
Recursos sobre autómatas celulares
- Léxico del Juego de la vida de Conway - Cerca de 1500 figuras
- Una máquina de Turing funcional en el Juego de la vida
- Bucles de Langton - Wikipedia
- Conjuntos de reglas para autómatas celulares
- A New Kind of Science Online - Stephen Wolfram
- Autómatas celulares - Nature of Code
Exploré ideas en la intersección de la teoría computacional, los sistemas de diseño, la inteligencia artificial y el desarrollo web.
Las opiniones expresadas son exploraciones especulativas de tendencias emergentes, no predicciones de futuros seguros.
Veo que estamos creando agentes de IA que trabajan en un bucle e interactúan con otros agentes de IA en bucles adicionales.
El diseño es el código cuando el sistema opera en un bucle, como un bucle de vida, dentro de un lienzo y un conjunto de reglas elegidos.