
Tasarım sistemi her ürünün ilk günden ihtiyaç duyduğu bir şey değildir. Ne zaman hız kazandırdığını ve ne zaman ekibi yavaşlattığını anlatıyoruz.
Öne çıkanlar
- Tasarım sistemi bir Figma dosyası değil, tasarımla kod arasındaki anlaşmadır.
- Aynı bileşeni üçüncü kez çizdiğinizde sistem kurma zamanı gelmiştir.
- İlk sürümde tam bir sistem yerine renk, tipografi ve boşluk kurallarıyla başlamak yeterlidir.
- Kodda karşılığı olmayan bir tasarım sistemi kısa sürede eskir.
Bu yazıda5 bölüm
Tasarım sistemi son yılların en çok konuşulan konularından biri. Her ekip bir tane istiyor, çoğu ekip kurduğu sistemi altı ay sonra kullanmıyor. Sorun sistemin kendisinde değil, zamanlamasında ve neyin sistem sayıldığında.
Tasarım sistemi nedir, ne değildir?
Düzenli bir Figma dosyası tasarım sistemi değildir. Tasarım sistemi, tasarımcının çizdiği düğmeyle yazılımcının kodladığı düğmenin aynı şey olduğuna dair bir anlaşmadır. Renkler, yazı boyutları, boşluklar ve bileşenler hem tasarımda hem kodda aynı isimle, aynı değerle yaşar. Bu eşleşme yoksa elinizde yalnızca güzel bir stil rehberi vardır.
Ne zaman erken?
Ürün henüz ne olacağını arıyorsa, kapsamlı bir sistem kurmak ekibi yavaşlatır. Akışlar her hafta değişirken bileşenleri belgelemek, bir sonraki hafta çöpe gidecek iş üretmektir. Bu aşamada ihtiyacınız olan şey üç küçük karardır:
- Sınırlı bir renk paleti ve bunların ne için kullanılacağı,
- Dört beş yazı boyutundan oluşan bir tipografi ölçeği,
- Tek bir boşluk birimi ve katları.
Bu üçü, ürünün ilk sürümünün tutarlı görünmesi için çoğu zaman yeterlidir ve bir günde kurulur.
Ne zaman yatırım?
Basit bir ölçütümüz var: aynı bileşeni üçüncü kez çiziyorsanız ya da kodluyorsanız, sistem kurmanın zamanı gelmiştir. Şu işaretler de aynı şeyi söyler:
- Ürüne ikinci bir platform ekleniyor (web'in yanına mobil gibi).
- Ekibe yeni tasarımcılar ya da yazılımcılar katılıyor.
- Aynı ekranın iki farklı yerinde iki farklı düğme stili görmeye başladınız.
- Küçük bir görsel değişiklik onlarca dosyaya dokunmayı gerektiriyor.
Bu noktadan sonra sistem bir maliyet olmaktan çıkar. Yeni bir ekranın tasarımı ve geliştirmesi kısalır, tasarım incelemelerinde piksel tartışmaları azalır, erişilebilirlik kuralları her bileşene bir kez uygulanır.
Sistemi canlı tutan şey
Gördüğümüz en yaygın sorun, tasarım dosyasının güncel, kodun eski kalmasıdır. Bunu önlemek için sistemi kodun içinden yönetiyoruz: renk ve boşluk değerleri tek bir kaynaktan gelir, bileşenler belgelenmiş bir kütüphanede durur ve bir bileşen değiştiğinde değişiklik hem tasarıma hem koda aynı anda yansır. Sistemin bir sahibi olur; sahibi olmayan sistem birkaç ayda dağılır.
Kısacası
Tasarım sistemi bir prestij projesi değil, bir verimlilik aracıdır. Erken kurarsanız yük olur, geç kurarsanız borç birikir. Doğru an, tekrarın başladığı andır.

