Tasarım Sistemi: Tutarlılığı Kişilere Bağlı Olmaktan Çıkarmak
Tasarım sistemi bir kütüphane değil, ortak bir dildir. Ekip büyüdükçe değeri artar.
Görsel: Pixabay · Pixabay Lisansı
Sorun nedir?
Her yeni ekran biraz farklı yapılır. Düğmeler farklı yüksekliklerde, boşluklar farklı ölçülerde olur.
Tek tek bakıldığında fark edilmez, bütüne bakıldığında dağınıklık hissi verir. Kullanıcı bunu "özensiz" olarak algılar.
Tasarım sistemi neyi içerir?
Renk paleti: ana renkler, vurgu renkleri, metin ve arka plan tonları. Her rengin nerede kullanılacağı tanımlıdır.
Tipografi ölçeği: başlık ve metin boyutları sınırlı bir kümeden seçilir. Serbest boyut kullanımı tutarsızlık üretir.
Boşluk ölçeği: kenar boşlukları ve aralıklar belirli bir ölçeğe oturur.
Bileşenler: düğme, form alanı, kart, uyarı, tablo gibi tekrarlayan öğelerin tanımlı halleri.
Neden değerlidir?
Yeni ekran üretmek hızlanır. Sıfırdan karar vermek yerine mevcut parçalar birleştirilir.
Tutarlılık kişilere bağlı olmaktan çıkar. Ekip değişse de sistem kalır.
Geliştirme tarafında aynı bileşenler kodda da karşılık bulur, bu da tasarım ile kod arasındaki kaymayı azaltır.
Nereden başlamalı?
Mevcut ekranların envanterini çıkarın. Kaç farklı düğme stili, kaç farklı gri tonu kullanıldığını sayın.
Bu sayı genellikle şaşırtıcıdır ve sistemin neden gerektiğini tek başına gösterir.
Ardından her kategoride kaç varyant gerçekten gerektiğine karar verin ve gerisini eleyin.
Belgelendirme
Sistem, kullanılması için erişilebilir ve anlaşılır olmalıdır.
Her bileşen için ne zaman kullanılacağı ve ne zaman kullanılmayacağı yazılmalıdır. Kullanım kuralı olmayan bileşen kütüphanesi, yanlış kullanımı engelleyemez.
Koyu tema ve tema desteği
Renkleri doğrudan yazmak yerine değişkenler üzerinden tanımlamak, sonradan tema eklemeyi mümkün kılar.
Bu karar baştan alınmazsa, koyu tema talebi tüm ekranları elden geçirmeyi gerektirir.
Bakım
Sistem donmuş bir belge değildir. Yeni ihtiyaçlar geldikçe bileşen eklenir, kullanılmayanlar çıkarılır.
Sahipsiz kalan tasarım sistemi altı ayda eskir ve ekip tekrar kendi kararlarını vermeye başlar.
Küçük ekipte de değerli mi?
Evet, ancak kapsamı küçük olmalıdır. Renk, tipografi ve boşluk ölçeğini tanımlamak bile tek başına belirgin fayda sağlar.
Sistemi kodla eşleştirmek
Tasarım sisteminin karşılığı kodda bileşen kütüphanesi olarak bulunmalıdır.
Renk ve ölçü değerlerini doğrudan yazmak yerine değişkenler üzerinden kullanın; tek bir yerden değiştirilebilir olsun.
Bu yapı, marka güncellemesi geldiğinde tüm siteyi elden geçirmek yerine birkaç değişkeni güncellemeyi mümkün kılar.
Sistemin sahibi olmalı
Sahipsiz tasarım sistemleri altı ayda eskir ve ekip tekrar kendi kararlarını vermeye başlar.
Bir kişi sistemin güncelliğinden sorumlu olmalı ve yeni bileşen taleplerini değerlendirmelidir.
Yeni bir bileşen eklemeden önce mevcut bir bileşenin genişletilip genişletilemeyeceği sorulmalıdır.
Kullanımdan kalkan bileşenler işaretlenmeli ve kademeli olarak temizlenmelidir.
Sık sorulanlar
Tasarım sistemi kurmak ne kadar sürer?
Temel bir sistem, mevcut bir üründe birkaç hafta içinde çıkarılabilir. Asıl iş kurmak değil, ekibin ona uymasını sağlamaktır.
Hazır bileşen kütüphaneleri kullanılabilir mi?
Evet ve hızlandırır. Ancak markanıza ait renk ve tipografi kararlarının üzerine oturtulması gerekir; aksi halde ürününüz jenerik görünür.
Tasarım sistemi olmadan tutarlılık sağlanamaz mı?
Küçük ekiplerde bir süre sağlanabilir ancak kişilere bağımlı kalır. Ekip değiştiğinde veya proje büyüdüğünde tutarlılık hızla kaybolur; sistem bu bilgiyi kişilerden bağımsız hale getirir.
