A dizájn maga a kód

The Design is the Code

 

Hogyan alakítja át a sejtautomaták logikája az ágensalapú dizájnrendszereket, és miért lehet, hogy a webfejlesztés jövőjét már megírták néhány egyszerű szabályban

Mélyreható változás zajlik a dizájnrendszerek, a mesterséges intelligencia és a számítástudományi elmélet találkozásánál. Olyan alapvető elmozdulás ez, hogy megkérdőjelezi, mit is jelent egyáltalán a „dizájn” az önálló ágensek korában.

 

 

 

Évtizedeken át külön szakmaként kezeltük a dizájnt és a kódot: a dizájn az emberi kreativitás és az esztétikai ítélőképesség terepe volt, a kód pedig e gondolatok gépies átültetése futtatható formába. Ám ahogy az MI-ágensek egyre gyakrabban állítanak össze önállóan felhasználói felületeket, gépi olvasásra szánt infrastruktúraként használják a dizájnrendszereket, és szemantikus tokenekből generálnak kódot, olyan találkozási ponthoz közeledünk, amely a számítástudomány egy sokkal régebbi gondolatát idézi.

 

Melyik gondolatot? A dizájn maga a kód.

 

Ez nem csupán egy fülbemászó szlogen. Annak felismerése, hogy olyan világ felé tartunk, ahol a dizájnrendszerek úgy működnek, mint a sejtautomaták: egyszerű szabályokból bonyolult, emergens viselkedés bontakozik ki. Ahol egyáltalán nem válik el egymástól valaminek a „megtervezése” és a „programozása”. Ahol az önálló ágensek nem egyszerűen használják a dizájnrendszereket, hanem maguk is működő dizájnrendszerek.

A konvergencia pillanata

2025. december 11-én Brad Frost (az Atomic Design megalkotója) és Dominic Nguyen (a Chromatic társalapítója) élő beszélgetésben vett részt ezzel a címmel: „Agentic Design Systems in 2026”. Üzenetük egyértelmű volt: az MI-ágensek már most is ugyanazokból a komponensekből állítanak össze felületeket, amelyeket az emberi csapatok használnak. A dizájnrendszereknek géppel olvasható infrastruktúrává kell fejlődniük, különben egy letűnt kor emlékévé válnak.

 

 

Ahogy a Storybook csapata bejelentette: „Az MI kezdi pontosan úgy használni a dizájnrendszereket, ahogy dokumentálták őket. A példák, állapotok & megkötések hiányosságai egyenesen kiszámíthatatlan felületi kimenethez vezetnek.”

Ez a blogbejegyzés a sejtautomaták, az emergens viselkedés és az ágensalapú dizájnrendszerek jövője közötti mély összefüggéseket vizsgálja. Végigkövetjük az elméleti alapokat von Neumann önreprodukáló gépeitől a mai MI-ágensrajokig.

 

Megnézzük, hogyan integrálja az MI-t a Drupal és a modern CMS-platformok világa olyan modulokon keresztül, mint a Schema.org Blueprints és a Drupal AI. Végül azt is végiggondoljuk, mit jelent mindez a dizájnerek, a fejlesztők és a digitális termékek létrehozásának jövője szempontjából.


Sejtautomaták és az emergencia logikája

Az egyszerű szabályok szépsége

1970-ben John Conway matematikus bemutatta az Életjátékot – egy „nulla játékosos játékot”, amely a számítástudomány egyik legtöbbet vizsgált rendszerévé vált. A szabályok lélegzetelállítóan egyszerűek:

  1. Minden élő sejt, amelynek kevesebb mint két élő szomszédja van, elpusztul (alulnépesedés)
  2. Minden élő sejt, amelynek két vagy három élő szomszédja van, túlél
  3. Minden élő sejt, amelynek háromnál több élő szomszédja van, elpusztul (túlnépesedés)
  4. Minden halott sejt, amelynek pontosan három élő szomszédja van, életre kel (szaporodás)

Ebből a négy szabályból – néhány bináris feltétellel leírva – elképesztően összetett univerzum bontakozik ki. A siklók végtelen rácsokon haladnak át. Az oszcillátorok örök ritmusban lüktetnek. Az ágyúk mintázatok áradatát lövik át a sejtek terén. És ami a legfigyelemreméltóbb: bebizonyosodott, hogy az Életjáték Turing-teljes: bármi, ami algoritmikusan kiszámítható, elvileg kiszámítható Conway egyszerű rácsán belül is.

 

 

1. ábra: Gosper siklóágyúja Conway Életjátékában. Ez a minta folyamatosan siklókat bocsát ki – megmutatva, hogyan hozhatnak létre egyszerű szabályok végtelen, önfenntartó összetettséget.

 

 

Ez a sejtautomaták első tanulsága: az összetett viselkedéshez nincs szükség összetettségre. Az egyszerű szabályok, ha egy közegben következetesen alkalmazzuk őket, olyan mintázatokat és viselkedésformákat hozhatnak létre, amelyeket senki sem programozott be kifejezetten.

Alapvető videó: Bevezetés a sejtautomatákba

Bevezetés a sejtautomatákba, benne Conway Életjátékával és az önsokszorozó Langton-hurkokkal

A videó több animációt is bemutat, köztük azt az önpusztítást, amely akkor következne be, ha a Langton-hurkok egy nagy tóruszon (ahol a rács átellenes oldalai össze vannak kapcsolva) szaporodhatnának tovább.

 

 

 

 

További források a videóhoz:


A Langton-hurkok és az önreplikáció

1984-ben Christopher Langton továbbvitte ezt az elvet az önsokszorozó hurkaival – egy olyan sejtautomatával, amely a valódi mesterséges élet alapelveit mutatta meg. Conway Életjátéka az emergens összetettséget mutatja be, a Langton-hurkok viszont az emergens szaporodást.

Minden hurok egy zárt, körkörös határból áll, amely a sejtállapotokban kódolt „genomot” fogja körbe. Ez a genom folyamatosan kering a hurokban, majd kiáramlik egy építőkarba, amely 151 időlépés alatt felépít egy leányhurkot. Amikor elkészül, a leány elválik az anyától, és mindkettő tovább sokszorozódik.

 

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

2. ábra: Langton hurka a kiindulási konfigurációban. A genetikai információ végigkering a hurkon, és a kinyúló kar segítségével irányítja a leányhurkok felépítését.

 

„Ha egy önsokszorozó gép lehetséges egy sejtautomatában, akkor maga az élet is megvalósítható gépekkel.”

– Christopher Langton: „Studying Artificial Life with Cellular Automata” (1986)

A következmények mélyrehatóak. A Langton-hurkok azt mutatják, hogy az önreplikációhoz nincs szükség sem a biológiai sejtek bonyolultságára, sem von Neumann eredeti tervének univerzális építőképességére. Mindössze ennyi kell hozzá:

  • Egyszerű, helyi szabályok halmaza
  • Az utasítások kódolásának módja
  • Egy folyamat, amely végrehajtja ezeket az utasításokat

A szabályok maguk az élőlény. A terv maga a kód.

1999-ben Hiroki Sayama bevezette az evoloopokat, amelyek a szerkezeti feloldhatóságot és a fenotípusos kölcsönhatásokat is magukba foglalják, így lehetővé teszik a spontán mutációkat és az evolúciós dinamikát. Ezek a hurkok a sokszorozódás közbeni közvetlen fizikai ütközések során fejlődnek, ami genotípus-változatokhoz, nagyobb morfológiai sokféleséghez és a nemzedékek során növekvő összetettséghez vezet. Langton rögzített replikációjával szemben az evoloopok külső beavatkozás nélkül is öröklődő mutációkat mutatnak.

 

 

A 110-es szabály és az univerzális számítás

Stephen Wolfram az elemi sejtautomaták vizsgálata során döbbenetes felfedezésre jutott: a 110-es szabály, amely az egydimenziós sejtautomaták legegyszerűbb típusának mindössze 256 lehetséges szabálya közül az egyik, képes az univerzális számításra.

A 110-es szabály teljes egészében megadható úgy, hogy meghatározzuk a kimenetet egy cella és két szomszédja nyolc lehetséges kombinációjának mindegyikére. Ez a látszólag triviális szabály – nyolc bináris döntés – mégis képes szimulálni egy univerzális Turing-gépet.

 

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

3. ábra: A 110-es szabályú celluláris automata. Egyszerű meghatározása ellenére a 110-es szabály 4. osztályú viselkedést mutat – összetett mintázatokat, amelyek sem teljesen stabilak, sem teljesen kaotikusak –, és bebizonyították róla, hogy Turing-teljes.

 

„Egy univerzális számításhoz nincs szükség egy egész számítógép-processzorhoz hasonló valamire. Elég hozzá ez a kis szabály.”

– Stephen Wolfram: „A New Kind of Science”

2004-ben Matthew Cook bizonyítást publikált arra, hogy a 110-es szabály egy bizonyos ismétlődő háttérmintázattal Turing-teljes. A bizonyítás azt mutatja meg, hogy a 110-es szabály képes ciklikus címkerendszereket emulálni, azok pedig bármilyen Turing-gépet. A 88 lehetséges, egymástól különböző elemi celluláris automata közül a 110-es szabály az egyetlen, amelynek a Turing-teljességét közvetlenül bebizonyították.

A számítási ekvivalencia elve, amelyet Wolfram felvetett, még radikálisabb dologra utal: a komplexitás egy minimális küszöbe fölött a rendszerek számítási képességei lényegében egyenértékűek. Az emberi agy, egy időjárási rendszer és a 110-es szabály – valamilyen mély értelemben – számítási szempontból egyenértékű.

Wolfram celluláris automatáinak négy osztálya

  • 1. osztály: A fejlődés homogén állapotba vezet
  • 2. osztály: A fejlődés különálló, periodikus struktúrákhoz vezet
  • 3. osztály: A fejlődés kaotikus, véletlenszerű mintázatokhoz vezet
  • 4. osztály: A fejlődés összetett mintázatokhoz vezet, lokalizált struktúrákkal – univerzális számításra képesek

A 110-es szabály 4. osztályú viselkedést mutat, amelyet Wolfram a „káosz peremén” való létezésként ír le – olyan kritikus határvonalon, ahol az egyszerű szabályok a legnagyobb számítási teljesítményt hozzák létre.

A 0E0P metasejt: valódi önreplikáció

2018 októberében Adam P. Goucher befejezte a 0E0P metasejt megalkotását – ez egy olyan minta Conway Életjátékában, amely képes a valódi önreplikációra. A korábbi metasejtekkel ellentétben, amelyeknek szükségük volt a közelükben már meglévő másolatokra, a 0E0P metasejt a semmiből is képes felépíteni önmaga másolatait, a saját utasításszalagját is beleértve.

Ez az eredmény mérföldkő a mesterséges élet történetében: olyan rendszer, amely kizárólag lokális szabályok segítségével képes terjedni egy számítási szubsztrátumban. 2013. november 23-án Dave Greene megépítette az Életjáték első olyan replikátorát, amely önmaga teljes másolatát létrehozza, az utasításszalaggal együtt – ezzel bebizonyítva, hogy még Conway egyszerű, kétállapotú automatája is képes korlátlan önreprodukcióra.

 

Fedezz fel többet: celluláris automata videók

 

Keress további lenyűgöző celluláris automata tartalmakat:

▶️ YouTube-keresés: "cellular automata the design is the code"


Designrendszerek mint számítási szubsztrátumok

Az atomi dizájntól az ágensalapú dizájnig

Brad Frost 2013-ban bemutatott Atomic Design módszertana forradalmasította a designrendszerekről való gondolkodásunkat. Azzal, hogy a felületeket atomokra (alapelemek, például gombok és beviteli mezők), molekulákra (egyszerű kombinációk), organizmusokra (összetett felületi szekciók), sablonokra (oldalelrendezések) és oldalakra (a végleges megvalósítások) bontotta, az Atomic Design hierarchikus szerkezetet adott a komplexitás kezeléséhez.

De utólag nézve az a figyelemre méltó, hogy az Atomic Design már magában hordozta a celluláris automaták alapelveit, anélkül hogy ezt kifejezetten felismerte volna.

Celluláris automata elveAtomic Design megfelelője
Lokális szabályokMinden komponensszintnek megvannak a maga szabályai arról, hogyan kapcsolódhat másokhoz
EmergenciaAz összetett oldalak egyszerűbb elemek kombinációiból bomlanak ki
ReprodukálhatóságUgyanazok az atomok, ugyanazon szabályok szerint összeállítva, következetes eredményt adnak
SkálázhatóságA rendszer központi irányítás nélkül is skálázódik – minden komponens „tudja”, hogyan kell viselkednie
ÖnszerveződésA design tokenek a változásokat automatikusan végigviszik az egész rendszeren

„Ha a design system unalmas, felszabadítja a tervezőket és a fejlesztőket, hogy az újjal foglalkozzanak, új problémákat oldjanak meg. A design system viszi a unalmas dolgok terhét, hogy a tervezőknek és fejlesztőknek ne kelljen.”

– Josh Clark, „The Most Exciting Design Systems Are Boring”

2023 februárjában Brad Frost írt a „Design Systems in the Time of AI” címmel:

„Az AI természetes design system-felhasználó… A helyzet az, hogy a design system komponensmunkájának nagy része valóban mechanikus és kiszámítható. Már most is használunk olyan eszközöket, mint a PlopJS, hogy kiköpjünk egy komponensvázat, ami illeszkedik a könyvtár többi részének formájához. Szívesen venném az AI segítségét abban, hogy helyettem legyártsa a rengeteg szokványos alapkódot.”

– Brad Frost

A design systemek mechanikus és kiszámítható természete teszi őket pontosan alkalmassá a sejtautomata-szerű működésre. Ha a szabályok világosak, helyiek és következetesen alkalmazottak, az ágensek önállóan tudnak dolgozni – ahogy Conway Életjátékában sem kell központi vezérlő ahhoz, hogy siklók és oszcillátorok jöjjenek létre.

A gépileg olvasható forma követelménye

A Storybook MCP (Model Context Protocol) kezdeményezés kulcsfontosságú lépés ebbe az irányba. A 2025 végén bejelentett Storybook MCP gépileg olvasható komponens-metaadatokat ad az AI-kódolóágenseknek a meglévő Storybook-környezetekből.

A lényegi felismerés az, hogy az ágenseknek nincs szükségük nyers kódra vagy vizuális dokumentációra. Ezekre van szükségük:

  • Komponensmanifesztek: Strukturált metaadatok minden komponensről – a propokról, variánsokról, design token-kötésekről és használati példákról
  • Szemantikus elnevezés: Szándékot hordozó tokenek, például action.primary.confirm, amelyek jelentést közvetítenek az ágenseknek, nem csupán értékeket
  • Validációs ciklusok: Képesség tesztek futtatására, a hibák megtekintésére és az önkorrekcióra

„A Storybook MCP segít az ágenseknek követni a mintáidat és átmenni a teszteken. Két olyat ad nekik, amijük eddig soha nem volt: gépileg olvasható komponens-metaadatokat és egy iteratív ciklust, amellyel maguk javíthatják ki a hibáikat.”

- A Storybook csapata

A Storybook MCP egy önálló korrekciós ciklust is tartalmaz. Lehetővé teszi, hogy az ágensek lefuttassák a komponenstesztjeidet (interakciós és akadálymentességi teszteket), lássák, mi bukik el, és maguk javítsák ki a saját hibáikat. A fejlesztőnek csak akkor kell közbelépnie, amikor a tesztek már átmentek. Nincs több promptdajkálás.

Pontosan ez egy dizájnra alkalmazott sejtautomata felépítése: helyi szabályok (komponensspecifikációk), szomszédos kölcsönhatások (kompozíciós minták) és iteratív frissítések (validáció és önkorrekció).

 

A komponensmanifesztem mint genom

A Langton-hurkokkal való párhuzam még találóbbá válik, ha megnézzük, hogyan működnek a komponensmanifesztek. Langton rendszerében a keringő sejtekbe kódolt „genom” tartalmazza az új hurok felépítéséhez szükséges utasításokat. Egy gépileg olvasható design systemben a komponensmanifeszt tartalmazza a felületek összeállításához szükséges utasításokat.

Egy komponensmanifeszt a következőket adhatja meg:

{
  "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" }
  ]
}

Ez a manifest egyszerre tervezési specifikáció és végrehajtható kód – pontosabban azok az utasítások, amelyekből végrehajtható kód generálható. Az ügynöknek, amely ezt a manifestet feldolgozza, nem kell emberi értelemben vett esztétikát vagy felhasználói élményt értenie. Elég betartania a szabályokat, a megszorításoknak megfelelően összeraknia az elemeket, és érvényes kimenetet előállítania.

 

Egyetértek Brad Frosttal abban, hogy jó a yaml formátum.

 

A Drupal komponensek yaml formátumot használnak. Valami ilyesmit:

$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

 

A dizájn maga a kód.

  • Variánsok
  • Tokenek
  • Propok
  • Megszorítások (ezeket hozzáadhatnánk a komponensekhez)

  • Slotszabályok (mi helyezhető más slotokba, illetve mit lehet az én slotomba tenni)

  • Szabályok

  • Példák 

  • Animációk  ( Használhatók vagy javasoltak )

Aztán figyeljük meg és próbáljuk ki a működést.

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

 

A dizájntokenek mint környezeti változók

A dizájntokenek a kirakós egy másik kulcsfontosságú darabját jelentik. A sejtautomatákban a sejtek a közvetlen környezetükre – a szomszédos sejtek állapotára – reagálnak. A designrendszerekben a komponensek a dizájntokenekre reagálnak, vagyis azokra a kontextuális értékekre, amelyek meghatározzák a megjelenésüket és a viselkedésüket.

A modern tokenarchitektúrák több rétegből állnak:

  • Alaptokenek: Nyers értékek, például color.blue.500: #3B82F6
  • Szemantikus tokenek: Szándékvezérelt hivatkozások, például color.action.primary: color.blue.500
  • Komponenstokenek: Hatókörhöz kötött alkalmazások, például button.background.primary: color.action.primary

Amikor egy ügynök Button komponenst generál, nem kell tudnia, hogy a „primary” kéket jelent. Elég hivatkoznia erre: button.background.primary, és megbíznia abban, hogy a tokenrendszer a helyes értékre oldja fel. A környezet (a tokenréteg) hordozza az információt; a komponensnek (a sejtnek) csak reagálnia kell rá.

Az olyan eszközök, mint a Tokens Studio odáig fejlődtek, hogy a dizájntokeneket feloldókkal ellátott számítási gráfokként kezelik – olyan csomópontokkal, amelyek szemantikai döntést hoznak arról, hogy a kontextus alapján mely alaptokeneket használják. Ez a dizájntokeneket statikus értékekből dinamikus, szabályalapú rendszerekké alakítja.


A Drupal ökoszisztéma és az AI-integráció

Az AI tartalomkezelő rendszerekbe való integrálása tökéletes laboratórium a „a dizájn a kód” elv felfedezéséhez. Az olyan CMS-ek, mint a Drupal, már most is magukban hordozzák az alapfogalmakat: a strukturált tartalomtípusokat, a meződefiníciókat, a kapcsolatokat és az összeállítás szabályait.

Sosem gondoltam volna, hogy valaha ilyet mondhatunk. Számomra ez a csúcstechnika volt.

 A legcsodálatosabb számítógép, amilyen csak lehet. Olyan fejlesztők, akik akár a jövő Star Trekjéből is jöhetnének, és a számítógéppel beszélve programoztatnak.

 

 

Agent Experience (AX) és az új felhasználó

Tervezés gépeknek

2025 elején Mathias Biilmann, a Netlify vezérigazgatója bevezette az „Agent Experience” (AX) fogalmát, amely egy új szakterület arra összpontosítva, hogyan lépnek kapcsolatba az AI-ügynökök a termékekkel és platformokkal.

Az elmozdulás alapvető. Évtizedeken át az UX (felhasználói élmény) az emberi gondolkodásra, érzékelésre és viselkedésre optimalizált. A DX (fejlesztői élmény) a szoftvert építő emberi fejlesztőkre. Az AX azt ismeri fel, hogy az ügynökök a digitális rendszerek elsődleges felhasználóivá válnak – és teljesen más igényeik vannak:

  • Nem törődnek a vizuális esztétikával – csak a strukturált, értelmezhető adatokkal
  • Nem navigálnak a felületeken – API-kat hívnak, és manifesteket dolgoznak fel
  • Nem úgy olvasnak dokumentációt, mint az emberek – gépileg olvasható kontextusra van szükségük
  • Nem hoznak szubjektív ítéleteket – szabályokat és megszorításokat követnek

"Az MI-ügynökök nem emberek: nem érdekli őket egy gomb mérete, a tipográfia olvashatósága, a weboldalad szép színpalettája vagy az alkalmazásod hivalkodó animációi. Akkor mi az, ami az MI-ügynököket „érdekli”? Erre a kérdésre ma még nincs konkrét válasz, de a következő években egyre fontosabb lesz."

- AX-kutatás

A válasz: világos szabályok, kiszámítható viselkedés, jól strukturált adatok, valamint olyan visszacsatolási hurkok, amelyek lehetővé teszik, hogy az ügynökök ellenőrizzék és kijavítsák a saját lépéseiket.

A kettős felület kihívása

Az AX tervezése azt jelenti, hogy egyszerre két felületet építünk:

  1. Ember–ügynök felület: Itt felügyelik, hagyják jóvá, szerkesztik és irányítják az emberek az ügynökök működését – ez a „irányítóközpont” réteg. Gondolj műszerfalakra és jóváhagyási sorokra, ne űrlapokra és gombokra.
  2. Ügynök–rendszer felület: Itt lépnek kapcsolatba az ügynökök az API-kkal, adatbázisokkal és eszközökkel – ez a „működési” réteg. Legyen robusztus, jól dokumentált, és gépi hatékonyságra optimalizált.

Ez a sejtautomaták felépítését tükrözi, ahol két különböző nézőpont él egymás mellett:

  • A helyi nézőpont: Minden sejt (ügynök) egyszerű szabályokat követ a közvetlen szomszédai alapján
  • A globális nézőpont: Összetett minták bukkannak elő, amelyek csak nagy léptékben láthatók

"Az ügynökélmény-tervezésnek (AX) az ügynökök számára és általuk is kiváló használhatóságot kell eredményeznie. Így a kiváló AX kiváló felhasználói élményhez (UX) vezet. Ha az MI-ügynök hibás folyamattal, protokollal vagy akár a rendszerek között következetlen megfogalmazással találkozik, nem tudja elvégezni a feladatot. Ez rossz élmény az ügynöknek, ami viszont rossz ügyfél- vagy munkavállalói élményhez vezet."

- Kat Holmes, Chief Experience Officer, Salesforce

Az UX-től az AX-ig: a digitális tervezés fejlődése

UX (emberi felhasználók)DX (fejlesztők)AX (MI-ügynökök)
Vizuális felületekAPI-k és SDK-kGéppel olvasható manifesztek
Érzelmi elköteleződésDokumentációStrukturált kontextus
Navigációs folyamatokKódpéldákEszközdefiníciók
AkadálymentességTípusbiztonságMegszorítások leírása
HibaüzenetekVeremkövetések (stack trace)Visszacsatolási hurkok az önkorrekcióhoz


Sztigmergia és közvetett kommunikáció

A rajintelligencia egyik legerősebb fogalma a sztigmergia – a környezetben hagyott nyomokon keresztül megvalósuló közvetett összehangolás. A hangyák nem közvetlenül kommunikálnak az élelem helyéről; feromonnyomokat hagynak, amelyeket a többi hangya követ. A környezet maga válik kommunikációs közeggé.

Az ügynökalapú tervezési rendszerekben a sztigmergia a következő formákat ölti:

  • Megosztott komponenskönyvtárak: Az ügynökök „látják”, mely komponensek léteznek, és hogyan használták őket
  • Dizájntokenek: Szemantikus értékek, amelyek a tervezési döntéseket környezeti tényekként kódolják
  • Mintadokumentáció: Használati példák, amelyek feromonnyomként szolgálnak a későbbi ügynököknek
  • Tesztcsomagok: Érvényesítési szabályok, amelyek behatárolják az érvényes kimenetek terét
  • Git-előzmények: A korábbi döntések feljegyzése, amelyekre az ügynökök hivatkozhatnak

Amikor egy ügynök egy komponens felhasználásával felületet hoz létre, nyomokat hagy maga után – a kódbázisban, a dokumentációban, az általa kialakított mintákban. A hasonló feladatokkal később találkozó ügynökökre ezek a nyomok hatással lesznek, így létrejön a kollektív intelligencia egy olyan formája, amellyel egyetlen ügynök sem rendelkezik önmagában.

Ügynökalapú tervezési minták

Andrew Ng és mások négy kulcsfontosságú mintát azonosítottak az ügynökalapú MI-rendszerekhez:

  1. Reflexió: Az MI értékeli a saját kimenetét, és lépésről lépésre javítja
  2. Eszközhasználat: Az MI külső eszközökkel, API-kkal és rendszerekkel lép kapcsolatba
  3. Tervezés:A mesterséges intelligencia az összetett feladatokat részfeladatokra bontja, és egymás után hajtja végre őket
  4. Többügynökös rendszer: Több specializált ügynök működik együtt az összetett feladatokon

Ezek a minták közvetlenül megfeleltethetők a sejtautomaták fogalmainak:

Ágensalapú mintaSejtautomata-megfelelő
ReflexióA sejtek a jelenlegi állapot kiértékelése alapján frissülnek
EszközhasználatA sejtek kölcsönhatásba lépnek a környezeti változókkal
TervezésTöbbgenerációs fejlődés a stabil konfigurációk felé
Többügynökös működésKülönböző sejttípusok specializált szabályokkal (többsejtű automaták)

A dizájn maga a kód – mélyebb olvasat

Mit jelent valójában a „dizájn maga a kód”?

Amikor azt mondjuk, hogy „a dizájn maga a kód”, egyszerre több állítást is megfogalmazunk:

1. Szemantikai egyenértékűség

A dizájndöntések megfelelő kódolás után végrehajthatóvá válnak. A dizájntoken nem pusztán egy érték, hanem utasítás. A komponensspecifikáció nem csupán dokumentáció, hanem program. Amikor az ágensek ezeket az elemeket felhasználják, a dizájnt éppúgy végrehajtják, mint ahogy megvalósítják.

2. Generatív képesség

Ahogyan a Rule 110 bármit ki tud számítani, ami kiszámítható, úgy egy kellően teljes dizájnrendszer is bármilyen érvényes felületet képes előállítani. A rendszer magában hordozza az összes érvényes megnyilvánulási formáját. Hogy mi jön létre belőle, az kizárólag a kiindulási feltételeken (követelmények) és a szabályokon (megszorítások) múlik.

3. Emergens komplexitás

A legkifinomultabb felületeket nem felülről lefelé tervezik meg, hanem az egyszerű szabályok következetes alkalmazásából bontakoznak ki. Egy jól megtervezett gomb, ha következetesen használják, koherens vizuális nyelvet hoz létre anélkül, hogy bárki kifejezetten megtervezte volna ezt a koherenciát.

4. Számítási irreducibilitás

Egyes dizájnkimenetelek nem jósolhatók meg anélkül, hogy ténylegesen lefuttatnánk a rendszert. Nem tudhatjuk, hogyan fog kinézni egy ágens által összeállított felület, amíg az ágens össze nem állítja. Ez Wolfram számítási irreducibilitás-elve, a dizájnra alkalmazva.

5. Önmódosítás

Akárcsak az replikáció közben mutálódó evoloopok, az ágensekre felkészített dizájnrendszerek is fejlődhetnek a használat során. Az ágensek által létrehozott komponensek a könyvtár részévé válnak, amelyet a jövőbeli ágensek felhasználnak. A rendszer tanul, alkalmazkodik és növekszik.

A sejtautomata-metafora kiterjesztve

SejtautomatákÁgensalapú dizájnrendszerek
Sejtek rácsaUI-elemek vászna
SejtállapotokKomponenspéldányok és a hozzájuk tartozó propok
SzomszédságElrendezési kontextus és a szomszédos komponensek
Frissítési szabályokKompozíciós megszorítások és dizájntokenek
GenerációkRenderelési ciklusok és állapotfrissítések
Emergens mintázatokTeljes felületek és felhasználói folyamatok
ÖnreplikációKomponenskönyvtárak, amelyek új komponensek létrehozását teszik lehetővé
Univerzális számításDizájnrendszerek, amelyek bármilyen érvényes felhasználói felületet ki tudnak fejezni
Siklók (mozgó mintázatok)Újrahasznosítható minták, amelyek termékeken át terjednek
Csendéletek (stabil mintázatok)Bevett komponensek, amelyek nem változnak
OszcillátorokAnimált komponensek, betöltési állapotok, átmenetek

A metaforán túl: valódi konvergencia

Ez azonban nem csupán metafora. A konvergencia valós, és éppen most zajlik:

  • Storybook MCP a komponenskönyvtárakat gépi úton olvasható utasításokká alakítja, amelyeket az ágensek végrehajtanak
  • Model Context Protocol egységesíti, hogyan érik el az ágensek az eszközöket és a kontextust, így univerzális alapot teremt az ágensalapú műveletekhez
  • Többügynökös architektúrák a munkát specializált ágensek (építész, fejlesztő, ellenőrző) között osztják meg, amelyek protokollok szerint működnek együtt, akár a differenciált funkciójú sejtek
  • Önjavító hurkok lehetővé teszik az ügynökök számára, hogy teszteket futtassanak, hibákat észleljenek és iteráljanak – ugyanazokat a visszacsatolási mechanizmusokat használva, amelyekkel a sejtautomaták stabil konfigurációkat fejlesztenek ki
  • Schema.org Blueprints géppel olvashatóvá és szemantikailag értelmezhetővé teszik a tartalmi struktúrákat
  • Drupal AI megadja az infrastruktúrát ahhoz, hogy az MI-ügynökök önállóan hozzanak létre, módosítsanak és kezeljenek tartalmakat

A „a dizájn maga a kód” elvét nem filozófiai álláspontként közelítjük meg. Műszaki infrastruktúraként építjük fel.


Következmények és a további út

A dizájnereknek

A dizájner szerepe „téglalaprajzolóból” „szabályalkotóvá” alakul át. Ahogy Brad Frost megfogalmazta:

„Azoknak a dizájnereknek és fejlesztőknek, akik a munkájukat téglalapok rajzolásaként fogják fel, bőven van okuk az aggodalomra. Azoknak viszont, akik a munkájukat problémamegoldásként élik meg – és a megoldáshoz mellesleg néhány téglalapot is létre kell hozniuk –, sokkal kevesebb félnivalójuk van.”

– Brad Frost

Az ágensalapú jövőben a dizájnerek:

  • szemantikus tokeneket és azok kapcsolatait határozzák meg
  • kompozíciós korlátokat és mintákat alakítanak ki
  • olyan validációs szabályokat hoznak létre, amelyeknek az ügynököknek meg kell felelniük
  • gondozzák és fejlesztik azokat a szabályokat, amelyek az emergenciát irányítják
  • megtervezik az önkorrekciót lehetővé tevő visszacsatolási mechanizmusokat
  • alakítják azokat a „fitnesz-függvényeket”, amelyek eldöntik, mely kimenetek elfogadhatók

 

Man in blue shirt examines colorful flowchart.

 

 

Ez a dizájn magasabb absztrakciós szinten: nem magukat a terveket, hanem a terveket létrehozó szabályokat tervezzük meg. Olyan ez, mintha egy sejtautomata szabályait határoznánk meg ahelyett, hogy minden egyes sejtet külön-külön megrajzolnánk.

 

A fejlesztőknek

A fejlesztőkből az ügynökrendszerek építészei lesznek. Ahogy az Anthropic írja:

„A szoftverfejlesztés területe figyelemre méltó lehetőségeket mutatott a nagy nyelvi modellek (LLM) képességei számára, a kódkiegészítéstől egészen az önálló problémamegoldásig.”

A fejlesztőknek a következőkre lesz szükségük:

  • géppel olvasható interfészeket kell létrehozniuk az ügynökök és a rendszerek között
  • visszacsatolási hurkokat és validációs mechanizmusokat kell tervezniük
  • felépíteniük a vázat, amelyen belül az emergens viselkedés létrejön
  • fenntartaniuk az emberi felügyeletet mint végső döntőbírót
  • meg kell határozniuk azokat a protokollokat, amelyek mentén az ügynökök kommunikálnak
  • meg kell valósítaniuk azt a „ragasztókódot”, amely a különböző ügynökrendszereket összekapcsolja
Man with laptop amidst web development icons and chatbot graphic.

 

A webfejlesztésnek és a CMS-platformoknak

Az MI beépülése az olyan platformokba, mint a Drupal, egy olyan jövő felé mutat, ahol:

  • A tartalommodellek az ügynökök számára fogyaszthatóvá válnak olyan szabványokon keresztül, mint a Schema.org
  • A szerkesztői munkafolyamatok ügynöki támogatást kapnak MI-alapú vázlatkészítéssel, moderálással és optimalizálással
  • A keresés fejlődik a kulcsszavas egyeztetéstől a szemantikai megértésig, beágyazások (embeddings) és vektoradatbázisok segítségével
  • A személyre szabás önállóvá válik az ügynökök megtanulják a felhasználói preferenciákat, és valós időben igazítják a tartalmat
  • A fejlesztés felgyorsul mivel az ügynökök komponenseket, teszteket és dokumentációt generálnak

A Drupal ökoszisztémája olyan modulokon keresztül karolja fel az MI-t, mint a Drupal AI, a Drupal Canvas, a Schema.org Blueprints és az MI-szolgáltatók integrációja – és ez bizonyítja, hogy ez a jövő már épül.

 

 

 

A szervezeteknek

A versenyelőny azoké a szervezeteké lesz, amelyek dizájnrendszerei a leginkább „ügynökkésznek” számítanak. Az ügynökkész rendszerek jellemzői:

  • a komponensállapotok és -variánsok teljes lefedettsége
  • a szándékot kifejező szemantikus elnevezés
  • géppel olvasható dokumentáció és kontextus
  • validációs és tesztelési infrastruktúra
  • egyértelmű korlátok, amelyek behatárolják az érvényes kimenetek terét
  • ügynöki használatra tervezett API-k (AX-first)
  • Schema.org-alapú tartalomarchitektúrák

 

 

 

A digitális termékek jövőjéért

A végállapot valami digitális ökológiához hasonlít: számtalan ágens működik helyi szabályok szerint, és olyan feléledő (emergens) felületeket hoz létre, amelyeket egyetlen tervező vagy fejlesztő sem tervezett meg, mégis valahogy egységes egésszé állnak össze, mert az alapul szolgáló szabályok megállják a helyüket.

Ez nem olyan légbőlkapott gondolat, mint amilyennek hangzik. Pontosan így működnek a biológiai rendszerek, így nőnek a városok, így működnek a piacok. A kérdés nem az, hogy eljutunk-e erre a pontra, hanem az, hogy hogyan vészeljük át az átmenetet.

 

Zárszó: él a kód

John von Neumann, a polihisztor, aki a sejtautomatákat megalkotta, egy alapvető kérdés hajtotta: Mi a minimális összetettség, amely az önszaporodáshoz szükséges? A válasza, a von Neumann-féle univerzális konstruktor megmutatta, hogy az önreplikációhoz nincs szükség biológiai gépezetre. Csak olyan szabályokra van szükség, amelyek a saját alkalmazásukat is kódolják.

Hetven évvel később ugyanezt az elvet fedezzük fel a tervezési rendszerekben. Az önálló felületgenerálás minimális feltétele nem az általános mesterséges intelligencia vagy az emberi szintű kreativitás. Hanem egy teljes, következetes, géppel olvasható szabályrendszer, amelyet az ágensek végre tudnak hajtani.

Amikor a Langton-hurkok szaporodnak a sejtrácson, nem azt mondjuk, hogy a hurkok új hurkokat „terveznek”. A szaporodás egyszerűen az, amit a szabályok létrehoznak. Az eredmény mégis, az önhasonló minták egyre táguló kolóniái, vitathatatlanul generatív, bizonyos funkcionális értelemben kreatív.

Amikor az MI-ágensek a tervezési rendszer komponenseiből állítanak össze felületeket, a szemantikus tokeneket és a kompozíciós megkötéseket követve, valami hasonlót tesznek. A „kreativitás” nem az ágensekben rejlik, hanem a szabályokban, amelyeket végrehajtanak: ezeket emberek tervezték, de most már önállóan működnek.

A legmélyebb jelentés

Ez a legmélyebb értelme annak, hogy „a terv maga a kód”: nemcsak az, hogy a tervezési specifikációk végrehajthatóvá válnak, hanem az is, hogy a tervezési rendszerek élőlényszerűvé válnak. Növekednek. Megsokszorozzák a mintáikat. A használat során fejlődnek. Olyan viselkedést mutatnak, amelyet senki nem programozott be kifejezetten.

Egy új korszak küszöbén állunk a digitális alkotásban. Az ágensek már itt vannak. A protokollok formálódnak. A tervezési rendszerek a mesterséges élet hordozóközegévé válnak.

A terv maga a kód.
És a kód életre kel.

 

Fontos cikkek és projektek

Drupal AI-források

Sejtautomata-források


A számításelmélet, a tervezési rendszerek, a mesterséges intelligencia és a webfejlesztés metszéspontjában született gondolatokat járom körül.

 A kifejtett nézetek a kibontakozó trendek spekulatív felfedezései, nem biztos jövőbeli események jóslatai.

 

Úgy látom, hogy olyan MI-ágenseket hozunk létre, amelyek körforgásban dolgoznak, és további körforgásokban lépnek kapcsolatba más MI-ágensekkel.

A terv maga a kód, amikor a rendszer körforgásban működik, mint egy életciklus-hurok egy kijelölt vásznon és szabályrendszeren belül.

The Design is the Code