Дизайн — це код

Як логіка клітинних автоматів змінить агентні дизайн-системи і чому майбутнє веброзробки, можливо, вже записане простими правилами

На перетині дизайн-систем, штучного інтелекту й теорії обчислень відбувається глибока трансформація. Вона настільки докорінна, що змушує переосмислити саме поняття «дизайну» в добу автономних агентів.

Десятиліттями ми вважали дизайн і код окремими дисциплінами: дизайн — царина людської творчості та естетичного судження, код — механічний переклад цих ідей у виконувану форму. Але тепер ШІ-агенти дедалі частіше самостійно збирають інтерфейси, споживають дизайн-системи як машинозчитувану інфраструктуру й генерують код із семантичних токенів. Ми наближаємося до точки зближення, яка перегукується з набагато старішою ідеєю з теорії обчислень.

Що це за ідея? Дизайн — це код.

Це не просто красиве гасло. Це визнання того, що ми, імовірно, рухаємося до світу, де дизайн-системи працюють як клітинні автомати: прості правила породжують складну, емерджентну поведінку. До світу, де різниця між «проєктуванням» чогось і його «програмуванням» зникає повністю. Де автономні агенти не лише використовують дизайн-системи, а й самі є дизайн-системами в дії.

Ця стаття досліджує глибокі зв’язки між клітинними автоматами, емерджентною поведінкою та майбутнім агентних дизайн-систем. Ми простежимо теоретичні підвалини від самореплікувальних машин фон Неймана до сучасних роїв ШІ-агентів.

Ми розглянемо, як Drupal і сучасні CMS інтегрують ШІ через модулі на кшталт Schema.org Blueprints і Drupal AI. І подумаємо, що все це означає для дизайнерів, розробників і майбутнього створення цифрових продуктів.

Клітинні автомати та логіка емерджентності

Краса простих правил

У 1970 році математик Джон Конвей представив «Гру «Життя»» — «гру без гравців», яка стала однією з найдосліджуваніших систем у теорії обчислень. Правила разюче прості:

1. Будь-яка жива клітина, що має менше двох живих сусідів, помирає (недостатня населеність)
2. Будь-яка жива клітина, що має двох або трьох живих сусідів, виживає
3. Будь-яка жива клітина, що має понад трьох живих сусідів, помирає (перенаселеність)
4. Будь-яка мертва клітина, що має рівно трьох живих сусідів, оживає (розмноження)

З цих чотирьох правил, виражених жменею двійкових умов, постає дивовижний всесвіт складності. Планери мандрують нескінченними сітками. Осцилятори пульсують у вічних ритмах. Гармати випускають потоки візерунків крізь клітинний простір. А найдивовижніше те, що доведено: Гра «Життя» є тюрінгово повною: усе, що можна обчислити алгоритмічно, можна, у принципі, обчислити на простій сітці Конвея.

Рисунок 1: «Гарматa глайдерів» Госпера в «Грі життя» Конвея. Цей візерунок безперервно випускає потік глайдерів і наочно показує, як прості правила можуть породжувати безмежну, самопідтримувану складність.

Це перший урок клітинних автоматів: складна поведінка не вимагає складного підґрунтя. Прості правила, послідовно застосовані до всього простору, можуть породжувати візерунки та форми поведінки, яких ніхто явно не програмував.

Петлі Ленгтона та самовідтворення

У 1984 році Крістофер Ленгтон розвинув цей принцип далі своїми самовідтворювальними петлями — клітинним автоматом, який продемонстрував справжні засади штучного життя. Якщо «Гра життя» Конвея показує емерджентну складність, то петлі Ленгтона показують емерджентне відтворення.

Кожна петля складається з замкненої межі, що охоплює «геном», закодований у станах клітин. Цей геном безперервно тече по петлі та виходить назовні вздовж будівельного «рукава», який за 151 крок часу вибудовує дочірню петлю. Коли вона готова, дочірня петля відокремлюється від батьківської, і обидві продовжують розмножуватися.

Рисунок 2: Петля Ленгтона у початковій конфігурації. Генетична інформація циркулює по петлі та через виростаючий рукав спрямовує побудову дочірніх петель.

«Якщо самовідтворювальна машина можлива всередині клітинного автомата, то й саме життя може бути досяжним для машин».

— Крістофер Ленгтон, «Вивчення штучного життя за допомогою клітинних автоматів» (1986)

Наслідки глибокі. Петлі Ленгтона доводять, що самовідтворення не потребує складності біологічних клітин чи універсальних конструкторських здатностей початкового проєкту фон Неймана. Потрібно лише:

• Набір простих локальних правил
• Механізм кодування інструкцій
• Процес, за допомогою якого ці інструкції виконуються

Правила — це і є організм. Задум — це і є код.

У 1999 році Хіроки Саяма запропонував еволупи, різновиди, що мають структурну розчинність і фенотипічну взаємодію, завдяки чому виникають спонтанні мутації та еволюційна динаміка. Ці петлі еволюціонують через прямі фізичні зіткнення під час відтворення, що веде до варіацій генотипу, більшого морфологічного розмаїття та зростання складності з покоління в покоління. На відміну від жорстко заданого відтворення Ленгтона, еволупи демонструють спадкові мутації без зовнішнього втручання.

Правило 110 та універсальні обчислення

Дослідження елементарних клітинних автоматів Стівеном Вольфрамом завершилося разючим відкриттям: Правило 110 — одне з усього 256 можливих правил для найпростішого типу одновимірного клітинного автомата — здатне до універсальних обчислень.

Правило 110 можна задати повністю, вказавши результат для кожної з восьми можливих комбінацій клітини та двох її сусідів. Проте це до смішного просте правило — вісім двійкових рішень — здатне змоделювати універсальну машину Тюрінга.

Рисунок 3: клітинний автомат «Правило 110». Попри просте визначення, Правило 110 демонструє поведінку класу 4 — складні візерунки, що не є ні цілком стабільними, ні цілком хаотичними, — і його Тюрінг-повноту доведено.

«Щоб виконувати універсальні обчислення, зовсім не потрібен повноцінний процесор. Досить цього маленького правила».

— Стівен Вольфрам, «Новий вид науки»

У 2004 році Меттью Кук опублікував доказ того, що Правило 110 з певним періодичним фоновим візерунком є Тюрінг-повним. Доказ показує, що Правило 110 може емулювати циклічні системи тегів, які своєю чергою можуть емулювати будь-яку машину Тюрінга. Серед 88 можливих унікальних елементарних клітинних автоматів Правило 110 — єдине, для якого Тюрінг-повноту доведено безпосередньо.

Принцип обчислювальної еквівалентності, який запропонував Вольфрам, говорить про ще радикальніше: системи, що перевищують мінімальний поріг складності, по суті еквівалентні за своїми обчислювальними можливостями. Людський мозок, система погоди й Правило 110 в якомусь глибокому сенсі обчислювально еквівалентні.

Метаклітина 0E0P: справжнє самовідтворення

У жовтні 2018 року Адам П. Гушер завершив побудову метаклітини 0E0P — візерунка в «Грі життя» Конвея, здатного до справжнього самовідтворення. На відміну від попередніх метаклітин, яким потрібні вже наявні поблизу копії, метаклітина 0E0P може збудувати свої копії з нуля, разом із власною стрічкою інструкцій.

Це досягнення — віха в штучному житті: система, що здатна поширювати себе в обчислювальному середовищі, користуючись лише локальними правилами. 23 листопада 2013 року Дейв Грін створив у «Грі життя» першого реплікатора, який створює повну копію самого себе, зокрема стрічку інструкцій, — показавши, що навіть простий двостановий автомат Конвея може підтримувати необмежене самовідтворення.

Дизайн-системи як обчислювальні середовища

Від атомарного дизайну до агентного дизайну

Методологія атомарного дизайну (Atomic Design) Бреда Фроста, представлена у 2013 році, змінила наше уявлення про дизайн-системи. Розбиваючи інтерфейси на атоми (базові елементи, як-от кнопки й поля введення), молекули (прості поєднання), організми (складні секції інтерфейсу), шаблони (макети сторінок) і сторінки (кінцеві реалізації), атомарний дизайн запропонував ієрархічну структуру для керування складністю.

Але ось що промовисто, якщо озирнутися назад: атомарний дизайн уже втілював принципи клітинних автоматів, самих того явно не усвідомлюючи.

«Коли дизайн-система нудна, вона звільняє дизайнерів і розробників, щоб вони могли робити щось нове й розв’язувати нові проблеми. Дизайн-система бере на себе тягар нудного, щоб дизайнерам і розробникам не доводилося цього робити».

- Джош Кларк, «Найцікавіші дизайн-системи — нудні»

У лютому 2023 року Бред Фрост писав про «Дизайн-системи в часи ШІ»:

«ШІ — природний споживач дизайн-систем... Річ у тім, що значна частина роботи над компонентами дизайн-системи насправді є механічною та передбачуваною. Ми вже використовуємо такі інструменти, як PlopJS, щоб згенерувати заготовку компонента, яка відповідає формі решти бібліотеки. Я б із радістю прийняв допомогу ШІ в генерації багатьох типових заготовок».

- Бред Фрост

Саме механічність і передбачуваність дизайн-систем роблять їх придатними для роботи за принципом клітинних автоматів. Коли правила чіткі, локальні й послідовно застосовуються, агенти можуть діяти автономно — так само як клітинам у «Грі життя» Конвея не потрібен центральний контролер, щоб утворювати глайдери й осцилятори.

Імператив машинної читабельності

Ініціатива Storybook MCP (Model Context Protocol) — це важлива еволюція в цьому напрямі. Оголошений наприкінці 2025 року, Storybook MCP надає ШІ-агентам для написання коду машинночитані метадані компонентів з наявних налаштувань Storybook.

Ключова думка в тому, що агентам не потрібні ні «сирий» код, ні візуальна документація. Їм потрібні:

• Маніфести компонентів: Структуровані метадані про кожен компонент: його пропси, варіанти, прив’язки до дизайн-токенів і приклади використання
• Семантичні назви: Токени, багаті на намір, як-от action.primary.confirm, що передають агентам сенс, а не лише значення
• Цикли валідації: Можливість запускати тести, бачити збої та самостійно виправляти помилки

«Storybook MCP допомагає агентам дотримуватися ваших патернів і проходити ваші тести. Він надає їм дві речі, яких вони ніколи раніше не мали: машинночитані метадані компонентів та ітеративний цикл для самовиправлення помилок».

- Команда Storybook

Storybook MCP містить автономний цикл виправлення. Він дозволяє агентам запускати тести ваших компонентів (взаємодії та доступності), бачити, що не проходить, і виправляти власні помилки. Розробнику лишається втрутитися тільки після того, як тести пройдено. Більше жодного няньчення промптів.

Це саме та архітектура клітинного автомата, застосована до дизайну: локальні правила (специфікації компонентів), взаємодії із сусідами (патерни композиції) та ітеративні оновлення (валідація й самовиправлення).

Мій маніфест компонента як геном

Порівняння з петлями Ленгтона стає ще влучнішим, коли ми розглядаємо, як працюють маніфести компонентів. У системі Ленгтона «геном», закодований у циркулюючих клітинах, містить інструкції для побудови нової петлі. У машинночитаній дизайн-системі маніфест компонента містить інструкції для складання інтерфейсів.

Маніфест компонента може визначати:

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

Цей маніфест одночасно є специфікацією дизайну й виконуваним кодом — точніше, інструкціями, з яких можна згенерувати виконуваний код. Агентові, який споживає цей маніфест, не потрібно розуміти естетику чи користувацький досвід у людському сенсі. Йому потрібно дотримуватися правил, поєднувати елементи відповідно до їхніх обмежень і створювати коректний результат.

Я згоден із Бредом Фростом щодо формату yaml.

Компоненти Drupal використовують формат yaml. Приблизно так:

$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

Дизайн — це код.

• Варіанти
• Токени
• Властивості

• Обмеження (ми могли б додати їх до компонентів)

• Правила слотів (що можна розміщувати в інших слотах і що дозволено розміщувати в моєму слоті)

• Правила

• Приклади 

• Анімації  ( дозволено або рекомендовано використовувати )

Потім спостерігайте за поведінкою й експериментуйте.

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

Дизайн-токени як змінні середовища

Дизайн-токени — ще один важливий елемент пазла. У клітинних автоматах клітини реагують на своє найближче оточення — стани сусідніх клітин. У дизайн-системах компоненти реагують на дизайн-токени — контекстні значення, що визначають їхній вигляд і поведінку.

Сучасні архітектури токенів використовують кілька шарів:

• Базові токени: Сирі значення, як-от color.blue.500: #3B82F6
• Семантичні токени: Посилання, що передають намір, як-от color.action.primary: color.blue.500
• Токени компонентів: Прикладні значення в межах компонента, як-от button.background.primary: color.action.primary

Коли агент генерує компонент Button, йому не потрібно знати, що «primary» означає синій. Йому достатньо послатися на button.background.primary і довіритися тому, що система токенів визначить правильне значення. Середовище (шар токенів) містить інформацію; компонентові (клітині) залишається лише відреагувати на неї.

Інструменти на кшталт Tokens Studio еволюціонували так, що розглядають дизайн-токени як обчислювальні графи з резолверами — вузлами, які ухвалюють семантичні рішення, які базові токени використовувати залежно від контексту. Так дизайн-токени перетворюються зі статичних значень на динамічні системи, що працюють за правилами.

Екосистема Drupal та інтеграція ШІ

Інтеграція ШІ в системи керування вмістом — це ідеальна лабораторія для дослідження принципів «дизайн — це код». CMS на кшталт Drupal уже втілюють ключові поняття: структуровані типи вмісту, визначення полів, зв’язки та правила композиції.

Я ніколи не думав, що ми можемо казати щось подібне. Для мене це було вершиною мистецтва.

 Найдосконаліший комп’ютер, який ми могли б мати. Розробники, наче з майбутнього «Зоряного шляху», розмовляють із комп’ютером, щоб він програмував за них.

Досвід агента (AX) і новий користувач

Проєктування для машин

На початку 2025 року Матіас Білман, генеральний директор Netlify, запровадив поняття «досвіду агента» (Agent Experience, AX) — нової дисципліни, що вивчає, як агенти ШІ взаємодіють із продуктами й платформами.

Це докорінна зміна. Десятиліттями UX (користувацький досвід) оптимізували під людське мислення, сприйняття й поведінку. DX (досвід розробника) оптимізували під розробників-людей, які створюють програмне забезпечення. AX визнає, що агенти стають основними користувачами цифрових систем, а їхні потреби зовсім інші:

• Їм байдужа візуальна естетика — лише структуровані дані, які можна розібрати
• Вони не навігують інтерфейсами — вони викликають API та споживають маніфести
• Вони не читають документацію, як люди — їм потрібен контекст, придатний для машинного читання
• Вони не роблять суб’єктивних суджень — вони дотримуються правил і обмежень

"ШІ-агенти — це не люди: їм байдуже, який розмір має кнопка, наскільки розбірливий шрифт, яка гарна кольорова палітра на вашому сайті чи які ефектні анімації у вашому застосунку. То що ж «турбує» ШІ-агентів? На це запитання сьогодні немає конкретної відповіді, але з кожним роком воно ставатиме дедалі важливішим."

- Дослідження AX

Відповідь: чіткі правила, передбачувана поведінка, добре структуровані дані та цикли зворотного зв'язку, що дають змогу агентам перевіряти й виправляти власні дії.

Виклик подвійного інтерфейсу

Проєктувати для AX означає будувати одразу два інтерфейси:

1. Інтерфейс «людина — агент»: місце, де люди наглядають за поведінкою агентів, схвалюють, редагують і скеровують її — це рівень «центру керування місією». Уявіть панелі моніторингу та черги на схвалення, а не форми й кнопки.
2. Інтерфейс «агент — система»: місце, де агенти взаємодіють з API, базами даних та інструментами — це «операційний» рівень. Він має бути надійним, добре задокументованим і оптимізованим для ефективної роботи машин.

Це віддзеркалює архітектуру клітинних автоматів, де співіснують дві різні перспективи:

• Локальна перспектива: кожна клітина (агент) діє за простими правилами, зважаючи на найближчих сусідів
• Глобальна перспектива: виникають складні візерунки, які видно лише в масштабі

"Дизайн досвіду агентів (AX) має забезпечувати чудову зручність використання для агентів і самими агентами. Тож чудовий AX веде до чудового досвіду користувача (UX). Якщо ШІ-агент натрапляє на зламаний процес, протокол чи навіть непослідовні формулювання в різних системах, він не здатен виконати завдання. Це поганий досвід для агента, що своєю чергою призводить до поганого досвіду клієнта чи співробітника."

- Кет Холмс, директорка з досвіду, Salesforce

Від UX до AX: еволюція цифрового дизайну

Стигмергія та непряма комунікація

Одне з найпотужніших понять роївого інтелекту — це стигмергія — непряма координація через сліди в середовищі. Мурахи не повідомляють одна одній напряму, де є їжа: вони залишають феромонові стежки, за якими йдуть інші. Середовище стає каналом зв'язку.

В агентних системах дизайну стигмергія набуває таких форм:

• Спільні бібліотеки компонентів: агенти «бачать», які компоненти існують і як їх використовували
• Дизайн-токени: семантичні значення, що кодують дизайнерські рішення як факти середовища
• Документація патернів: приклади використання, що править за феромонові стежки для майбутніх агентів
• Набори тестів: правила валідації, що обмежують простір допустимих результатів
• Історія Git: запис минулих рішень, на який можуть спиратися агенти

Коли агент генерує інтерфейс із компонента, він залишає сліди — у кодовій базі, в документації, у патернах, які сам закладає. Майбутні агенти, що стикатимуться з подібними завданнями, зазнаватимуть впливу цих слідів, і так виникає форма колективного інтелекту, якої не має жоден окремий агент.

Агентні патерни дизайну

Ендрю Ин та інші виокремили чотири ключові патерни для агентних систем ШІ:

1. Рефлексія: ШІ оцінює власний результат і поступово його вдосконалює
2. Використання інструментів: ШІ взаємодіє із зовнішніми інструментами, API та системами
3. Планування:ШІ розбиває складні завдання на підзавдання та виконує їх послідовно
4. Мультиагентність: Кілька спеціалізованих агентів співпрацюють над складними завданнями

Ці патерни напряму відповідають концепціям клітинних автоматів:

Дизайн і є кодом: глибше прочитання

Що насправді означає «Дизайн і є кодом»

Коли ми кажемо «дизайн і є код», ми водночас стверджуємо кілька речей:

1. Семантична рівнозначність

Дизайнерські рішення, коли їх належно закодовано, стають виконуваними. Дизайн-токен — це не просто значення, а інструкція. Специфікація компонента — це не просто документація, а програма. Коли агенти споживають ці артефакти, вони виконують дизайн так само, як і реалізують його.

2. Генеративна здатність

Так само як Rule 110 може обчислити все, що піддається обчисленню, достатньо повна дизайн-система може породити будь-який допустимий інтерфейс. Система містить потенціал усіх своїх допустимих виявів. Те, що з’явиться, залежить лише від початкових умов (вимог) і правил (обмежень).

3. Емерджентна складність

Найдосконаліші інтерфейси не проєктуються зверху вниз, а виникають із послідовного застосування простих правил. Добре продумана кнопка, яку використовують послідовно, створює цілісну візуальну мову, і ніхто не планував цієї цілісності свідомо.

4. Обчислювальна незвідність

Деякі результати дизайну неможливо передбачити, не запустивши систему насправді. Ви не дізнаєтеся, як виглядатиме інтерфейс, зібраний агентом, доки не дозволите агентові його зібрати. Це принцип обчислювальної незвідності Вольфрама, застосований до дизайну.

5. Самомодифікація

Подібно до evoloops, які мутують під час реплікації, дизайн-системи, готові до роботи з агентами, можуть еволюціонувати в процесі використання. Компоненти, створені агентами, стають частиною бібліотеки, яку споживатимуть майбутні агенти. Система навчається, адаптується й зростає.

Розширена метафора клітинних автоматів

Понад метафору: справжня конвергенція

Але це не просто метафора. Конвергенція справжня, і вона відбувається просто зараз:

• Storybook MCP перетворює бібліотеки компонентів на машиночитні інструкції, які виконують агенти
• Model Context Protocol стандартизує, як агенти отримують доступ до інструментів і контексту, створюючи універсальний субстрат для агентних операцій
• Мультиагентні архітектури розподіляють працю між спеціалізованими агентами (архітектор, програміст, рецензент), які взаємодіють за протоколами, подібно до клітин із диференційованими функціями
• Самовідновні циклита дозволяють агентам запускати тести, виявляти помилки й ітерувати — через ті самі механізми зворотного зв’язку, за допомогою яких клітинні автомати еволюціонують до стабільних конфігурацій
• Schema.org Blueprints роблять структури контенту машинозчитуваними та семантично змістовними
• Drupal AI надають інфраструктуру, за допомогою якої ШІ-агенти можуть самостійно створювати, змінювати та супроводжувати контент

Ми не підходимо до принципу «дизайн — це код» як до філософської позиції. Ми будуємо його як технічну інфраструктуру.

Наслідки та шлях уперед

Для дизайнерів

Роль дизайнера змінюється: з «творця прямокутників» він стає «визначником правил». Як зауважив Бред Фрост:

«Дизайнерам і розробникам, які вважають свою роботу створенням прямокутників, є чого непокоїтися. Але ті, хто бачить свою роботу в розв’язанні проблем — а прямокутники створює й використовує принагідно, лише щоб ці проблеми розв’язати, — мають значно менше підстав для страху».

— Брад Фрост

В агентному майбутньому дизайнери будуть:

• Визначати семантичні токени та зв’язки між ними
• Встановлювати обмеження композиції та шаблони
• Створювати правила валідації, яким мусять відповідати агенти
• Підтримувати й розвивати правила, що керують емерджентністю
• Проєктувати механізми зворотного зв’язку, які уможливлюють самокорекцію
• Формувати «функції придатності», що визначають, які результати прийнятні

Це дизайн на вищому рівні абстракції: ми проєктуємо правила, що породжують дизайн, а не сам дизайн. Так само, як задати правила клітинного автомата, а не малювати кожну клітину окремо.

Для розробників

Розробники стають архітекторами агентних систем. Як зазначає Anthropic:

«Сфера розробки програмного забезпечення продемонструвала вражаючий потенціал для можливостей LLM, які розвинулися від автодоповнення коду до самостійного розв’язання проблем».

Розробникам потрібно буде:

• Створювати машинозчитувані інтерфейси між агентами та системами
• Проєктувати цикли зворотного зв’язку та механізми валідації
• Будувати каркас, у межах якого виникає емерджентна поведінка
• Зберігати людський нагляд як остаточну інстанцію
• Визначати протоколи, за якими агенти спілкуються
• Реалізовувати «клейовий код», що поєднує різні агентні системи

Для веброзробки та CMS-платформ

Інтеграція ШІ в такі платформи, як Drupal, вказує на майбутнє, у якому:

• Моделі контенту стають придатними для споживання агентами завдяки стандартам на кшталт Schema.org
• Редакційні процеси стають агентно-підтримуваними із чернетками, модерацією та оптимізацією на основі ШІ
• Пошук еволюціонує від зіставлення ключових слів до семантичного розуміння за допомогою embeddings і векторних баз даних
• Персоналізація стає автономною — агенти вивчають вподобання користувачів і адаптують контент у реальному часі
• Розробка прискорюється адже агенти генерують компоненти, тести та документацію

Те, що екосистема Drupal охоче приймає ШІ — через модулі Drupal AI, Drupal Canvas, Schema.org Blueprints та інтеграцію з ШІ-провайдерами, — доводить, що це майбутнє вже будується.

Для організацій

Конкурентну перевагу матимуть організації, чиї дизайн-системи найбільш «готові до агентів». Системи, готові до агентів, мають:

• Повне покриття станів і варіантів компонентів
• Семантичні назви, що передають намір
• Машинозчитувану документацію та контекст
• Інфраструктуру валідації й тестування
• Чіткі обмеження, що окреслюють простір допустимих результатів
• API, розроблені для споживання агентами (AX-first)
• Контентні архітектури за принципом Schema.org-first

Для майбутнього цифрових продуктів

Кінцевий стан нагадує цифрову екологію: безліч агентів, що діють за локальними правилами й породжують емерджентні інтерфейси, яких не планував жоден дизайнер чи розробник, але які якимось чином узгоджуються, бо закладені в основі правила міцні.

Це не так фантастично, як звучить. Саме так працюють біологічні системи, ростуть міста, функціонують ринки. Питання не в тому, чи прийдемо ми до такого стану, а в тому, як ми пройдемо цей перехід.

Висновок: код живий

Джон фон Нейман, ерудит, який винайшов клітинні автомати, керувався фундаментальним питанням: Якої мінімальної складності достатньо для самовідтворення? Його відповідь, універсальний конструктор фон Неймана, показала, що самовідтворення не потребує біологічного механізму. Потрібні лише правила, які кодують власне застосування.

Сімдесят років потому ми відкриваємо, що той самий принцип стосується й дизайн-систем. Мінімальна вимога для автономної генерації інтерфейсів — це не штучний загальний інтелект і не людська творчість. Це повний, несуперечливий, машинночитний набір правил, який агенти можуть виконувати.

Коли петлі Ленгтона відтворюються на клітинній сітці, ми не кажемо, що петлі «проєктують» нові петлі. Відтворення — це просто те, що породжують правила. Проте результат — колонії самоподібних візерунків, що невпинно розростаються, — безсумнівно генеративний, у певному функціональному сенсі творчий.

Коли AI-агенти збирають інтерфейси з компонентів дизайн-системи, дотримуючись семантичних токенів і композиційних обмежень, вони роблять щось схоже. «Творчість» криється не в агентах, а в правилах, які вони виконують: правилах, що їх створили люди, але які тепер діють автономно.

Ми стоїмо на порозі нової ери цифрового творення. Агенти вже тут. Протоколи формуються. Дизайн-системи стають субстратом для штучного життя.

Дизайн — це код.
А код оживає.

Ключові статті та проєкти

• Дизайн-системи в епоху AI — Бред Фрост (Brad Frost)
• Перший погляд на Storybook MCP — Storybook
• Представляємо AX: чому важливий досвід агента — Матіас Білльманн (Mathias Biilmann)
• Створення ефективних агентів — Anthropic

Ресурси Drupal AI

• Drupal AI

• Модуль Schema.org Blueprints

   

Ресурси про клітинні автомати

• Лексикон «Гри життя» Конвея — близько 1500 фігур
• Робоча машина Тьюрінга в «Грі життя»
• Петлі Ленгтона — Вікіпедія
• Набори правил для клітинних автоматів
• Новий вид науки онлайн — Стівен Вольфрам (Stephen Wolfram)
• Клітинні автомати — Nature of Code

Досліджено ідеї на перетині теорії обчислень, дизайн-систем, штучного інтелекту та веброзробки.

 Висловлені погляди — це умоглядні роздуми про нові тенденції, а не прогнози певного майбутнього.

Я бачу, що ми створюємо AI-агентів, які працюють у циклі та взаємодіють з іншими AI-агентами в додаткових циклах.

Дизайн — це код, коли система працює в циклі, наче цикл життя, в межах обраного полотна та набору правил.