Ürün Tasarımı

Denomas UX/UI tasarım süreci — tasarım ilkeleri, kullanıcı araştırma, prototipleme, tasarım sistemi ve erişilebilirlik

Ürün Tasarımı (UX/UI)

Denomas ürün tasarım süreci, kullanıcı odaklı tasarım ilkelerini temel alır. Bu sayfa; tasarım ilkeleri, araştırma yöntemleri, prototipleme süreci, tasarım sistemi ve erişilebilirlik standartlarını tanımlar.


Tasarım İlkeleri

Tüm Denomas ürünlerinde geçerli beş temel ilke:

#İlkeAçıklama
1SadelikHer ekranda tek birincil eylem. Gereksiz öğe eklenmez.
2TutarlılıkTasarım sistemi bileşenleri tüm ürünlerde aynı şekilde kullanılır.
3Geri BildirimHer kullanıcı eylemi görsel veya metin yanıt alır (başarı, hata, yükleniyor).
4ErişilebilirlikWCAG 2.1 AA seviyesinde tüm ürünler erişilebilir olmalıdır.
5VerimlilikSık kullanılan görevler üç tıklama veya daha azıyla tamamlanabilir.

Kullanıcı Araştırma Yöntemleri

YöntemNe ZamanKatılımcıÇıktı
Kullanıcı mülakatıKeşif aşaması5-8 kişiİhtiyaç haritası
Kullanılabilirlik testiPrototip sonrası5 kişiSorun raporu
Kart sıralamaBilgi mimarisi tasarımı10-15 kişiKategori yapısı
A/B testCanlı ortamİstatistiksel örneklemKazanan varyant
AnketGenel memnuniyet50+ yanıtNicel veri
Günlük çalışmasıUzun süreli davranış5-10 kişi (1-2 hafta)Davranış kalıpları

Prototipleme Süreci

Tasarım süreci dört aşamadan oluşur:

1. Düşük Sadakat (Low-Fidelity)

  • Araç: Kağıt veya dijital wireframe (Excalidraw)
  • Amaç: Bilgi mimarisi ve akış doğrulama
  • Süre: 1-2 gün
  • Paydaş onayı: Ürün yöneticisi

2. Orta Sadakat (Mid-Fidelity)

  • Araç: Figma wireframe
  • Amaç: Düzen ve etkileşim kalıpları
  • Süre: 2-3 gün
  • Paydaş onayı: Ürün yöneticisi + mühendislik lideri

3. Yüksek Sadakat (High-Fidelity)

  • Araç: Figma tasarım sistemi bileşenleri ile
  • Amaç: Görsel tasarım ve mikro etkileşimler
  • Süre: 3-5 gün
  • Paydaş onayı: Ürün yöneticisi + mühendislik lideri + kalite

4. İnteraktif Prototip

  • Araç: Figma prototip
  • Amaç: Kullanılabilirlik testi için tıklanabilir prototip
  • Süre: 1-2 gün
  • Test: Kullanılabilirlik testi ile doğrulama

Tasarım Sistemi (Component Library)

Denomas tasarım sistemi merkezi bir bileşen kütüphanesidir:

KatmanİçerikÖrnek
Temel (Foundations)Renk, tipografi, aralık, ikonRenk paleti, font ailesi
AtomTekil bileşenlerButon, input, badge
MolekülBileşen gruplarıForm alanı, kart, tablo satırı
OrganizmaSayfa bölümleriNavigasyon çubuğu, sidebar, dashboard panel
ŞablonSayfa düzenleriListe sayfası, detay sayfası, dashboard

Erişilebilirlik Standartları

WCAG 2.1 AA uyumu tüm ürünlerde zorunludur:

KriterGereksinimKontrol Yöntemi
Renk kontrastıNormal metin: 4.5:1, büyük metin: 3:1Otomatik kontrol (axe-core)
Klavye erişimiTüm etkileşimler klavyeyle yapılabilirManuel test
Ekran okuyucuTüm görsellerde alt metin, ARIA etiketleriEkran okuyucu testi
Odak göstergesiKlavye odağı görsel olarak belirginManuel test
Hata mesajlarıHata durumunda açıklayıcı metinManuel test
Form etiketleriHer form alanında ilişkilendirilmiş etiketOtomatik kontrol

İlgili Sayfalar