Tasarımcının bir günü: Figma linkinden PR'a dört skill, tek zincir

Prototype to Code serisi · Bölüm 4
Önceki bölümde kuralları anlattım. Bu bölümde tasarımcımızın bir gününü baştan sona izleyelim.
Önce şunu söyleyeyim: tasarımcının gün boyunca yazdığı şeylerin hiçbiri bir git komutu değil. Hepsi kısa, Türkçe cümleler. «Bu tasarımı kodla», «Kaydet», «Gönder». Arkada dört skill bir zincirin halkaları gibi sırayla devreye giriyor.

1. Tasarla: «Bu tasarımı kodla»
Gün bir Figma linki ya da bir ekran görüntüsüyle başlıyor. Tasarımcı ne istediğini anlatıyor ve tasarım skill'i devreye giriyor.
Skill önce mevcut component'leri tarıyor, sonra tasarımdaki her öğeyi bir component'le eşleştiren tabloyu hazırlıyor. Tasarımcı tabloyu onaylıyor, kod yazılıyor. İş bitince kodun yazım kontrolü otomatik olarak çalışıyor. Ardından tasarımcı ekranı tarayıcıda açıp kendi gözüyle kontrol ediyor.
2. Kaydet: «Kaydet» ya da «işim bitti»
Tasarımcı bir noktada işini kaydetmek istiyor. Burada devreye giren skill'in tek bir kesin kuralı var: ana branch'e, yani main'e, asla commit atılmaz.
Tasarım ekibinde herkes git'e hâkim olmak zorunda değil. Main'e doğrudan atılan bir commit, geri alması zor bir hata. Bu yüzden tasarımcı main'deyken «kaydet» derse skill ona sormadan yeni bir branch açıyor. Branch'in adını değişen dosyalardan kendisi çıkarıyor, örneğin pozisyonlar sayfası değiştiyse design/positions-update gibi. Tasarımcıya da hangi branch'i açtığını söylüyor.
Commit'ten önce ön denetim çalışıyor, bir sonraki maddede anlatacağım. Commit mesajı Türkçe yazılıyor. .env gibi hassas dosyalar da hiçbir koşulda commit'e girmiyor.
3. Gönder: «Gönder»
İş review'a hazır olduğunda tasarımcı «gönder» diyor. Skill ön denetimi bir kez daha çalıştırıyor. Kritik bir sorun çıkarsa branch bile açılmıyor, hiçbir şey push edilmiyor. Değişiklikler düzeltilmek üzere tasarımcının elinde kalıyor.
Denetim temizse skill değişiklikleri push ediyor ve bir PR açıyor. PR'ın içinde küçük bir kontrol listesi var: yerelde test edildi mi, component envanterine uyuyor mu, ham HTML kullanıldı mı, ikonlar doğru kaynaktan mı geldi. Review için otomatik olarak ben atanıyorum.
4. Denetle: rapor tasarımcının dilinde
Zincirin en çok emek verdiğimiz halkası denetim skill'i. Hem her kayıt ve gönderimden önce çalışıyor, hem de açılan PR'ı baştan sona inceliyor.
Bu skill'in asıl okuru bir geliştirici değil, tasarımcı. Bu yüzden raporda kod jargonu kullanmak yasak. Skill'in içinde bir sözlük var: «prop» yerine «ayar», «semantic token» yerine «tasarım sistemi rengi», «raw HTML» yerine «ham web etiketi» yazılıyor.

Her bulgu aynı üç soruya cevap veriyor: ne olmuş, neden sorun, nasıl düzelir. Geliştiricinin işine yarayacak teknik ayrıntı ise ayrı bir alt bölümde duruyor. Böylece aynı rapor iki kişiye de hitap ediyor.
Raporun sonunda üç karardan biri yazıyor:
- Durdur, önce düzelt. Kritik bir sorun var. Kodun yazım kontrolünden geçmemesi de bu sınıfa giriyor.
- Gözden geçir. Küçük notlar var, iş devam edebilir.
- Onaylandı. Kurallara uygun.
Raporda bir de «tarayıcıda kontrol edilmesi gerekenler» listesi var. Otomatik kontroller yazım hatasını yakalar ama ekranı göremez. Eksik bir ayraç çizgisi ya da yanlış bir metin ancak gözle fark ediliyor. Skill bunu bildiği için neyin gözle kontrol edilmesi gerektiğini ayrıca söylüyor.
Neden zincir?
Her halka bir öncekinin kaçırabileceği hatayı yakalıyor. Tasarım skill'i doğru component'i seçtiriyor, kayıt skill'i main'i koruyor, gönderim skill'i kirli bir PR'ı daha açılmadan durduruyor, denetim skill'i de her adımda aynı kurallarla bakıyor.
Tasarımcının bütün bunları bilmesi gerekmiyor. Repodaki design/ ile başlayan 40 branch, bu düzenin altı aylık izi.
Kısacası
Tasarımcı git öğrenmedi. Biz git'i tasarımcının cümlelerine çevirdik.
Bir sonraki bölümde zincirin diğer ucuna geçiyorum: PR geliştiriciye ulaştığında güveni ne sağlıyor ve merge kararı neden hep bir insanda kalıyor?
Musa Turan, PeopleBox'ta AI Software Engineer olarak LLM ve AI sistemleri üzerinde çalışıyor. «Prototype to Code» serisinde, PeopleBox Onyx'te tasarımcının çalışan kod teslim ettiği akışı anlatıyor.