Designen är koden
Hur logiken i cellulära automater kommer att omforma agentiska designsystem – och varför webbutvecklingens framtid kanske redan är skriven i enkla regler
En djupgående förändring pågår i skärningspunkten mellan designsystem, artificiell intelligens och beräkningsteori. Den är så grundläggande att den utmanar vår förståelse av vad "design" överhuvudtaget betyder i en tid av autonoma agenter.
I decennier har vi behandlat design och kod som skilda discipliner – design som mänsklig kreativitet och estetiskt omdöme, kod som den mekaniska översättningen av dessa idéer till körbar form. Men i takt med att AI-agenter alltmer självständigt sätter ihop användargränssnitt, använder designsystem som maskinläsbar infrastruktur och genererar kod utifrån semantiska tokens närmar vi oss en punkt där allt flyter samman, och som ekar en mycket äldre idé inom beräkningsteorin.
Vilken idé? Designen är koden.
Det här är inte bara en slagkraftig fras. Det är ett erkännande av att vi kanske är på väg mot en värld där designsystem fungerar som cellulära automater – enkla regler som ger upphov till komplext, emergent beteende. En värld där gränsen mellan att "designa" något och att "programmera" det helt försvinner. Där autonoma agenter inte bara använder designsystem utan är designsystem i praktiken.
Konvergensens ögonblick
Den 11 december 2025 gick Brad Frost (skaparen av Atomic Design) samman med Dominic Nguyen (medgrundare av Chromatic) i en livesändning om "Agentic Design Systems in 2026". Budskapet var tydligt: AI-agenter sätter redan ihop gränssnitt av samma komponenter som mänskliga team använder. Designsystem måste utvecklas till maskinläsbar infrastruktur – annars riskerar de att bli relikter från en svunnen tid.
Som Storybook-teamet uttryckte det: "AI har börjat använda designsystem exakt som de är dokumenterade. Luckor i exempel, tillstånd & begränsningar leder direkt till oförutsägbara gränssnitt."
Det här blogginlägget utforskar de djupa sambanden mellan cellulära automater, emergent beteende och framtidens agentiska designsystem. Vi följer de teoretiska grunderna från von Neumanns självreplikerande maskiner till dagens svärmar av AI-agenter.
Vi undersöker hur Drupal och moderna CMS-plattformar integrerar AI genom moduler som Schema.org Blueprints och Drupal AI. Och vi funderar över vad allt detta betyder för designers, utvecklare och framtidens skapande av digitala produkter.
Cellulära automater och emergensens logik
De enkla reglernas skönhet
År 1970 introducerade matematikern John Conway Game of Life – ett "noll-spelarspel" som skulle bli ett av de mest studerade systemen inom beräkningsteorin. Reglerna är häpnadsväckande enkla:
- Varje levande cell med färre än två levande grannar dör (underbefolkning)
- Varje levande cell med två eller tre levande grannar överlever
- Varje levande cell med fler än tre levande grannar dör (överbefolkning)
- Varje död cell med exakt tre levande grannar blir levande (fortplantning)
Ur dessa fyra regler – uttryckta i en handfull binära villkor – växer ett förbluffande universum av komplexitet fram. Glidare (gliders) färdas över oändliga rutnät. Oscillatorer pulserar i evig rytm. Kanoner skjuter strömmar av mönster genom cellrymden. Och mest anmärkningsvärt av allt: Game of Life har bevisats vara Turing-komplett: allt som går att beräkna algoritmiskt kan i princip beräknas inom Conways enkla rutnät.

Figur 1: Gospers glidarkanon i Conways Game of Life. Mönstret producerar en kontinuerlig ström av glidare – ett exempel på hur enkla regler kan ge upphov till oändlig, självunderhållande komplexitet.
Det är den första lärdomen från cellulära automater: komplexitet är inget krav för komplext beteende. Enkla regler som tillämpas konsekvent över ett underlag kan ge upphov till mönster och beteenden som ingen uttryckligen har programmerat.
Måste-se-video: Introduktion till cellulära automater
En introduktion till cellulära automater, med Conways Game of Life och de självreplikerande Langtons loopar
Videon visar flera animationer, bland annat den slutliga självdestruktion som skulle bli följden om Langtons loopar fick replikera på en stor torus (där rutnätets motsatta sidor är sammanfogade).
Mer material från videon:
Langtons loopar och självreplikering
År 1984 tog Christopher Langton den principen vidare med sina självreplikerande loopar – en cellulär automat som visade genuina principer för artificiellt liv. Medan Conways Game of Life visar emergent komplexitet, visar Langtons loopar emergent reproduktion.
Varje loop består av en cirkulär kant som omsluter ett ”genom” kodat i cellernas tillstånd. Genomet flödar kontinuerligt runt loopen och ut längs en byggarm, som under 151 tidssteg bygger en dotterloop. När den är färdig lösgör sig dottern från sin förälder, och båda fortsätter att replikera.
Figur 2: Langtons loop i sin startkonfiguration. Den genetiska informationen cirkulerar genom loopen och styr uppbyggnaden av dotterloopar via den utsträckta armen.
”Om en självreproducerande maskin är möjlig inom en cellulär automat, kan livet självt vara något som maskiner kan åstadkomma.”
– Christopher Langton, ”Studying Artificial Life with Cellular Automata” (1986)
Följderna är djupgående. Langtons loopar visar att självreplikering inte kräver biologiska cellers komplexitet eller de universella konstruktionsförmågor som fanns i von Neumanns ursprungliga design. Det som krävs är bara:
- En uppsättning enkla, lokala regler
- En mekanism för att koda instruktioner
- En process där instruktionerna utförs
Reglerna är organismen. Designen är koden.
År 1999 introducerade Hiroki Sayama evoloops, varianter som inkluderar strukturell upplösbarhet och fenotypiska interaktioner, vilket möjliggör spontana mutationer och evolutionär dynamik. Dessa loopar utvecklas genom direkta fysiska kollisioner under replikeringen, vilket leder till genotypvariationer, ökad morfologisk mångfald och växande komplexitet över generationerna. Till skillnad från Langtons fasta replikering uppvisar evoloops ärftliga mutationer utan yttre ingripande.
Regel 110 och universell beräkning
Stephen Wolframs utforskning av elementära cellulära automater kulminerade i en häpnadsväckande upptäckt: Regel 110, en av endast 256 möjliga regler för den enklaste typen av endimensionell cellulär automat, kan utföra universell beräkning.
Regel 110 kan specificeras helt och hållet genom att ange utfallet för var och en av åtta möjliga kombinationer av en cell och dess två grannar. Ändå kan denna löjligt enkla regel – åtta binära beslut – simulera en universell Turingmaskin.
Figur 3: Cellautomaten Regel 110. Trots sin enkla definition uppvisar Regel 110 klass 4-beteende – komplexa mönster som varken är helt stabila eller helt kaotiska – och har bevisats vara Turing-komplett.
"Man behöver inget som liknar en hel dators CPU för att utföra universell beräkning. Man behöver bara den här lilla regeln."
- Stephen Wolfram, "A New Kind of Science"
År 2004 publicerade Matthew Cook ett bevis för att Regel 110 med ett visst upprepat bakgrundsmönster är Turing-komplett. Beviset visar att Regel 110 kan emulera cykliska taggsystem, som i sin tur kan emulera vilken Turingmaskin som helst. Bland de 88 möjliga unika elementära cellautomaterna är Regel 110 den enda för vilken Turing-fullständighet har bevisats direkt.
Principen om beräkningsmässig ekvivalens som Wolfram föreslog antyder något ännu mer radikalt: system över en minimal komplexitetströskel är i allt väsentligt likvärdiga i sin beräkningsförmåga. En mänsklig hjärna, ett vädersystem och Regel 110 är, i någon djupare mening, beräkningsmässigt ekvivalenta.
Wolframs fyra klasser av cellautomater
- Klass 1: Utvecklingen leder till ett homogent tillstånd
- Klass 2: Utvecklingen leder till separerade periodiska strukturer
- Klass 3: Utvecklingen leder till kaotiska, slumpartade mönster
- Klass 4: Utvecklingen leder till komplexa mönster med lokaliserade strukturer – förmögna till universell beräkning
Regel 110 uppvisar klass 4-beteende, som Wolfram beskriver som att det befinner sig på "kaosets rand" – en kritisk gräns där enkla regler ger maximal beräkningskraft.
0E0P-metacellen: äkta självreplikering
I oktober 2018 slutförde Adam P. Goucher konstruktionen av 0E0P-metacellen – ett mönster i Conways Game of Life som är kapabelt till äkta självreplikering. Till skillnad från tidigare metaceller, som krävde redan befintliga kopior i närheten, kan 0E0P-metacellen bygga kopior av sig själv från grunden, inklusive sitt eget instruktionsband.
Den här bedriften är en milstolpe inom artificiellt liv: ett system som kan föröka sig genom ett beräkningssubstrat med enbart lokala regler. Den 23 november 2013 byggde Dave Greene den första replikatorn i Game of Life som skapar en fullständig kopia av sig själv, inklusive instruktionsbandet – vilket visar att även Conways enkla tvåtillståndsautomat kan bära obegränsad självreproduktion.
Utforska mer: videor om cellautomater
Sök efter mer fascinerande innehåll om cellautomater:
▶️ YouTube-sökning: "cellular automata the design is the code"
Designsystem som beräkningssubstrat
Från Atomic Design till agentisk design
Brad Frosts Atomic Design-metodik, som introducerades 2013, revolutionerade hur vi tänker kring designsystem. Genom att dela upp gränssnitt i atomer (grundläggande element som knappar och inmatningsfält), molekyler (enkla kombinationer), organismer (komplexa UI-sektioner), mallar (sidlayouter) och sidor (slutliga implementationer) gav Atomic Design en hierarkisk struktur för att hantera komplexitet.
Men det som är anmärkningsvärt i efterhand är detta: Atomic Design förkroppsligade redan principerna för cellautomater utan att uttryckligen inse det.
| Princip för cellautomater | Motsvarighet i Atomic Design |
|---|---|
| Lokala regler | Varje komponentnivå har regler för hur den kan kombineras med andra |
| Emergens | Komplexa sidor växer fram ur kombinationer av enklare element |
| Reproducerbarhet | Samma atomer, kombinerade enligt samma regler, ger konsekventa resultat |
| Skalbarhet | Systemet skalar utan central styrning – varje komponent "vet" hur den själv ska bete sig |
| Självorganisering | Design tokens sprider ändringar genom hela systemet automatiskt |
"När designsystemet är tråkigt frigör det designers och utvecklare att ägna sig åt det nya, att lösa nya problem. Designsystemet bär det tråkiga på sina axlar, så att designers och utvecklare slipper det."
– Josh Clark, "The Most Exciting Design Systems Are Boring"
I februari 2023 skrev Brad Frost om "Design Systems in the Time of AI":
"AI är en naturlig konsument av designsystem ... Sanningen är att en stor del av arbetet med designsystemets komponenter faktiskt är mekaniskt och förutsägbart. Vi använder redan verktyg som PlopJS för att spotta ur oss en komponentmall som passar formen på resten av biblioteket. Jag välkomnar gärna AI:s hjälp med att generera en hel del av den vanliga standardkoden åt mig."
– Brad Frost
Designsystemens mekaniska och förutsägbara natur är just det som gör dem lämpade för drift i cellulär automat-stil. När reglerna är tydliga, lokala och tillämpas konsekvent kan agenter arbeta självständigt – precis som cellerna i Conways Game of Life inte behöver någon central styrning för att skapa glidare och oscillatorer.
Det maskinläsbara kravet
Initiativet Storybook MCP (Model Context Protocol) är ett viktigt steg i den här riktningen. Storybook MCP presenterades i slutet av 2025 och ger AI-kodagenter maskinläsbar komponentmetadata från befintliga Storybook-miljöer.
Det viktiga att förstå är att agenter varken behöver rå kod eller visuell dokumentation. De behöver:
- Komponentmanifest: Strukturerad metadata om varje komponent – dess props, varianter, token-kopplingar och användningsexempel
- Semantiska namn: Tokens rika på avsikt, som
action.primary.confirmoch som förmedlar mening till agenter, inte bara värden - Valideringsloopar: Möjligheten att köra tester, se vad som misslyckas och rätta sig själv
"Storybook MCP hjälper agenter att följa dina mönster och klara dina tester. Det ger dem två saker de aldrig har haft förut: maskinläsbar komponentmetadata och en iterativ loop där de kan läka sina egna misstag."
Storybook MCP innehåller en autonom korrigeringsloop. Den låter agenter köra dina komponenttester (interaktion och tillgänglighet), se vad som misslyckas och fixa sina egna buggar. Utvecklaren behöver först gå in när testerna har gått igenom. Ingen mer barnvaktande av prompter.
Det här är precis arkitekturen hos en cellulär automat tillämpad på design: lokala regler (komponentspecifikationer), växelverkan mellan grannar (kompositionsmönster) och iterativa uppdateringar (validering och självkorrigering).
Min komponentmanifest som genom
Jämförelsen med Langtons loopar blir ännu träffande när vi ser hur komponentmanifest fungerar. I Langtons system innehåller "genomet", som är kodat i de cirkulerande cellerna, instruktionerna för att bygga en ny loop. I ett maskinläsbart designsystem innehåller komponentmanifestet instruktionerna för att sätta ihop gränssnitt.
Ett komponentmanifest kan specificera:
{
"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" }
]
}Detta manifest är samtidigt en designspecifikation och körbar kod – eller snarare de instruktioner som körbar kod kan genereras utifrån. Agenten som använder manifestet behöver inte förstå estetik eller användarupplevelse i mänsklig mening. Den behöver följa reglerna, kombinera elementen enligt deras begränsningar och producera giltiga resultat.
Jag håller med Brad Frost om att använda yaml-format.
Drupal-komponenter använder yaml-formatet. Ungefär så här
$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
Designen är koden.
- Varianter
- Tokens
- Props
Begränsningar (något vi skulle kunna lägga till i komponenter)
Regler för slots (vad som får placeras i andra slots, eller vad som får placeras i min slot)
Regler
Exempel
Animationer ( Tillåtna eller rekommenderade att använda )
Titta sedan på och experimentera med beteendet.
som i https://storybook.demo.varbase.vardot.com/?path=/story/atoms-button--primary
Designtokens som miljövariabler
Designtokens är ytterligare en avgörande pusselbit. I cellulära automater reagerar celler på sin närmaste omgivning – granncellernas tillstånd. I designsystem reagerar komponenter på designtokens – de kontextuella värden som styr utseende och beteende.
Moderna tokenarkitekturer använder flera lager:
- Kärntokens: Råa värden som
color.blue.500: #3B82F6 - Semantiska tokens: Avsiktsstyrda referenser som
color.action.primary: color.blue.500 - Komponenttokens: Avgränsade tillämpningar som
button.background.primary: color.action.primary
När en agent genererar en Button-komponent behöver den inte veta att "primary" betyder blått. Den behöver bara referera till button.background.primary och lita på att tokensystemet löser det till rätt värde. Miljön (tokenlagret) innehåller informationen; komponenten (cellen) behöver bara reagera på den.
Verktyg som Tokens Studio har utvecklats till att behandla designtokens som beräkningsgrafer med resolvers – noder som fattar semantiska beslut om vilka bastokens som ska användas utifrån sammanhanget. Därmed blir designtokens inte längre statiska värden utan dynamiska, regelbaserade system.
Drupal-ekosystemet och AI-integration
Att integrera AI i innehållshanteringssystem är ett perfekt laboratorium för att utforska principen "designen är koden". CMS som Drupal rymmer redan kärnbegreppen: strukturerade innehållstyper, fältdefinitioner, relationer och regler för sammansättning.
Jag trodde aldrig att vi skulle kunna säga något sådant. För mig var detta toppen av vad som var möjligt.
Den ultimata datorn skulle vi kunna ha. Några utvecklare som kunde komma från framtidens Star Trek och tala med datorn för att få den att programmera åt dem.
Agent Experience (AX) och den nya användaren
Att designa för maskiner
I början av 2025 introducerade Mathias Biilmann, vd för Netlify, begreppet "Agent Experience" (AX) en ny disciplin som handlar om hur AI-agenter interagerar med produkter och plattformar.
Skiftet är grundläggande. I decennier optimerade UX (användarupplevelse) för mänsklig perception, kognition och beteende. DX (utvecklarupplevelse) optimerade för mänskliga utvecklare som bygger programvara. AX tar fasta på att agenter blir de primära användarna av digitala system – och de har helt andra behov:
- De bryr sig inte om visuell estetik– bara om strukturerad data som går att tolka
- De navigerar inte i gränssnitt– de anropar API:er och använder manifest
- De läser inte dokumentation som människor– de behöver maskinläsbar kontext
- De gör inga subjektiva bedömningar– de följer regler och begränsningar
”AI-agenter är inte människor: de bryr sig inte om hur stor en knapp är, hur läsbar typografin är, den vackra färgpaletten på din webbplats eller de flashiga animationerna i din app. Så vad ”bryr sig” AI-agenter om? Det är en fråga som saknar ett konkret svar i dag, men som kommer att bli allt viktigare under de kommande åren.”
– AX Research
Svaret: tydliga regler, förutsägbart beteende, välstrukturerad data och återkopplingsloopar som gör att de kan verifiera och rätta sina egna handlingar.
Utmaningen med dubbla gränssnitt
Att designa för AX innebär att bygga två gränssnitt samtidigt:
- Gränssnitt mellan människa och agent: Här övervakar, godkänner, redigerar och styr människor agentens beteende – ”kontrollrummet”. Tänk instrumentpaneler och godkännandeköer, inte formulär och knappar.
- Gränssnitt mellan agent och system: Här arbetar agenter mot API:er, databaser och verktyg – den ”operativa” nivån. Det måste vara robust, väldokumenterat och optimerat för maskinell effektivitet.
Detta speglar arkitekturen hos cellulära automater, där två skilda perspektiv samexisterar:
- Det lokala perspektivet: Varje cell (agent) följer enkla regler utifrån sina närmaste grannar
- Det globala perspektivet: Komplexa mönster uppstår som bara syns i stor skala
”Design av agentupplevelse (AX) bör leda till god användbarhet för och hos agenter. God AX leder alltså till god användarupplevelse (UX). Om AI-agenten stöter på en trasig process, ett trasigt protokoll eller bara inkonsekvent ordval mellan olika system kan den inte utföra uppgiften. Det är en dålig upplevelse för agenten, vilket i sin tur leder till en dålig upplevelse för kunden eller den anställde.”
– Kat Holmes, Chief Experience Officer, Salesforce
Från UX till AX: den digitala designens utveckling
| UX (mänskliga användare) | DX (utvecklare) | AX (AI-agenter) |
|---|---|---|
| Visuella gränssnitt | API:er och SDK:er | Maskinläsbara manifest |
| Känslomässigt engagemang | Dokumentation | Strukturerad kontext |
| Navigationsflöden | Kodexempel | Verktygsdefinitioner |
| Tillgänglighet | Typsäkerhet | Specifikationer för begränsningar |
| Felmeddelanden | Stack traces | Återkopplingsloopar för självkorrigering |
Stigmergi och indirekt kommunikation
Ett av de mest kraftfulla begreppen inom svärmintelligens är stigmergi – indirekt samordning genom spår i omgivningen. Myror kommunicerar inte direkt om var maten finns; de lämnar feromonspår som andra myror följer. Miljön blir ett kommunikationsmedium.
I agentbaserade designsystem tar stigmergin sig följande uttryck:
- Delade komponentbibliotek: Agenter ”ser” vilka komponenter som finns och hur de har använts
- Designtokens: Semantiska värden som kodar designbeslut som fakta i miljön
- Mönsterdokumentation: Användningsexempel som fungerar som feromonspår för framtida agenter
- Testsviter: Valideringsregler som avgränsar rummet av giltiga resultat
- Git-historik: En logg över tidigare beslut som agenter kan hänvisa till
När en agent genererar ett gränssnitt med hjälp av en komponent lämnar den spår – i kodbasen, i dokumentationen, i de mönster den etablerar. Framtida agenter som möter liknande uppgifter påverkas av dessa spår, vilket skapar en form av kollektiv intelligens som ingen enskild agent besitter.
Agentiska designmönster
Andrew Ng och andra har identifierat fyra centrala mönster för agentiska AI-system:
- Reflektion: AI:n utvärderar sitt eget resultat och förbättrar det iterativt
- Verktygsanvändning: AI:n samverkar med externa verktyg, API:er och system
- Planering:AI delar upp komplexa uppgifter i deluppgifter och utför dem i tur och ordning
- Multiagent: Flera specialiserade agenter samarbetar kring komplexa uppgifter
Dessa mönster motsvarar direkt begrepp inom cellulära automater:
| Agentiskt mönster | Motsvarighet inom cellulära automater |
|---|---|
| Reflektion | Cellerna uppdateras utifrån en bedömning av det aktuella tillståndet |
| Verktygsanvändning | Cellerna samspelar med omgivningsvariabler |
| Planering | Utveckling över flera generationer mot stabila konfigurationer |
| Multiagent | Olika celltyper med specialiserade regler (multicellulära automater) |
Designen är koden – en djupare läsning
Vad ”designen är koden” egentligen betyder
När vi säger att ”designen är koden” hävdar vi flera saker på en gång:
1. Semantisk ekvivalens
Designbeslut blir körbara när de kodas på rätt sätt. En designtoken är inte bara ett värde – den är en instruktion. En komponentspecifikation är inte bara dokumentation – den är ett program. När agenter använder de här artefakterna kör de designen lika mycket som de implementerar den.
2. Generativ förmåga
Precis som Rule 110 kan beräkna allt som går att beräkna kan ett tillräckligt komplett designsystem generera vilket giltigt gränssnitt som helst. Systemet rymmer potentialen för alla dess giltiga uttryck. Vad som uppstår beror bara på utgångsläget (kraven) och reglerna (begränsningarna).
3. Emergent komplexitet
De mest sofistikerade gränssnitten designas inte uppifrån och ned. De växer fram ur en konsekvent tillämpning av enkla regler. En väldesignad knapp som används konsekvent skapar ett sammanhängande visuellt språk utan att någon uttryckligen planerat den sammanhållningen.
4. Beräkningsmässig irreducibilitet
Vissa designresultat går inte att förutse utan att faktiskt köra systemet. Du kan inte veta hur ett gränssnitt som en agent har satt ihop kommer att se ut utan att låta agenten sätta ihop det. Det är Wolframs princip om beräkningsmässig irreducibilitet, tillämpad på design.
5. Självmodifiering
Som evoloops som muterar under replikeringen kan agentredo designsystem utvecklas genom användning. Komponenter som agenter genererar blir en del av det bibliotek som framtida agenter använder. Systemet lär sig, anpassar sig och växer.
Metaforen om cellulära automater, utvidgad
| Cellulära automater | Agentiska designsystem |
|---|---|
| Rutnät av celler | Arbetsyta med UI-element |
| Celltillstånd | Komponentinstanser och deras props |
| Grannskap | Layoutkontext och angränsande komponenter |
| Uppdateringsregler | Kompositionsbegränsningar och designtokens |
| Generationer | Renderingscykler och tillståndsuppdateringar |
| Emergenta mönster | Kompletta gränssnitt och användarflöden |
| Självreplikering | Komponentbibliotek som möjliggör nya komponenter |
| Universell beräkning | Designsystem som kan uttrycka vilket giltigt UI som helst |
| Glidare (rörliga mönster) | Återanvändbara mönster som sprids över produkter |
| Stilleben (stabila mönster) | Etablerade komponenter som inte förändras |
| Oscillatorer | Animerade komponenter, laddningstillstånd, övergångar |
Bortom metaforen: en verklig konvergens
Men det här är inte bara en metafor. Konvergensen är verklig och pågår just nu:
- Storybook MCP förvandlar komponentbibliotek till maskinläsbara instruktioner som agenter kör
- Model Context Protocol standardiserar hur agenter får tillgång till verktyg och kontext – ett universellt underlag för agentiska operationer
- Multiagentarkitekturer fördelar arbetet mellan specialiserade agenter (arkitekt, kodare, granskare) som samverkar enligt protokoll – som celler med differentierade funktioner
- Självläkande looparoch låter agenter köra tester, upptäcka fel och iterera – samma återkopplingsmekanismer som cellulära automater använder för att utveckla stabila konfigurationer
- Schema.org Blueprints gör innehållsstrukturer maskinläsbara och semantiskt meningsfulla
- Drupal AI ger infrastrukturen som AI-agenter behöver för att skapa, ändra och hantera innehåll på egen hand
Vi ser inte "designen är koden" som en filosofisk ståndpunkt. Vi bygger det som teknisk infrastruktur.
Konsekvenser och vägen framåt
För designers
Designerns roll förvandlas från "rektangelskapare" till "regeldefinierare". Som Brad Frost uttryckte det:
"Designers och utvecklare som ser sitt jobb som att skapa rektanglar har mycket att oroa sig för. Men designers och utvecklare som ser sitt jobb som att lösa problem – och som ett led i det också måste skapa eller hantera några rektanglar för att lösa dem – har mindre att frukta."
– Brad Frost
I den agentiska framtiden kommer designers att:
- Definiera semantiska tokens och sambanden mellan dem
- Fastställa kompositionsbegränsningar och mönster
- Skapa valideringsregler som agenter måste uppfylla
- Kurera och utveckla de regler som styr emergens
- Utforma de återkopplingsmekanismer som möjliggör självkorrigering
- Forma de "fitnessfunktioner" som avgör vilka resultat som är acceptabla
Det här är design på en högre abstraktionsnivå – att utforma reglerna som skapar designerna, snarare än själva designerna. Som att definiera reglerna för en cellulär automat i stället för att rita varje cell för hand.
För utvecklare
Utvecklare blir arkitekter för agentsystem. Som Anthropic beskriver det:
"Mjukvaruutveckling har visat en anmärkningsvärd potential för LLM-funktioner, där förmågorna har utvecklats från kodkomplettering till självständig problemlösning."
Utvecklare kommer att behöva:
- Skapa maskinläsbara gränssnitt mellan agenter och system
- Utforma återkopplingsslingor och valideringsmekanismer
- Bygga det ramverk inom vilket emergent beteende uppstår
- Behålla mänsklig tillsyn som yttersta skiljedomare
- Definiera protokollen som agenter kommunicerar med
- Implementera "limkoden" som kopplar ihop olika agentsystem
För webbutveckling och CMS-plattformar
Integreringen av AI i plattformar som Drupal pekar mot en framtid där:
- Innehållsmodeller blir agentanpassade genom standarder som Schema.org
- Redaktionella arbetsflöden blir agentstödda med AI-driven textutkastning, moderering och optimering
- Sökning utvecklas från nyckelordsmatchning till semantisk förståelse genom embeddings och vektordatabaser
- Personalisering blir autonom när agenter lär sig användarnas preferenser och anpassar innehållet i realtid
- Utvecklingen går snabbare när agenter genererar komponenter, tester och dokumentation
Att Drupal-ekosystemet har tagit AI till sig – genom moduler som Drupal AI, Drupal Canvas, Schema.org Blueprints och integrationen av AI-leverantörer – visar att den här framtiden redan byggs.
För organisationer
Konkurrensfördelen kommer att tillfalla organisationer vars designsystem är mest "agentredo". Agentredo system kännetecknas av:
- Full täckning av komponenters tillstånd och varianter
- Semantisk namngivning som förmedlar avsikt
- Maskinläsbar dokumentation och kontext
- Infrastruktur för validering och testning
- Tydliga begränsningar som avgränsar rymden av giltiga resultat
- API:er utformade för att konsumeras av agenter (AX-first)
- Innehållsarkitekturer med Schema.org i första hand
För framtidens digitala produkter
Slutläget liknar något som närmast kan kallas en digital ekologi: otaliga agenter som verkar efter lokala regler och ger upphov till framväxande gränssnitt som ingen enskild designer eller utvecklare har planerat, men som ändå hänger ihop eftersom de underliggande reglerna är sunda.
Det är inte så långsökt som det låter. Det är precis så biologiska system fungerar, så städer växer och så marknader fungerar. Frågan är inte om vi kommer att nå dit, utan hur vi tar oss igenom övergången.
Slutsats: Koden lever
John von Neumann, polyhistorn som uppfann de cellulära automaterna, drevs av en grundläggande fråga: Vilken är den minsta komplexitet som krävs för självreproduktion? Hans svar, von Neumanns universella konstruktör, visade att självreplikering inte kräver biologisk maskineri. Det räcker med regler som kodar sin egen tillämpning.
Sjuttio år senare upptäcker vi att samma princip gäller för designsystem. Det som krävs för autonom generering av gränssnitt är varken artificiell generell intelligens eller mänsklig kreativitet. Det som krävs är en komplett, konsekvent och maskinläsbar uppsättning regler som agenter kan köra.
När Langtons loopar replikerar sig över ett cellulärt rutnät säger vi inte att looparna "designar" nya loopar. Replikeringen är helt enkelt vad reglerna ger. Ändå är resultatet, ständigt växande kolonier av självlika mönster, otvivelaktigt generativt och i någon funktionell mening kreativt.
När AI-agenter sätter ihop gränssnitt av designsystemets komponenter och följer semantiska tokens och kompositionsregler gör de något liknande. "Kreativiteten" ligger inte i agenterna utan i reglerna de kör, regler som människor har utformat men som nu verkar på egen hand.
Den djupaste innebörden
Det är här den djupaste innebörden av "designen är koden" finns: inte bara att designspecifikationer blir körbara, utan att designsystem blir livsliknande. De växer. De replikerar sina mönster. De utvecklas genom användning. De visar beteenden som ingen uttryckligen har programmerat.
Vi står på tröskeln till en ny era inom digitalt skapande. Agenterna är här. Protokollen tar form. Designsystemen håller på att bli substrat för artificiellt liv.
Designen är koden.
Och koden håller på att väckas till liv.
Viktiga artiklar och projekt
- 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
Drupal AI Resources
Resurser om cellulära automater
- Conway's Game of Life Lexicon – Cirka 1 500 figurer
- A Working Turing Machine in Game of Life
- Langton's Loops – Wikipedia
- Rule Sets for Cellular Automata
- A New Kind of Science Online – Stephen Wolfram
- Cellular Automata – Nature of Code
Utforskade idéer i skärningspunkten mellan beräkningsteori, designsystem, artificiell intelligens och webbutveckling.
De åsikter som framförs är spekulativa utforskningar av framväxande trender, inte förutsägelser om bestämda framtider.
Jag ser att vi skapar AI-agenter som arbetar i en loop och samspelar med andra AI-agenter i ytterligare loopar.
Designen är koden när systemet arbetar i en loop, som en livscykel, inom en vald canvas och en given uppsättning regler.