4. Taslak Ekranları Çiz
Her iyi tasarlanmış ürünün arkasında, memnun kalana dek yüzlerce kez baştan çizilmiş ekranlar vardır.
Taslak ekranları yani ürün geliştirme terminolojisine göre “wireframe” çizmek; Ürün hangi ekranlardan oluşacak, bu ekranlarda hangi elementler nasıl bir sırayla yer alacak sorusunun cevabını verir.
Wireframe ürünün iskeletidir. Ürün onun üzerinde yükselir.
Amacı, belirli bir içeriği, işlevleri ve sayfalar arasındaki bağlantıları açıkça ortaya koymaktır. Wireframe olmadan kaybolursunuz.
Doğru tasarlanmış bir wireframe, şahane bir kullanıcı deneyimi (UX) tasarımına, sonra mükemmel bir ürüne, daha sonra mutlu müşterilere ve nihayet büyük bir gelire dönüşür.
Adımlar
- İlk versiyonda üründe hangi özellikler olacağını belirle (Bkz: Çıkış Özelliklerini Belirle)
- Bu özelliklerin nasıl bir akışla kullanıcılara sunulacağını tasarla (Bkz: Kullanıcı Akışlarını Çıkart)
- Kullanıcı akışların için gerekli olan ekranları belirle. Bir site haritası çıkar.
- Wireframe tasarlamanı kolaylaştıran Marvel ya da Whimsical benzeri araç-gereçleri kullan.
- Estetiğe değil, kullanıcının yaşayacağı deneyimin pürüzsüzlüğüne odaklan.
- Tasarladığın wireframe’in nasıl bir deneyim yaşatacağını daha iyi anlamak için inVision benzeri araç-gereçler ile prototiple.
- Prototipi önce takım arkadaşlarına denet. Yazılım geliştirmeden, ürünün neye benzeyeceğini, nelerin gerektiğini, düşünmediğin noktaları bul ve düzelt.
- İçine sinen prototipi hedef müşterilerinden 3 tanesinin önüne koy ve ne yaptıklarını not al.
- Müşterilerin aradığı bilgiye kolay ulaşabiliyor mu, yapmak istediği şeyi zorlanmadan yapabiliyor mu, kafası karışmadan ürün içinde gezinebiliyor mu takip et. Bunları yapamıyorsa neden olduğunu sor.
- Müşterilerin söylediklerinden sonra wireframe’i tekrar tasarla ve bu kez 10 kişinin önüne koy ve revizyon sürecine gerek olmayana kadar tekrarla.
