El disseny és el codi

The Design is the Code

 

Com la lògica dels autòmats cel·lulars remodelarà els sistemes de disseny agèntics, i per què el futur del desenvolupament web potser ja està escrit en regles senzilles

S'està produint una transformació profunda a la intersecció entre els sistemes de disseny, la intel·ligència artificial i la teoria computacional. És un canvi tan fonamental que posa en dubte què vol dir realment «disseny» a l'era dels agents autònoms.

 

 

 

Durant dècades hem tractat el disseny i el codi com a disciplines separades: el disseny com l'àmbit de la creativitat humana i el criteri estètic, el codi com la traducció mecànica d'aquestes idees a una forma executable. Però a mesura que els agents d'IA munten cada cop més interfícies d'usuari de manera autònoma, consumeixen els sistemes de disseny com a infraestructura llegible per màquines i generen codi a partir de tokens semàntics, ens apropem a un punt de convergència que fa ressò d'una idea molt més antiga de la teoria computacional.

 

Quina idea? El disseny és el codi.

 

No és només una frase d'efecte. És el reconeixement que potser ens encaminem cap a un món on els sistemes de disseny funcionen com autòmats cel·lulars: regles senzilles que donen lloc a comportaments complexos i emergents. Un món on la distinció entre «dissenyar» una cosa i «programar-la» es dissol del tot. Un món on els agents autònoms no només fan servir els sistemes de disseny, sinó que són sistemes de disseny en acció.

El moment de la convergència

L'11 de desembre de 2025, Brad Frost (creador del Disseny Atòmic) es va unir a Dominic Nguyen (cofundador de Chromatic) en una sessió en directe sobre «Agentic Design Systems in 2026». El seu missatge era clar: els agents d'IA ja munten interfícies amb els mateixos components que fan servir els equips humans. Els sistemes de disseny han d'evolucionar cap a una infraestructura llegible per màquines, o corren el risc de convertir-se en peces d'una època passada.

 

 

Tal com va anunciar l'equip de Storybook: «La IA està començant a fer servir els sistemes de disseny exactament tal com estan documentats. Les llacunes en els exemples, els estats i les restriccions porten directament a resultats d'interfície imprevisibles.»

Aquesta entrada del bloc explora les connexions profundes entre els autòmats cel·lulars, el comportament emergent i el futur dels sistemes de disseny agèntics. Traçarem els fonaments teòrics des de les màquines autoreplicants de von Neumann fins als eixams d'agents d'IA d'avui.

 

Examinarem com Drupal i les plataformes CMS modernes integren la IA mitjançant mòduls com Schema.org Blueprints i Drupal AI. I ens preguntarem què significa tot plegat per als dissenyadors, els desenvolupadors i el futur de la creació de productes digitals.


Els autòmats cel·lulars i la lògica de l'emergència

La bellesa de les regles senzilles

L'any 1970, el matemàtic John Conway va presentar el Joc de la vida, un «joc de zero jugadors» que acabaria sent un dels sistemes més estudiats de la teoria computacional. Les regles són d'una simplicitat impressionant:

  1. Qualsevol cèl·lula viva amb menys de dos veïns vius mor (subpoblació)
  2. Qualsevol cèl·lula viva amb dos o tres veïns vius sobreviu
  3. Qualsevol cèl·lula viva amb més de tres veïns vius mor (sobrepoblació)
  4. Qualsevol cèl·lula morta amb exactament tres veïns vius torna a la vida (reproducció)

D'aquestes quatre regles, expressades en un grapat de condicions binàries, sorgeix un univers sorprenent de complexitat. Els planadors recorren quadrícules infinites. Els oscil·ladors bateguen en ritmes perpetus. Els canons disparen fluxos de patrons per l'espai cel·lular. I, el més remarcable, s'ha demostrat que el Joc de la vida és Turing complet: tot el que es pot calcular algorítmicament es pot, en principi, calcular dins de la senzilla quadrícula de Conway.

 

 

Figura 1: el canó de planadors de Gosper al Joc de la vida de Conway. Aquest patró produeix un corrent continu de planadors, i demostra com unes regles senzilles poden generar una complexitat infinita que es perpetua a si mateixa.

 

 

Aquesta és la primera lliçó dels autòmats cel·lulars: la complexitat no és un requisit previ per a un comportament complex. Unes regles senzilles, aplicades de manera coherent sobre un substrat, poden donar lloc a patrons i comportaments que ningú no ha programat explícitament.

Vídeo essencial: introducció als autòmats cel·lulars

Una introducció als autòmats cel·lulars, amb el Joc de la vida de Conway i els bucles de Langton, que s'autoreplicen

Aquest vídeo mostra diverses animacions, entre les quals l'autodestrucció final que es produiria si els bucles de Langton poguessin replicar-se sobre un tor gran (on els costats oposats de la quadrícula estan units).

 

 

 

 

Recursos addicionals del vídeo:


Els bucles de Langton i l'autoreplicació

El 1984, Christopher Langton va portar aquest principi més lluny amb els seus bucles autoreplicants, un autòmat cel·lular que demostrava uns principis genuïns de vida artificial. A diferència del Joc de la vida de Conway, que mostra una complexitat emergent, els bucles de Langton mostren una reproducció.

emergent. Cada bucle consta d'un contorn cíclic que tanca un «genoma» codificat en estats de cel·la. Aquest genoma circula sense parar pel bucle i surt per un braç de construcció, que bast.eix un bucle filla en 151 passos de temps. Quan acaba, la filla se separa de la mare, i totes dues continuen replicant-se.

 

Grid art of a red path with blue, yellow, and cyan tiles, on a dark background.

Figura 2: el bucle de Langton en la configuració inicial. La informació genètica circula pel bucle i dirigeix la construcció dels bucles filla mitjançant el braç que s'estén.

 

«Si una màquina que es reprodueix a si mateixa és possible dins d'un autòmat cel·lular, potser les màquines poden arribar a assolir la vida mateixa.»

- Christopher Langton, «Studying Artificial Life with Cellular Automata» (1986)

Les implicacions són profundes. Els bucles de Langton demostren que l'autoreplicació no requereix la complexitat de les cèl·lules biològiques ni les capacitats de construcció universal del disseny original de von Neumann. Només cal:

  • Un conjunt de regles senzilles i locals
  • Un mecanisme per codificar instruccions
  • Un procés mitjançant el qual s'executin aquestes instruccions

Les regles són l'organisme. El disseny és el codi.

El 1999, Hiroki Sayama va introduir els evoloops, unes variants que incorporen la dissolubilitat estructural i les interaccions fenotípiques, i que permeten mutacions espontànies i dinàmiques evolutives. Aquests bucles evolucionen mitjançant col·lisions físiques directes durant la replicació, cosa que comporta variacions de genotip, una diversitat morfològica més gran i un creixement de la complexitat al llarg de les generacions. A diferència de la replicació fixa de Langton, els evoloops mostren mutacions heretables sense cap intervenció externa.

 

 

Regla 110 i computació universal

L'exploració que Stephen Wolfram va fer dels autòmats cel·lulars elementals va culminar en un descobriment sorprenent: la regla 110, una de les 256 regles possibles per al tipus més simple d'autòmat cel·lular unidimensional, és capaç de fer computació universal.

La regla 110 es pot especificar completament donant el resultat per a cadascuna de les vuit combinacions possibles d'una cel·la i els seus dos veïns. Però aquesta regla trivialment simple —vuit decisions binàries— pot simular una màquina de Turing universal.

 

Rull 110 cellular automaton - Triangle pattern with black and white abstract geometric design.

Figura 3: L'autòmat cel·lular de la regla 110. Malgrat la seva definició senzilla, la regla 110 mostra un comportament de classe 4 —patrons complexos que no són ni del tot estables ni del tot caòtics— i s'ha demostrat que és Turing complet.

 

«No cal res que s'assembli a la CPU d'un ordinador sencer per fer càlcul universal. N'hi ha prou amb aquesta petita regla.»

- Stephen Wolfram, «A New Kind of Science»

El 2004, Matthew Cook va publicar una demostració que la regla 110, amb un patró de fons repetitiu determinat, és Turing completa. La demostració mostra que la regla 110 pot emular sistemes d'etiquetes cíclics, que alhora poden emular qualsevol màquina de Turing. Entre els 88 autòmats cel·lulars elementals únics possibles, la regla 110 és l'única de la qual s'ha demostrat directament la completesa de Turing.

El principi d'equivalència computacional que va proposar Wolfram suggereix quelcom encara més radical: els sistemes que superen un llindar mínim de complexitat són essencialment equivalents en les seves capacitats computacionals. Un cervell humà, un sistema meteorològic i la regla 110 són, en un sentit profund, computacionalment equivalents.

Les quatre classes d'autòmats cel·lulars de Wolfram

  • Classe 1: L'evolució condueix a un estat homogeni
  • Classe 2: L'evolució condueix a estructures periòdiques separades
  • Classe 3: L'evolució condueix a patrons caòtics i aleatoris
  • Classe 4: L'evolució condueix a patrons complexos amb estructures localitzades, capaços de càlcul universal

La regla 110 mostra un comportament de classe 4, que Wolfram descriu com a situat a la «vora del caos» —una frontera crítica on les regles simples produeixen la màxima potència computacional.

La metacel·la 0E0P: l'autoreplicació de debò

L'octubre del 2018, Adam P. Goucher va acabar la construcció de la metacel·la 0E0P—un patró del Joc de la vida de Conway capaç d'autoreplicar-se de debò. A diferència de les metacel·les anteriors, que necessitaven còpies preexistents als voltants, la metacel·la 0E0P pot construir còpies de si mateixa des de zero, inclosa la seva pròpia cinta d'instruccions.

Aquesta fita representa un moment clau de la vida artificial: un sistema que es pot propagar a través d'un substrat computacional fent servir només regles locals. El 23 de novembre del 2013, Dave Greene va construir el primer replicador del Joc de la vida que crea una còpia completa de si mateix, inclosa la cinta d'instruccions, demostrant que fins i tot l'autòmat senzill de dos estats de Conway pot sostenir una reproducció il·limitada.

 

Per explorar més: vídeos sobre autòmats cel·lulars

 

Cerca més contingut fascinant sobre autòmats cel·lulars:

▶️ Cerca a YouTube: "cellular automata the design is the code"


Els sistemes de disseny com a substrats computacionals

Del disseny atòmic al disseny agèntic

La metodologia de disseny atòmic (Atomic Design) de Brad Frost, presentada el 2013, va revolucionar la manera de pensar els sistemes de disseny. En dividir les interfícies en àtoms (elements bàsics com els botons i els camps d'entrada), molècules (combinacions senzilles), organismes (seccions complexes de la interfície), plantilles (disposicions de pàgina) i pàgines (les implementacions finals), el disseny atòmic va oferir una estructura jeràrquica per gestionar la complexitat.

Però mirant enrere, el més remarcable és això: el disseny atòmic ja encarnava els principis dels autòmats cel·lulars sense reconèixer-los de manera explícita.

Principi dels autòmats cel·lularsEquivalent al disseny atòmic
Regles localsCada nivell de components té regles sobre com es pot combinar amb els altres
EmergènciaLes pàgines complexes sorgeixen de la combinació d'elements més simples
ReproductibilitatEls mateixos àtoms, combinats segons les mateixes regles, donen resultats coherents
EscalabilitatEl sistema creix sense control centralitzat: cada component «sap» com s'ha de comportar
AutoorganitzacióEls design tokens propaguen els canvis per tot el sistema de manera automàtica

«Quan el sistema de disseny és avorrit, allibera dissenyadors i desenvolupadors perquè facin coses noves i resolguin problemes nous. El sistema de disseny carrega amb el pes d'allò avorrit, de manera que dissenyadors i desenvolupadors no hagin de fer-ho.»

- Josh Clark, «The Most Exciting Design Systems Are Boring»

El febrer de 2023, Brad Frost va escriure sobre «Design Systems in the Time of AI»:

«La IA és una consumidora natural de sistemes de disseny... El cert és que una bona part de la feina de components d'un sistema de disseny és realment mecànica i previsible. Ja fem servir eines com PlopJS per generar el codi base d'un component amb la forma de la resta de la biblioteca. Rebria amb els braços oberts l'ajuda de la IA per generar-me moltes d'aquestes coses habituals de codi base.»

- Brad Frost

El caràcter mecànic i previsible dels sistemes de disseny és precisament el que els fa aptes per funcionar com un autòmat cel·lular. Quan les regles són clares, locals i s'apliquen de manera coherent, els agents poden operar de forma autònoma, igual que les cèl·lules del Joc de la vida de Conway no necessiten cap controlador central per produir planadors i oscil·ladors.

L'imperatiu de la llegibilitat per a les màquines

La iniciativa Storybook MCP (Model Context Protocol) representa una evolució decisiva en aquesta direcció. Anunciat a finals del 2025, Storybook MCP ofereix als agents de programació amb IA metadades de components llegibles per màquina a partir de configuracions de Storybook ja existents.

La clau és que els agents no necessiten codi en brut ni documentació visual. Necessiten:

  • Manifests de components: metadades estructurades de cada component: les seves propietats (props), variants, vinculacions amb design tokens i exemples d'ús
  • Nomenclatura semàntica: tokens carregats d'intenció, com ara action.primary.confirm, que transmeten significat als agents i no només valors
  • Bucles de validació: la capacitat d'executar proves, veure'n els errors i autocorregir-se

«Storybook MCP ajuda els agents a seguir els vostres patrons i a superar les vostres proves. Els dona dues coses que no havien tingut mai: metadades de components llegibles per màquina i un bucle iteratiu per autocorregir els errors.»

- L'equip de Storybook

Storybook MCP inclou un bucle de correcció autònom. Permet que els agents executin les proves dels components (d'interacció i d'accessibilitat), vegin què falla i arreglin els seus propis errors. El desenvolupador només ha d'intervenir quan les proves ja passen. S'ha acabat fer de mainadera dels prompts.

Aquesta és exactament l'arquitectura d'un autòmat cel·lular aplicada al disseny: regles locals (les especificacions dels components), interaccions amb els veïns (els patrons de composició) i actualitzacions iteratives (validació i autocorrecció).

 

El meu manifest de components com a genoma

La comparació amb els bucles de Langton encaixa encara millor quan pensem en com funcionen els manifests de components. En el sistema de Langton, el «genoma» codificat a les cèl·lules que hi circulen conté les instruccions per construir un bucle nou. En un sistema de disseny llegible per màquina, el manifest del component conté les instruccions per muntar les interfícies.

Un manifest de component podria 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" }
  ]
}

Aquest manifest és alhora una especificació de disseny i codi executable; o, més ben dit, les instruccions a partir de les quals es pot generar codi executable. L'agent que consumeix aquest manifest no necessita entendre l'estètica ni l'experiència d'usuari en el sentit humà. Només ha de seguir les regles, combinar els elements segons les seves restriccions i produir resultats vàlids.

 

Comparteixo amb Brad Frost la idea d'usar un format yaml.

 

Els components de Drupal fan servir el format yaml. Alguna cosa com

$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 disseny és el codi.

  • Variants
  • Tokens
  • Props
  • Restriccions (podríem afegir-les als components)

  • Regles dels slots (què es pot col·locar en altres slots, o què es permet col·locar al meu slot)

  • Regles

  • Exemples 

  • Animacions  ( Permeses o recomanades )

Després, observa i experimenta amb el comportament.

com a https://storybook.demo.varbase.vardot.com/?path=/story/atoms-button--primary 

 

Els design tokens com a variables d'entorn

Els design tokens són una altra peça clau del trencaclosques. En els autòmats cel·lulars, les cel·les responen al seu entorn immediat: els estats de les cel·les veïnes. En els sistemes de disseny, els components responen als design tokens: els valors contextuals que determinen l'aspecte i el comportament.

Les arquitectures de tokens modernes fan servir diverses capes:

  • Tokens bàsics: Valors en brut com color.blue.500: #3B82F6
  • Tokens semàntics: Referències orientades a la intenció com color.action.primary: color.blue.500
  • Tokens de component: Aplicacions acotades com button.background.primary: color.action.primary

Quan un agent genera un component Button, no cal que sàpiga que "primary" vol dir blau. Només ha de referenciar button.background.primary i confiar que el sistema de tokens ho resoldrà al valor correcte. L'entorn (la capa de tokens) conté la informació; el component (la cel·la) només ha de respondre-hi.

Eines com Tokens Studio han evolucionat per tractar els design tokens com a grafs computacionals amb resolvedors: nodes que prenen decisions semàntiques sobre quins tokens base cal fer servir segons el context. Això transforma els design tokens de valors estàtics en sistemes dinàmics basats en regles.


L'ecosistema Drupal i la integració de la IA

La integració de la IA als sistemes de gestió de continguts (CMS) és un laboratori perfecte per explorar els principis de "el disseny és el codi". CMS com Drupal ja incorporen els conceptes essencials: tipus de contingut estructurats, definicions de camps, relacions i regles de composició.

Mai no hauria pensat que podríem dir una cosa així. Per a mi, això era l'estat de l'art.

 El conjunt d'ordinador definitiu que podríem tenir. Uns desenvolupadors que semblen sortits del futur de Star Trek, parlant amb l'ordinador perquè programi per ells.

 

 

L'experiència d'agent (AX) i el nou usuari

Dissenyar per a les màquines

A principis del 2025, Mathias Biilmann, CEO de Netlify, va presentar el concepte d'"Agent Experience" (AX), una disciplina nova centrada en com els agents d'IA interactuen amb productes i plataformes.

El canvi és de fons. Durant dècades, la UX (experiència d'usuari) va optimitzar per a la cognició, la percepció i el comportament humans. La DX (experiència de desenvolupador) va optimitzar per als desenvolupadors humans que creen programari. L'AX reconeix que els agents s'estan convertint en usuaris principals dels sistemes digitals, i que tenen necessitats totalment diferents:

  • No els importa l'estètica visual: només dades estructurades i analitzables
  • No naveguen per les interfícies: criden API i consumeixen manifests
  • No llegeixen la documentació com els humans: necessiten context llegible per màquines
  • No fan judicis subjectius: segueixen regles i restriccions

"Els agents d'IA no són persones: no els importa la mida d'un botó, la llegibilitat de la tipografia, la bella paleta de colors del vostre lloc web ni les animacions cridaneres de la vostra aplicació. Aleshores, de què «es preocupen» els agents d'IA? Aquesta és una pregunta que avui no té cap resposta concreta, però que serà cada cop més important en els propers anys."

- Recerca d'AX

La resposta: regles clares, comportaments previsibles, dades ben estructurades i bucles de retroalimentació que els permetin verificar i corregir les seves accions.

El repte de la doble interfície

Dissenyar per a l'AX vol dir construir dues interfícies alhora:

  1. Interfície humà-agent: On els humans supervisen, aproven, editen i guien el comportament de l'agent: la capa de «control de missió». Penseu en tauleres de control i cues d'aprovació, no en formularis i botons.
  2. Interfície agent-sistema: On els agents interactuen amb API, bases de dades i eines: la capa «operativa». Ha de ser robusta, ben documentada i optimitzada per a l'eficiència de les màquines.

Això reflecteix l'arquitectura dels autòmats cel·lulars, on conviuen dues perspectives diferenciades:

  • La perspectiva local: Cada cèl·lula (agent) segueix regles senzilles basades en els seus veïns immediats
  • La perspectiva global: Emergeixen patrons complexos que només són visibles a escala

"El disseny de l'experiència d'agent (AX) hauria de generar una gran usabilitat per als agents i dels agents. Així, una bona AX porta a una bona experiència d'usuari (UX). Si l'agent d'IA es troba amb un procés trencat, un protocol defectuós o fins i tot una redacció incoherent entre sistemes, no pot dur a terme la tasca. Això és una mala experiència per a l'agent que, al seu torn, es tradueix en una mala experiència per al client o l'empleat."

- Kat Holmes, Chief Experience Officer, Salesforce

De la UX a l'AX: l'evolució del disseny digital

UX (usuaris humans)DX (desenvolupadors)AX (agents d'IA)
Interfícies visualsAPI i SDKManifestos llegibles per màquines
Implicació emocionalDocumentacióContext estructurat
Fluxos de navegacióExemples de codiDefinicions d'eines
AccessibilitatSeguretat de tipusEspecificacions de restriccions
Missatges d'errorTraces de pilaBucles de retroalimentació per a l'autocorrecció


Estigmèrgia i comunicació indirecta

Un dels conceptes més potents de la intel·ligència d'eixam és l'estigmèrgia: la coordinació indirecta a través de rastres a l'entorn. Les formigues no es comuniquen directament sobre on hi ha el menjar; deixen rastres de feromones que les altres formigues segueixen. L'entorn esdevé un mitjà de comunicació.

En els sistemes de disseny agèntics, l'estigmèrgia pren la forma de:

  • Biblioteques de components compartides: Els agents «veuen» quins components existeixen i com s'han fet servir
  • Tokens de disseny: Valors semàntics que codifiquen les decisions de disseny com a fets de l'entorn
  • Documentació de patrons: Exemples d'ús que fan de rastres de feromones per als agents futurs
  • Suites de proves: Regles de validació que delimiten l'espai de sortides vàlides
  • Historial de Git: Un registre de decisions passades al qual els agents poden recórrer

Quan un agent genera una interfície d'usuari amb un component, deixa rastres: al codi, a la documentació, en els patrons que estableix. Els agents futurs que es trobin amb tasques similars rebran la influència d'aquests rastres, i es crearà una forma d'intel·ligència col·lectiva que cap agent no té per si sol.

Patrons de disseny agèntic

Andrew Ng i d'altres han identificat quatre patrons clau per als sistemes d'IA agèntica:

  1. Reflexió: La IA avalua la seva pròpia sortida i la millora de manera iterativa
  2. Ús d'eines: La IA interactua amb eines, API i sistemes externs
  3. Planificació:La IA divideix les tasques complexes en subtasques i les executa de manera seqüencial
  4. Multiagent: Diversos agents especialitzats col·laboren en tasques complexes

Aquests patrons s'associen directament als conceptes dels autòmats cel·lulars:

Patró agènticEquivalent en els autòmats cel·lulars
ReflexióLes cèl·lules s'actualitzen a partir de l'avaluació de l'estat actual
Ús d'einesLes cèl·lules interactuen amb variables de l'entorn
PlanificacióEvolució al llarg de moltes generacions cap a configuracions estables
MultiagentDiferents tipus de cèl·lules amb regles especialitzades (autòmats multicel·lulars)

El disseny és el codi: una lectura més profunda

Què vol dir realment «el disseny és el codi»

Quan diem «el disseny és el codi», estem afirmant diverses coses alhora:

1. Equivalència semàntica

Les decisions de disseny, quan es codifiquen bé, esdevenen executables. Un token de disseny no és només un valor: és una instrucció. L'especificació d'un component no és només documentació: és un programa. Quan els agents consumeixen aquests artefactes, executen el disseny tant com l'implementen.

2. Capacitat generativa

Igual que la Regla 110 pot calcular qualsevol cosa calculable, un sistema de disseny prou complet pot generar qualsevol interfície vàlida. El sistema conté el potencial de totes les seves expressions vàlides. Allò que en sorgeix només depèn de les condicions inicials (els requisits) i de les regles (les restriccions).

3. Complexitat emergent

Les interfícies més sofisticades no es dissenyen de dalt a baix; sorgeixen de l'aplicació coherent de regles simples. Un botó ben dissenyat, usat amb coherència, produeix un llenguatge visual cohesionat sense que ningú hagi planificat explícitament aquesta cohesió.

4. Irreductibilitat computacional

Alguns resultats de disseny no es poden predir sense executar realment el sistema. No pots saber com serà una interfície muntada per un agent sense deixar que l'agent la munti. Aquest és el principi de la irreductibilitat computacional de Wolfram aplicat al disseny.

5. Automodificació

Com els evoloops, que muten durant la replicació, els sistemes de disseny preparats per als agents poden evolucionar amb l'ús. Els components generats pels agents passen a formar part de la biblioteca que consumiran els agents futurs. El sistema aprèn, s'adapta i creix.

La metàfora dels autòmats cel·lulars, ampliada

Autòmats cel·lularsSistemes de disseny agèntics
Quadrícula de cèl·lulesLlenç d'elements d'interfície
Estats de les cèl·lulesInstàncies de components i les seves props
VeïnatgeContext de maquetació i components adjacents
Regles d'actualitzacióRestriccions de composició i tokens de disseny
GeneracionsCicles de renderització i actualitzacions d'estat
Patrons emergentsInterfícies completes i fluxos d'usuari
AutoreplicacióBiblioteques de components que permeten crear-ne de nous
Computació universalSistemes de disseny capaços d'expressar qualsevol interfície vàlida
Planadors (patrons en moviment)Patrons reutilitzables que es propaguen entre productes
Natures mortes (patrons estables)Components consolidats que no canvien
Oscil·ladorsComponents animats, estats de càrrega, transicions

Més enllà de la metàfora: una convergència real

Però això no és només una metàfora. La convergència és real i està passant ara mateix:

  • Storybook MCP converteix les biblioteques de components en instruccions llegibles per màquines que els agents executen
  • Model Context Protocol estandarditza la manera com els agents accedeixen a eines i context, i crea un substrat universal per a les operacions agèntiques
  • Les arquitectures multiagent repartigen el treball entre agents especialitzats (arquitecte, programador, revisor) que interactuen segons uns protocols, com cèl·lules amb funcions diferenciades
  • Bucles d'autoreparacióPermeten als agents executar proves, detectar errors i iterar: els mateixos mecanismes de retroalimentació que fan servir els autòmats cel·lulars per evolucionar cap a configuracions estables
  • Schema.org Blueprints fan que les estructures de contingut siguin llegibles per les màquines i tinguin sentit semàntic
  • Drupal AI ofereixen la infraestructura perquè els agents d'IA creïn, modifiquin i gestionin contingut de manera autònoma

No ens plantegem «el disseny és el codi» com una posició filosòfica. Ho estem construint com a infraestructura tècnica.


Implicacions i camí per endavant

Per als dissenyadors

El paper del dissenyador es transforma: de «creador de rectangles» a «definidor de regles». Tal com va observar Brad Frost:

«Els dissenyadors i desenvolupadors que entenen la seva feina com a crear rectangles tenen motius de sobra per preocupar-se. Però els que entenen la seva feina com a resoldre problemes —i, de passada, han de crear o manejar alguns rectangles per resoldre'ls— tenen molt menys a témer.»

- Brad Frost

En el futur agèntic, els dissenyadors:

  • Definiran tokens semàntics i les relacions entre ells
  • Establiran restriccions de composició i patrons
  • Crearan regles de validació que els agents hauran de complir
  • Curaran i faran evolucionar les regles que governen l'emergència
  • Dissenyaran els mecanismes de retroalimentació que permeten l'autocorrecció
  • Donaran forma a les «funcions d'aptitud» que determinen quines sortides són acceptables

 

Man in blue shirt examines colorful flowchart.

 

 

Això és disseny a un nivell d'abstracció més alt: dissenyar les regles que produeixen dissenys, en comptes dels dissenys mateixos. Com definir les regles d'un autòmat cel·lular en lloc de dibuixar cada cel·la una per una.

 

Per als desenvolupadors

Els desenvolupadors es converteixen en arquitectes de sistemes d'agents. Tal com ho descriu Anthropic:

«L'àmbit del desenvolupament de programari ha mostrat un potencial extraordinari per a les funcionalitats dels LLM, amb capacitats que han evolucionat des de l'autocompletat de codi fins a la resolució autònoma de problemes.»

Els desenvolupadors hauran de:

  • Crear interfícies llegibles per les màquines entre agents i sistemes
  • Dissenyar bucles de retroalimentació i mecanismes de validació
  • Construir l'andamiatge dins del qual sorgeix el comportament emergent
  • Mantenir la supervisió humana com a àrbitre final
  • Definir els protocols amb què es comuniquen els agents
  • Implementar el «codi d'enllaç» que connecta diferents sistemes d'agents
Man with laptop amidst web development icons and chatbot graphic.

 

Per al desenvolupament web i les plataformes CMS

La integració de la IA en plataformes com Drupal apunta cap a un futur en què:

  • Els models de contingut esdevenen consumibles pels agents mitjançant estàndards com Schema.org
  • Els fluxos editorials compten amb l'ajuda d'agents amb redacció, moderació i optimització impulsades per IA
  • La cerca evoluciona de la coincidència de paraules clau a la comprensió semàntica gràcies als embeddings i les bases de dades vectorials
  • La personalització esdevé autònoma amb agents que aprenen les preferències dels usuaris i adapten el contingut en temps real
  • El desenvolupament s'accelera perquè els agents generen components, proves i documentació

L'aposta de l'ecosistema de Drupal per la IA —amb mòduls com Drupal AI, Drupal Canvas, Schema.org Blueprints i la integració de proveïdors d'IA— demostra que aquest futur ja s'està construint.

 

 

 

Per a les organitzacions

L'avantatge competitiu serà de les organitzacions els sistemes de disseny de les quals estiguin més «preparats per als agents». Els sistemes preparats per als agents tenen:

  • Cobertura completa dels estats i les variants dels components
  • Nomenclatura semàntica que transmet la intenció
  • Documentació i context llegibles per les màquines
  • Infraestructura de validació i proves
  • Restriccions clares que delimiten l'espai de sortides vàlides
  • API dissenyades per al consum dels agents (AX-first)
  • Arquitectures de contingut basades primer en Schema.org

 

 

 

Per al futur dels productes digitals

L'estat final s'assembla a una ecologia digital: innombrables agents que actuen segons regles locals i produeixen interfícies emergents que cap dissenyador ni desenvolupador no ha planificat, però que, d'alguna manera, acaben tenint coherència perquè les regles de fons són sòlides.

Això no és tan inversemblant com sembla. És exactament com funcionen els sistemes biològics, com creixen les ciutats, com operen els mercats. La qüestió no és si arribarem a aquest estat, sinó com navegarem la transició.

 

Conclusió: el codi està viu

John von Neumann, el polímat que va inventar els autòmats cel·lulars, tenia al darrere una pregunta fonamental: quina és la complexitat mínima necessària per a l'autoreproducció? La seva resposta, el constructor universal de von Neumann, va demostrar que l'autoreplicació no requereix cap maquinària biològica. Només necessita regles que codifiquin la seva pròpia aplicació.

Setanta anys després, descobrim que el mateix principi s'aplica als sistemes de disseny. El requisit mínim per a la generació autònoma d'interfícies no és la intel·ligència artificial general ni una creativitat de nivell humà. És un conjunt de regles complet, coherent i llegible per màquines que els agents puguin executar.

Quan els bucles de Langton es repliquen per una graella cel·lular, no diem que els bucles estiguin «dissenyant» bucles nous. La replicació és simplement el que produeixen les regles. Tanmateix, el resultat, colònies de patrons autosimilars en expansió constant, és innegablement generatiu i creatiu en un sentit funcional.

Quan els agents d'IA munten interfícies a partir de components d'un sistema de disseny, seguint tokens semàntics i restriccions de composició, fan alguna cosa semblant. La «creativitat» no rau en els agents, sinó en les regles que executen: regles que els humans van dissenyar, però que ara funcionen de manera autònoma.

El sentit més profund

Aquest és el sentit més profund de «el disseny és el codi»: no només que les especificacions de disseny esdevenen executables, sinó que els sistemes de disseny esdevenen semblants a la vida. Creixen. Repliquen els seus patrons. Evolucionen amb l'ús. Mostren comportaments que ningú no ha programat explícitament.

Som al llindar d'una nova era de la creació digital. Els agents ja són aquí. Els protocols prenen forma. Els sistemes de disseny es converteixen en substrats per a la vida artificial.

El disseny és el codi.
I el codi cobra vida.

 

Articles i projectes clau

Recursos de Drupal AI

Recursos sobre autòmats cel·lulars


He explorat idees a la intersecció entre la teoria computacional, els sistemes de disseny, la intel·ligència artificial i el desenvolupament web.

 Les opinions expressades són exploracions especulatives de tendències emergents, no prediccions de futurs segurs.

 

Veig que estem creant agents d'IA que treballen en bucle i interactuen amb altres agents d'IA en bucles addicionals.

El disseny és el codi quan el sistema funciona en bucle, com un bucle de vida, dins d'un llenç seleccionat i un conjunt de regles.

The Design is the Code