Tasarım Koddur

The Design is the Code

 

Hücresel Otomat Mantığı Ajan Tabanlı Tasarım Sistemlerini Nasıl Yeniden Şekillendirecek ve Web Geliştirmenin Geleceği Neden Basit Kurallarla Zaten Yazılmış Olabilir?

Tasarım sistemleri, yapay zekâ ve hesaplama kuramının kesişiminde köklü bir dönüşüm yaşanıyor. Bu değişim o kadar temel ki, otonom ajanlar çağında "tasarım" kelimesinin ne anlama geldiğine dair anlayışımızı bile sorgulatıyor.

 

 

 

On yıllardır tasarım ile kodu ayrı disiplinler olarak ele aldık: tasarım insan yaratıcılığının ve estetik yargının alanı, kod ise bu fikirlerin çalıştırılabilir biçime mekanik çevirisi. Ancak yapay zekâ ajanları kullanıcı arayüzlerini giderek daha fazla kendi başlarına bir araya getirdikçe, tasarım sistemlerini makine tarafından okunabilir bir altyapı olarak tükettikçe ve anlamsal tasarım belirteçlerinden (token) kod ürettikçe, hesaplama kuramındaki çok daha eski bir fikri yankılayan bir kavşağa yaklaşıyoruz.

 

O fikir mi? Tasarım koddur.

 

Bu, sadece akılda kalıcı bir slogan değil. Tasarım sistemlerinin hücresel otomatlar gibi çalıştığı, yani basit kuralların karmaşık ve ortaya çıkan (emergent) davranışlara yol açtığı bir dünyaya doğru ilerliyor olabileceğimizin kabulü. Bir şeyi "tasarlamak" ile "programlamak" arasındaki ayrımın tamamen ortadan kalktığı bir dünya bu. Otonom ajanların tasarım sistemlerini yalnızca kullanmadığı, eylem hâlindeki tasarım sistemlerinin ta kendisi olduğu bir dünya.

Yakınsama Anı

11 Aralık 2025'te Brad Frost (Atomic Design'ın yaratıcısı) ile Dominic Nguyen (Chromatic'in kurucu ortağı) "2026'da Ajan Tabanlı Tasarım Sistemleri" başlıklı bir canlı oturumda buluştu. Mesajları netti: Yapay zekâ ajanları arayüzleri şimdiden insan ekiplerinin kullandığı bileşenlerle bir araya getiriyor. Tasarım sistemleri makine tarafından okunabilir bir altyapıya dönüşmek zorunda; aksi hâlde geçmiş bir çağın kalıntılarına dönüşme riskiyle karşı karşıya.

 

 

Storybook ekibinin duyurduğu gibi: "Yapay zekâ tasarım sistemlerini tam olarak belgelendiği şekilde kullanmaya başlıyor. Örneklerdeki, durumlardaki & kısıtlardaki boşluklar doğrudan öngörülemeyen arayüz çıktılarına yol açıyor."

Bu blog yazısı; hücresel otomatlar, ortaya çıkan davranış ve ajan tabanlı tasarım sistemlerinin geleceği arasındaki derin bağlantıları ele alıyor. Von Neumann'ın kendini kopyalayan makinelerinden bugünün yapay zekâ ajan sürülerine uzanan kuramsal temelin izini süreceğiz.

 

Drupal ve modern CMS platformlarının, Schema.org Blueprints ve Drupal AI gibi modüller aracılığıyla yapay zekâyı nasıl entegre ettiğini inceleyeceğiz. Ardından bunun tasarımcılar, geliştiriciler ve dijital ürün yaratımının geleceği için ne anlama geldiğini tartışacağız.


Hücresel Otomatlar ve Ortaya Çıkışın Mantığı

Basit Kuralların Güzelliği

1970'te matematikçi John Conway, hesaplama kuramının en çok incelenen sistemlerinden biri olacak Yaşam Oyunu'nu (Game of Life) tanıttı: "sıfır oyunculu bir oyun". Kurallar insanın nefesini kesecek kadar basit:

  1. İkiden az canlı komşusu olan her canlı hücre ölür (yetersiz nüfus)
  2. İki ya da üç canlı komşusu olan her canlı hücre yaşamaya devam eder
  3. Üçten fazla canlı komşusu olan her canlı hücre ölür (aşırı nüfus)
  4. Tam olarak üç canlı komşusu olan her ölü hücre canlanır (üreme)

Bir avuç ikili koşulla ifade edilen bu dört kuraldan şaşırtıcı bir karmaşıklık evreni doğuyor. Planörler (glider) sonsuz ızgaralarda yol alır. Osilatörler sonsuz ritimlerle atar. Toplar (gun) hücresel uzaya desen akıntıları fırlatır. Ve en dikkat çekici olanı, Yaşam Oyunu'nun Turing-tam olduğu kanıtlanmıştır: algoritmik olarak hesaplanabilen her şey, ilke olarak Conway'in bu basit ızgarasında da hesaplanabilir.

 

 

Şekil 1: Conway'in Yaşam Oyunu'nda Gosper'ın Planör Topu. Bu desen kesintisiz bir planör akışı üretir; basit kuralların sonsuz ve kendini sürdüren bir karmaşıklık doğurabileceğini gösterir.

 

 

Hücresel otomatların ilk dersi şudur: karmaşık davranış için karmaşıklık şart değildir. Bir zemin boyunca tutarlı biçimde uygulanan basit kurallar, kimsenin açıkça programlamadığı örüntülere ve davranışlara yol açabilir.

Mutlaka İzleyin: Hücresel Otomatlara Giriş

Conway'in Yaşam Oyunu ve kendini kopyalayan Langton Döngüleri dahil, hücresel otomatlara bir giriş

Bu video, Langton Döngülerinin büyük bir torus üzerinde (ızgaranın karşılıklı kenarlarının birbirine bağlandığı yapı) çoğalmasına izin verilseydi sonunda ortaya çıkacak kendi kendini yok etme süreci dahil, birkaç animasyon gösteriyor.

 

 

 

 

Videodan ek kaynaklar:


Langton Döngüleri ve Kendini Kopyalama

1984'te Christopher Langton bu ilkeyi bir adım öteye taşıdı: kendini kopyalayan döngüleri, gerçek yapay yaşam ilkelerini sergileyen bir hücresel otomattı. Beliren karmaşıklığı gösteren Conway'in Yaşam Oyunu'nun aksine, Langton Döngüleri beliren bir şeyi gösterir: üremeyi.

Her döngü, hücre durumlarında kodlanmış bir "genom" çevreleyen dairesel bir sınırdan oluşur. Bu genom döngünün etrafında kesintisiz akar ve bir yapım koluyla dışarı taşınır; kol, 151 zaman adımında bir yavru döngü inşa eder. Yavru tamamlandığında ana döngüden ayrılır ve ikisi de kopyalanmayı sürdürür.

 

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

Şekil 2: Langton Döngüsü başlangıç yapılandırmasında. Genetik bilgi döngü içinde dolaşır ve uzanan kol aracılığıyla yavru döngülerin inşasını yönlendirir.

 

"Bir hücresel otomat içinde kendini üretebilen bir makine mümkünse, yaşamın kendisi de makineler tarafından gerçekleştirilebilir olabilir."

- Christopher Langton, "Hücresel Otomatlarla Yapay Yaşamı İncelemek" (1986)

Bunun sonuçları derin. Langton Döngüleri, kendini kopyalamanın biyolojik hücrelerin karmaşıklığını ya da von Neumann'ın özgün tasarımındaki evrensel inşa yeteneklerini gerektirmediğini gösteriyor. Yalnızca şunlar yeterli:

  • Basit, yerel kurallar kümesi
  • Talimatları kodlamak için bir mekanizma
  • Bu talimatların yürütüldüğü bir süreç

Kurallar organizmanın ta kendisidir. Tasarım kodun ta kendisidir.

1999'da Hiroki Sayama evoloops adlı varyantları ortaya koydu. Bu varyantlar yapısal çözünebilirliği ve fenotipik etkileşimleri bünyesine katarak kendiliğinden mutasyonlara ve evrimsel dinamiklere olanak tanır. Bu döngüler, kopyalanma sırasındaki doğrudan fiziksel çarpışmalar yoluyla evrimleşir; bu da genotip çeşitlenmesine, morfolojik çeşitliliğin artmasına ve kuşaklar boyunca karmaşıklığın büyümesine yol açar. Langton'ın sabit kopyalanmasının aksine evoloops, dışarıdan müdahale olmadan kalıtsal mutasyonlar sergiler.

 

 

Kural 110 ve Evrensel Hesaplama

Stephen Wolfram'ın temel hücresel otomatlar üzerindeki araştırmaları çarpıcı bir keşifle sonuçlandı: tek boyutlu hücresel otomatların en basit türü için mümkün olan yalnızca 256 kuraldan biri olan Kural 110, evrensel hesaplama yapabiliyor.

Kural 110, bir hücre ile iki komşusunun alabileceği sekiz olası bileşimin her biri için sonucun belirtilmesiyle eksiksiz biçimde tanımlanabilir. Yine de bu son derece basit kural, yani sekiz ikili karar, evrensel bir Turing makinesini simüle edebilir.

 

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

Şekil 3: Kural 110 hücresel otomatı. Tanımı basit olsa da Kural 110, Sınıf 4 davranışı sergiler: ne tamamen kararlı ne de tamamen kaotik, karmaşık örüntüler üretir ve Turing tamlığı kanıtlanmıştır.

 

"Evrensel hesaplama yapmak için bütün bir bilgisayar işlemcisine benzer bir şeye gerek yok. Şu küçük kural yeter."

- Stephen Wolfram, "A New Kind of Science"

2004'te Matthew Cook, belirli bir yinelenen arka plan örüntüsüne sahip Kural 110'un Turing tam olduğunu gösteren bir kanıt yayımladı. Kanıt, Kural 110'un döngüsel etiket sistemlerini taklit edebildiğini, bu sistemlerin de herhangi bir Turing makinesini taklit edebildiğini ortaya koyar. Olası 88 benzersiz temel hücresel otomat arasında, Turing tamlığı doğrudan kanıtlanmış tek kural Kural 110'dur.

Wolfram'ın önerdiği Hesaplamsal Denklik İlkesi daha da radikal bir şey öne sürer: belirli bir en düşük karmaşıklık eşiğinin üzerindeki sistemler, hesaplama yetenekleri bakımından esasen birbirine denktir. İnsan beyni, bir hava sistemi ve Kural 110, derin bir anlamda hesaplama açısından eşdeğerdir.

Wolfram'ın Hücresel Otomatlar için Dört Sınıfı

  • Sınıf 1: Evrim, homojen bir duruma varır
  • Sınıf 2: Evrim, birbirinden ayrı periyodik yapılara varır
  • Sınıf 3: Evrim, kaotik, rastgele örüntülere varır
  • Sınıf 4: Evrim, evrensel hesaplama yapabilen, yerelleşmiş yapılara sahip karmaşık örüntülere varır

Kural 110, Sınıf 4 davranışı sergiler. Wolfram bunu "kaosun kıyısında" var olmak diye anlatır: basit kuralların en yüksek hesaplama gücünü ürettiği kritik bir sınır.

0E0P Metahücresi: Gerçek Kendini Kopyalama

Ekim 2018'de Adam P. Goucher, 0E0P metahücresinin inşasını tamamladı. Bu, Conway'in Yaşam Oyunu'nda gerçek anlamda kendini kopyalayabilen bir örüntüdür. Yakınlarda önceden var olan kopyalara ihtiyaç duyan önceki metahücrelerin aksine 0E0P metahücresi, kendi komut şeridi dahil kendi kopyalarını sıfırdan inşa edebilir.

Bu başarı, yapay yaşamda bir dönüm noktasıdır: yalnızca yerel kuralları kullanarak kendini bir hesaplama zemini üzerinde yayabilen bir sistem. 23 Kasım 2013'te Dave Greene, Yaşam Oyunu'nda komut şeridi dahil kendinin eksiksiz bir kopyasını oluşturan ilk kopyalayıcıyı inşa etti. Bu da Conway'in basit iki durumlu otomatının bile sınırsız kendini çoğaltmayı destekleyebildiğini gösteriyor.

 

Daha Fazlasını Keşfedin: Hücresel Otomat Videoları

 

Daha fazla büyüleyici hücresel otomat içeriği arayın:

▶️ YouTube Araması: "cellular automata the design is the code"


Hesaplamsal Zemin Olarak Tasarım Sistemleri

Atomik Tasarımdan Ajan Tasarımına

Brad Frost'un 2013'te ortaya koyduğu Atomik Tasarım (Atomic Design) yöntemi, tasarım sistemlerini düşünme biçimimizi kökten değiştirdi. Arayüzleri atomlara (düğme ve girdi alanı gibi temel öğeler), moleküllere (basit bileşimler), organizmalara (karmaşık arayüz bölümleri), şablonlara (sayfa düzenleri) ve sayfalara (nihai uygulamalar) ayırarak karmaşıklığı yönetmek için hiyerarşik bir yapı sundu.

Ama geriye dönüp bakınca dikkat çekici olan şu: Atomik Tasarım, hücresel otomat ilkelerini zaten bünyesinde taşıyordu üstelik bunu açıkça fark etmeden.

Hücresel Otomat İlkesiAtomik Tasarım Karşılığı
Yerel kurallarHer bileşen düzeyinin, diğerleriyle nasıl birleşebileceğine dair kuralları vardır
Ortaya çıkış (Emergence)Karmaşık sayfalar, daha basit öğelerin birleşiminden doğar
TekrarlanabilirlikAynı atomlar, aynı kurallara göre bir araya geldiğinde tutarlı sonuçlar verir
ÖlçeklenebilirlikSistem, merkezi bir denetim olmadan ölçeklenir; her bileşen kendi davranışını "bilir"
Kendi kendine örgütlenmeTasarım token'ları yapılan değişiklikleri sistemin tamamına kendiliğinden yayar

"Tasarım sistemi sıkıcı olduğunda, tasarımcıları ve geliştiricileri yeni şeyler yapmakta, yeni sorunlar çözmekte özgür bırakır. Sıkıcı olanın yükünü tasarım sistemi taşır; böylece tasarımcıların ve geliştiricilerin taşımasına gerek kalmaz."

- Josh Clark, "The Most Exciting Design Systems Are Boring"

Şubat 2023'te Brad Frost, "Design Systems in the Time of AI" başlıklı yazısında şöyle yazdı:

"Yapay zekâ, doğal bir tasarım sistemi tüketicisidir... Gerçek şu ki, tasarım sistemi bileşen işlerinin büyük bir kısmı gerçekten de mekanik ve öngörülebilir. Kütüphanenin geri kalanının biçimine uyan bir bileşen iskeletini çıkarmak için PlopJS gibi araçları zaten kullanıyoruz. Yapay zekânın, bu sık rastlanan iskelet işlerinin büyük bölümünde bana yardım etmesini memnuniyetle karşılarım."

- Brad Frost

Tasarım sistemlerinin mekanik ve öngörülebilir yapısı, onları hücresel otomat tarzı bir işleyişe tam olarak uygun kılıyor. Kurallar açık, yerel ve tutarlı biçimde uygulandığında, ajanlar özerk çalışabilir; tıpkı Conway'in Yaşam Oyunu'ndaki hücrelerin, planörler ve osilatörler üretmek için merkezi bir denetleyiciye ihtiyaç duymaması gibi.

Makine Tarafından Okunabilirlik Zorunluluğu

Storybook MCP (Model Context Protocol) girişimi, bu yönde atılmış kritik bir evrim adımıdır. 2025'in sonlarında duyurulan Storybook MCP, yapay zekâ kodlama ajanlarına mevcut Storybook kurulumlarından makine tarafından okunabilir bileşen meta verileri sağlıyor.

Asıl önemli nokta şu: Ajanların ham koda ya da görsel dokümantasyona ihtiyacı yok. Onlara şunlar lazım:

  • Bileşen manifestoları: Her bileşene dair yapılandırılmış meta veriler: prop'ları, varyantları, tasarım token bağlamaları ve kullanım örnekleri
  • Anlamsal adlandırma: Yalnızca değerleri değil, ajanlara anlam da aktaran, niyet taşıyan token'lar; örneğin action.primary.confirm
  • Doğrulama döngüleri: Testleri çalıştırabilme, hataları görebilme ve kendini düzeltebilme yeteneği

"Storybook MCP, ajanların desenlerinizi izlemesine ve testlerinizi geçmesine yardımcı olur. Ajanlara daha önce hiç sahip olmadıkları iki şey sağlar: makine tarafından okunabilir bileşen meta verileri ve hataları kendi kendine onarmak için yinelemeli bir döngü."

- Storybook Ekibi

Storybook MCP, özerk bir düzeltme döngüsü içerir. Ajanların bileşen testlerinizi (etkileşim ve erişilebilirlik) çalıştırmasına, nelerin başarısız olduğunu görmesine ve kendi hatalarını düzeltmesine olanak tanır. Geliştiricinin devreye girmesi için testlerin geçmesini beklemesi yeterlidir. Artık istem başında bekçilik yapmak yok.

Bu, tasarıma uygulanmış bir hücresel otomatın mimarisinin tam kendisi: yerel kurallar (bileşen spesifikasyonları), komşu etkileşimleri (kompozisyon desenleri) ve yinelemeli güncellemeler (doğrulama ve kendini düzeltme).

 

Genom Olarak Bileşen Manifestom

Bileşen manifestolarının nasıl işlediğini düşündüğümüzde, Langton Döngüleri'yle yapılan karşılaştırma daha da yerinde hâle geliyor. Langton'ın sisteminde, dolaşan hücrelerde kodlanmış "genom", yeni bir döngü inşa etmek için gereken talimatları içerir. Makine tarafından okunabilir bir tasarım sisteminde ise bileşen manifestosu, arayüzlerin bir araya getirilmesi için gereken talimatları içerir.

Bir bileşen manifestosu şunları belirtebilir:

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

Bu manifest aynı anda hem bir tasarım şartnamesi hem de çalıştırılabilir bir kod; daha doğrusu, çalıştırılabilir kodun üretilebileceği talimatlar. Bu manifesti kullanan ajanın estetiği ya da kullanıcı deneyimini insani anlamda kavraması gerekmez. Kurallara uyması, öğeleri kısıtlarına göre birleştirmesi ve geçerli çıktılar üretmesi yeterlidir.

 

Brad Frost'un yaml biçimi kullanma fikrine katılıyorum.

 

Drupal bileşenleri yaml biçimini kullanıyor. Şuna benzer bir şey:

$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

 

Tasarım kodun ta kendisidir.

  • Varyantlar
  • Token'lar
  • Props
  • Kısıtlar (bileşenlere ekleyebiliriz)

  • Slot kuralları (diğer slotlara neler yerleştirilebilir ya da benim slotuma neler yerleştirilebilir)

  • Kurallar

  • Örnekler 

  • Animasyonlar  ( Kullanımına izin verilen ya da yönlendirilen )

Sonra davranışı izleyin ve deneyin.

şurada olduğu gibi: https://storybook.demo.varbase.vardot.com/?path=/story/atoms-button--primary 

 

Ortam Değişkeni Olarak Tasarım Token'ları

Tasarım token'ları bulmacanın bir başka önemli parçasıdır. Hücresel otomatlarda hücreler yakın çevrelerine, yani komşu hücrelerin durumlarına tepki verir. Tasarım sistemlerinde ise bileşenler tasarım token'larına tepki verir; bunlar görünümü ve davranışı belirleyen bağlamsal değerlerdir.

Modern token mimarileri birden çok katman kullanır:

  • Çekirdek token'lar: Ham değerler, örneğin color.blue.500: #3B82F6
  • Anlamsal token'lar: Niyete dayalı referanslar, örneğin color.action.primary: color.blue.500
  • Bileşen token'ları: Kapsamı sınırlı uygulamalar, örneğin button.background.primary: color.action.primary

Bir ajan Button bileşeni ürettiğinde "primary" renginin mavi olduğunu bilmesi gerekmez. Yalnızca button.background.primary değerine başvurması ve token sisteminin bunu doğru değere çözeceğine güvenmesi yeterlidir. Bilgiyi ortam (token katmanı) taşır; bileşen (hücre) ise yalnızca ona tepki vermelidir.

Şu gibi araçlar: Tokens Studio tasarım token'larını çözümleyicili hesaplama grafikleri olarak ele alacak şekilde gelişti; bunlar, bağlama göre hangi temel token'ların kullanılacağına dair anlamsal kararlar veren düğümlerdir. Böylece tasarım token'ları statik değerlerden dinamik, kural tabanlı sistemlere dönüşür.


Drupal Ekosistemi ve Yapay Zekâ Entegrasyonu

Yapay zekânın içerik yönetim sistemlerine entegrasyonu, "tasarım koddur" ilkelerini keşfetmek için mükemmel bir laboratuvar sunuyor. Drupal gibi CMS'ler temel kavramları zaten barındırıyor: yapılandırılmış içerik türleri, alan tanımları, ilişkiler ve bileşim kuralları.

Böyle bir şey söyleyebileceğimizi hiç düşünmemiştim. Benim için bu, sanatın zirvesiydi.

 Sahip olabileceğimiz en nihai bilgisayar düzeni. Geleceğin Star Trek dünyasından gelmiş gibi, bilgisayarla konuşup kendileri için program yazdıran bazı geliştiriciler.

 

 

Ajan Deneyimi (AX) ve Yeni Kullanıcı

Makineler İçin Tasarım

2025'in başında Netlify CEO'su Mathias Biilmann, "Ajan Deneyimi" (AX) kavramını ortaya attı; bu, yapay zekâ ajanlarının ürünler ve platformlarla nasıl etkileşim kurduğuna odaklanan yeni bir disiplin.

Değişim köklü. On yıllarca UX (Kullanıcı Deneyimi) insanın algısını, düşünme biçimini ve davranışını esas aldı. DX (Geliştirici Deneyimi) yazılım geliştiren insanlar için optimize edildi. AX ise ajanların dijital sistemlerin birincil kullanıcıları haline geldiğini ve tamamen farklı ihtiyaçları olduğunu kabul eder:

  • Görsel estetiği umursamazlar; yalnızca yapılandırılmış, ayrıştırılabilir veri isterler
  • Arayüzlerde gezinmezler; API'leri çağırır, manifestoları tüketirler
  • Belgeleri insanlar gibi okumazlar; makine tarafından okunabilir bağlama ihtiyaç duyarlar
  • Öznel yargıda bulunmazlar; kurallara ve kısıtlara uyarlar

"Yapay zekâ ajanları insan değildir: bir düğmenin boyutu, tipografinin okunabilirliği, web sitenizdeki güzel renk paleti ya da uygulamanızdaki gösterişli animasyonlar onları ilgilendirmez. Peki yapay zekâ ajanlarını gerçekte ne ilgilendirir? Bugün bu sorunun somut bir yanıtı yok, ama önümüzdeki yıllarda giderek daha önemli hale gelecek."

- AX Araştırması

Yanıt şu: net kurallar, öngörülebilir davranışlar, iyi yapılandırılmış veriler ve ajanların eylemlerini doğrulayıp düzeltmesini sağlayan geri bildirim döngüleri.

Çifte Arayüz Sorunu

AX için tasarım yapmak, aynı anda iki arayüz kurmak demektir:

  1. İnsandan Ajana Arayüz: İnsanların ajan davranışını gözetlediği, onayladığı, düzenlediği ve yönlendirdiği "görev kontrol" katmanı. Formları ve düğmeleri değil, panoları ve onay kuyruklarını düşünün.
  2. Ajandan Sisteme Arayüz: Ajanların API'ler, veritabanları ve araçlarla etkileşime girdiği "operasyonel" katman. Sağlam, iyi belgelenmiş ve makine verimliliği için optimize edilmiş olmalı.

Bu, iki ayrı bakış açısının bir arada var olduğu hücresel otomatların mimarisini yansıtır:

  • Yerel bakış açısı: Her hücre (ajan), yalnızca hemen yanındaki komşularına bakarak basit kurallar izler
  • Küresel bakış açısı: Yalnızca geniş ölçekte görülebilen karmaşık örüntüler ortaya çıkar

"Ajan deneyimi tasarımı (AX), ajanlar için ve ajanların kullanımında mükemmel bir kullanılabilirlik sağlamalıdır. Dolayısıyla harika bir AX, harika bir kullanıcı deneyimine (UX) yol açar. Yapay zekâ ajanı bozuk bir süreçle, bir protokolle ya da sistemler arasında tutarsız bir ifadeyle karşılaşırsa o görevi yerine getiremez. Bu, ajan için kötü bir deneyimdir; o da sonuçta kötü bir müşteri ya da çalışan deneyimine yol açar."

- Kat Holmes, Salesforce Baş Deneyim Sorumlusu

UX'ten AX'e: Dijital Tasarımın Evrimi

UX (İnsan Kullanıcılar)DX (Geliştiriciler)AX (Yapay Zekâ Ajanları)
Görsel arayüzlerAPI'ler ve SDK'larMakine tarafından okunabilir manifestolar
Duygusal bağDokümantasyonYapılandırılmış bağlam
Gezinme akışlarıKod örnekleriAraç tanımları
ErişilebilirlikTür güvenliğiKısıt tanımları
Hata mesajlarıYığın izleri (stack trace)Kendini düzeltme için geri bildirim döngüleri


Stigmerji ve Dolaylı İletişim

Sürü zekâsının en güçlü kavramlarından biri stigmerji; yani çevredeki izler aracılığıyla dolaylı koordinasyon. Karıncalar yiyeceğin yerini birbirlerine doğrudan anlatmaz; diğer karıncaların izleyeceği feromon izleri bırakır. Çevre bir iletişim ortamına dönüşür.

Ajan tabanlı tasarım sistemlerinde stigmerji şu biçimleri alır:

  • Ortak bileşen kütüphaneleri: Ajanlar hangi bileşenlerin var olduğunu ve nasıl kullanıldıklarını "görür"
  • Tasarım belirteçleri (design tokens): Tasarım kararlarını çevresel olgular olarak kodlayan anlamsal değerler
  • Örüntü dokümantasyonu: Gelecekteki ajanlar için feromon izi işlevi gören kullanım örnekleri
  • Test paketleri: Geçerli çıktıların alanını sınırlayan doğrulama kuralları
  • Git geçmişi: Ajanların başvurabileceği geçmiş kararların kaydı

Bir ajan bir bileşenle arayüz ürettiğinde iz bırakır; kod tabanında, dokümantasyonda, oluşturduğu örüntülerde. Benzer görevlerle karşılaşacak gelecekteki ajanlar bu izlerden etkilenir ve hiçbir tekil ajanın sahip olmadığı bir tür kolektif zekâ ortaya çıkar.

Ajan Tabanlı Tasarım Örüntüleri

Andrew Ng ve diğerleri, ajan tabanlı yapay zekâ sistemleri için dört temel örüntü belirledi:

  1. Yansıtma (Reflection): Yapay zekâ kendi çıktısını değerlendirir ve yinelemeli olarak iyileştirir
  2. Araç Kullanımı: Yapay zekâ harici araçlar, API'ler ve sistemlerle etkileşime girer
  3. Planlama:Yapay zeka karmaşık görevleri alt görevlere böler ve bunları sırayla yürütür
  4. Çoklu Ajan: Birden fazla uzmanlaşmış ajan, karmaşık görevlerde iş birliği yapar

Bu örüntüler, hücresel otomat kavramlarına doğrudan karşılık gelir:

Ajan ÖrüntüsüHücresel Otomat Karşılığı
Yansıtma (Reflection)Hücreler, mevcut durumun değerlendirilmesine göre güncellenir
Araç KullanımıHücreler çevresel değişkenlerle etkileşime girer
PlanlamaKararlı yapılandırmalara doğru çok kuşaklı evrim
Çoklu AjanÖzelleşmiş kurallara sahip farklı hücre türleri (çok hücreli otomatlar)

Tasarım Koddur: Daha Derin Bir Okuma

"Tasarım Koddur" Gerçekte Ne Demek?

"Tasarım koddur" dediğimizde aynı anda birkaç iddiada bulunuyoruz:

1. Anlamsal Denklik

Tasarım kararları doğru biçimde kodlandığında çalıştırılabilir hâle gelir. Bir tasarım belirteci (design token) yalnızca bir değer değil, bir talimattır. Bir bileşen şartnamesi yalnızca dokümantasyon değil, bir programdır. Ajanlar bu çıktıları tükettiğinde, tasarımı hayata geçirdikleri kadar onu çalıştırmış da olurlar.

2. Üretme Kapasitesi

Rule 110'un hesaplanabilir her şeyi hesaplayabilmesi gibi, yeterince eksiksiz bir tasarım sistemi de geçerli her arayüzü üretebilir. Sistem, geçerli tüm ifade biçimlerinin potansiyelini içinde barındırır. Ortaya ne çıkacağı yalnızca başlangıç koşullarına (gereksinimler) ve kurallara (kısıtlar) bağlıdır.

3. Ortaya Çıkan Karmaşıklık

En sofistike arayüzler yukarıdan aşağıya tasarlanmaz; basit kuralların tutarlı biçimde uygulanmasından doğar. İyi tasarlanmış bir düğme, tutarlı kullanıldığında, kimse bu bütünlüğü açıkça planlamadan uyumlu bir görsel dil oluşturur.

4. Hesaplamaya Dayalı İndirgenemezlik

Bazı tasarım sonuçları, sistemi gerçekten çalıştırmadan öngörülemez. Ajanın bir araya getirdiği bir arayüzün nasıl görüneceğini, ajana onu bir araya getirtmeden bilemezsiniz. Bu, Wolfram'ın hesaplamaya dayalı indirgenemezlik ilkesinin tasarıma uygulanmış hâlidir.

5. Kendini Değiştirme

Çoğalma sırasında mutasyona uğrayan evoloop'lar gibi, ajana hazır tasarım sistemleri de kullanım içinde evrilebilir. Ajanların ürettiği bileşenler, gelecekteki ajanların tükettiği kütüphanenin parçası olur. Sistem öğrenir, uyum sağlar ve büyür.

Genişletilmiş Hücresel Otomat Metaforu

Hücresel OtomatlarAjan Temelli Tasarım Sistemleri
Hücre ızgarasıArayüz öğelerinden oluşan tuval
Hücre durumlarıBileşen örnekleri ve prop'ları
KomşulukYerleşim bağlamı ve komşu bileşenler
Güncelleme kurallarıBileşim kısıtları ve tasarım belirteçleri
KuşaklarRender döngüleri ve durum güncellemeleri
Ortaya çıkan örüntülerEksiksiz arayüzler ve kullanıcı akışları
Kendini kopyalamaYeni bileşenlerin üretilmesini sağlayan bileşen kütüphaneleri
Evrensel hesaplamaGeçerli her arayüzü ifade edebilen tasarım sistemleri
Glider'lar (hareket eden örüntüler)Ürünler arasında yayılan yeniden kullanılabilir örüntüler
Durağan yapılar (still life)Değişmeyen yerleşik bileşenler
OsilatörlerAnimasyonlu bileşenler, yükleme durumları, geçişler

Metaforun Ötesi: Gerçek Bir Yakınsama

Ama bu yalnızca bir metafor değil. Yakınsama gerçek ve tam şu anda yaşanıyor:

  • Storybook MCP, bileşen kütüphanelerini ajanların yürüttüğü, makinece okunabilir talimatlara dönüştürür
  • Model Context Protocol, ajanların araçlara ve bağlama erişme biçimini standartlaştırır; böylece ajan temelli işlemler için evrensel bir zemin oluşturur
  • Çoklu ajan mimarileri, işi uzmanlaşmış ajanlar (mimar, kodlayıcı, gözden geçirici) arasında bölüştürür; bu ajanlar, işlevleri farklılaşmış hücreler gibi protokollere göre etkileşir
  • Kendini onaran döngülerAjanların testleri çalıştırmasına, hataları tespit etmesine ve yinelemeli olarak ilerlemesine olanak tanır; hücresel otomatların kararlı yapılandırmalar geliştirirken kullandığı geri bildirim mekanizmalarının aynısıdır
  • Schema.org Blueprints içerik yapılarını makine tarafından okunabilir ve anlamsal olarak anlamlı hale getirir
  • Drupal AI yapay zekâ ajanlarının içerik oluşturması, değiştirmesi ve yönetmesi için gereken altyapıyı özerk biçimde sağlar

"Tasarım koddur" fikrine felsefi bir duruş olarak yaklaşmıyoruz. Onu teknik bir altyapı olarak inşa ediyoruz.


Sonuçlar ve Önümüzdeki Yol

Tasarımcılar İçin

Tasarımcının rolü "dikdörtgen çizen kişi"likten "kural tanımlayan kişi"ye dönüşüyor. Brad Frost'un da gözlemlediği gibi:

"İşini dikdörtgen çizmek olarak görən tasarımcıların ve geliştiricilerin endişelenmek için epey nedeni var. Ama işini sorun çözmek olarak gören, bu sorunları çözmek için de bir şekilde birkaç dikdörtgen çizmek ya da kullanmak zorunda kalan tasarımcıların ve geliştiricilerin korkacağı çok şey yok."

- Brad Frost

Ajan çağında tasarımcılar şunları yapacak:

  • Anlamsal token'ları ve aralarındaki ilişkileri tanımlamak
  • Kompozisyon kısıtlarını ve kalıpları belirlemek
  • Ajanların karşılaması gereken doğrulama kuralları oluşturmak
  • Ortaya çıkışı (emergence) yöneten kuralları seçip geliştirmek
  • Kendi kendini düzeltmeyi sağlayan geri bildirim mekanizmalarını tasarlamak
  • Hangi çıktıların kabul edilebilir olduğunu belirleyen "uygunluk fonksiyonlarını" şekillendirmek

 

Man in blue shirt examines colorful flowchart.

 

 

Bu, daha yüksek bir soyutlama düzeyinde tasarımdır: tasarımların kendilerini değil, tasarımları üreten kuralları tasarlamak. Tıpkı her hücreyi tek tek çizmek yerine bir hücresel otomatın kurallarını tanımlamak gibi.

 

Geliştiriciler İçin

Geliştiriciler ajan sistemlerinin mimarlarına dönüşüyor. Anthropic'in tarif ettiği gibi:

"Yazılım geliştirme alanı, LLM özellikleri açısından kayda değer bir potansiyel gösterdi; yetenekler kod tamamlamadan özerk problem çözmeye doğru evrildi."

Geliştiricilerin şunlara ihtiyacı olacak:

  • Ajanlar ile sistemler arasında makine tarafından okunabilir arayüzler oluşturmak
  • Geri bildirim döngülerini ve doğrulama mekanizmalarını tasarlamak
  • Ortaya çıkan davranışın içinde şekilleneceği iskeleyi kurmak
  • Son hakem olarak insan denetimini korumak
  • Ajanların birbiriyle iletişim kurduğu protokolleri tanımlamak
  • Farklı ajan sistemlerini birbirine bağlayan "yapıştırıcı kodu" uygulamak
Man with laptop amidst web development icons and chatbot graphic.

 

Web Geliştirme ve CMS Platformları İçin

Yapay zekânın Drupal gibi platformlara entegre edilmesi şöyle bir geleceğe işaret ediyor:

  • İçerik modelleri ajanlar tarafından tüketilebilir hale gelir Schema.org gibi standartlar sayesinde
  • Editoryal iş akışları ajan destekli hale gelir yapay zekâ destekli taslak hazırlama, moderasyon ve optimizasyonla
  • Arama evrilir anahtar kelime eşleştirmesinden, gömmeler (embeddings) ve vektör veritabanları aracılığıyla anlamsal kavrayışa
  • Kişiselleştirme özerk hale gelir ajanlar kullanıcı tercihlerini öğrenir ve içeriği gerçek zamanlı olarak uyarlar
  • Geliştirme hızlanır çünkü ajanlar bileşenleri, testleri ve dokümantasyonu üretir

Drupal ekosisteminin Drupal AI, Drupal Canvas, Schema.org Blueprints gibi modüller ve yapay zekâ sağlayıcıları entegrasyonu aracılığıyla yapay zekâyı benimsemesi, bu geleceğin zaten inşa edilmekte olduğunu gösteriyor.

 

 

 

Kurumlar İçin

Rekabet avantajı, tasarım sistemleri en "ajan hazır" olan kurumlara ait olacak. Ajan hazır sistemlerin özellikleri şunlardır:

  • Bileşen durumlarının ve varyantlarının tam kapsamı
  • Niyeti ileten anlamsal adlandırma
  • Makine tarafından okunabilir dokümantasyon ve bağlam
  • Doğrulama ve test altyapısı
  • Geçerli çıktıların alanını sınırlayan net kısıtlar
  • Ajanların tüketimi için tasarlanmış API'ler (önce AX)
  • Önce Schema.org'u temel alan içerik mimarileri

 

 

 

Dijital Ürünlerin Geleceği için

Vardığımız nokta, bir tür dijital ekolojiye benziyor: yerel kurallara göre çalışan sayısız ajan, hiçbir tasarımcının ya da geliştiricinin önceden planlamadığı, yine de altta yatan kurallar sağlam olduğu için bir şekilde tutarlı kalan ortaya çıkış (emergent) arayüzleri üretiyor.

Bu, kulağa geldiği kadar uçuk değil. Biyolojik sistemler tam olarak böyle işler, şehirler böyle büyür, piyasalar böyle çalışır. Asıl soru bu noktaya varıp varmayacağımız değil, geçişi nasıl yöneteceğimiz.

 

Sonuç: Kod Yaşıyor

Hücresel otomatları icat eden çok yönlü bilgin John von Neumann'ı temel bir soru yönlendiriyordu: Kendini çoğaltmak için gereken en düşük karmaşıklık nedir? Cevabı olan von Neumann evrensel inşa edicisi, kendini kopyalamanın biyolojik bir mekanizma gerektirmediğini gösterdi. Gereken tek şey, kendi uygulanma biçimini kodlayan kurallardır.

Yetmiş yıl sonra aynı ilkenin tasarım sistemleri için de geçerli olduğunu keşfediyoruz. Kendiliğinden arayüz üretmenin asgari koşulu yapay genel zekâ ya da insan düzeyinde yaratıcılık değil. Ajanların çalıştırabileceği eksiksiz, tutarlı ve makine tarafından okunabilir bir kurallar bütünü yeterli.

Langton Döngüleri bir hücre ızgarası boyunca çoğaldığında, döngülerin yeni döngüleri "tasarladığını" söylemeyiz. Çoğalma, kuralların doğal sonucudur. Yine de ortaya çıkan şey, yani durmadan genişleyen kendine benzer desenler kolonileri, tartışmasız üretken ve işlevsel anlamda yaratıcıdır.

Yapay zekâ ajanları, anlamsal belirteçleri (token) ve bileşim kısıtlarını izleyerek tasarım sistemi bileşenlerinden arayüzler kurduğunda, benzer bir şey yapıyorlar. "Yaratıcılık" ajanlarda değil, çalıştırdıkları kurallarda yatıyor. Bu kuralları insanlar tasarladı, ama artık kendi başlarına işliyorlar.

En Derin Anlam

"Tasarım koddur" sözünün en derin anlamı şu: yalnızca tasarım belirtimlerinin çalıştırılabilir hâle gelmesi değil, tasarım sistemlerinin canlıya benzer bir hâl alması. Büyüyorlar. Desenlerini çoğaltıyorlar. Kullanıldıkça evriliyorlar. Kimsenin açıkça programlamadığı davranışlar sergiliyorlar.

Dijital üretimde yeni bir çağın eşiğindeyiz. Ajanlar burada. Protokoller şekilleniyor. Tasarım sistemleri yapay yaşamın zemini hâline geliyor.

Tasarım koddur.
Ve kod canlanıyor.

 

Başlıca Makaleler ve Projeler

Drupal AI Kaynakları

Hücresel Otomat Kaynakları


Hesaplama kuramı, tasarım sistemleri, yapay zekâ ve web geliştirmenin kesişimindeki fikirleri araştırdım.

 Dile getirilen görüşler, ortaya çıkan eğilimler üzerine spekülatif keşiflerdir; kesin geleceklere dair tahmin değildir.

 

Döngü içinde çalışan ve ek döngülerde başka yapay zekâ ajanlarıyla etkileşen yapay zekâ ajanları yarattığımızı görüyorum.

Tasarım, sistem seçilmiş bir tuval ve kurallar kümesi içinde ömür boyu süren bir döngü gibi çalıştığında koddur.

The Design is the Code