Wireframe, bir web sayfasının renk, görsel ve yazı tipi olmadan yalnızca kutular ve çizgilerle çizilmiş yapısal taslağıdır; hangi öğenin nerede duracağını ve hangi öncelikte olacağını tasarımdan önce netleştirir.
Wireframe, sayfanın iskelet çizimidir. Başlık burada, menü şurada, form alt tarafta; görseller gri kutu, metinler çizgi olarak gösterilir. Amaç, görünüm tartışmasına girmeden yerleşimi ve içerik sırasını kararlaştırmaktır. Düşük ayrıntılı wireframe kağıt üzerine elle bile çizilebilir; orta ayrıntılı olanlar Figma gibi araçlarda hazırlanır ve gerçek metin taslaklarını içerebilir. Wireframe onaylandıktan sonra UI tasarımı bu iskelete renk ve kimlik giydirir.
İşletme sahibi için neden önemli
Yerleşim hatalarını en ucuz düzeltebileceğiniz an wireframe aşamasıdır. Tasarım bittikten ya da kod yazıldıktan sonra bir bölümü taşımak hem zaman hem bütçe ister. Wireframe ayrıca içerik ihtiyacını erken ortaya çıkarır: hangi sayfada hangi metin ve görsel gerekeceği belli olur, bu da içerik hazırlığını öne çeker. Görsel süslemeler olmadığı için dikkat doğru soruya odaklanır: Bu sayfa kullanıcının ne yapmasını istiyor?
Örnek
Bir eğitim kurumu ana sayfası için üç farklı wireframe hazırlandı: biri kayıt formunu en üste koyuyor, biri program listesini, biri kurum tanıtımını. Ekip ve kurum yöneticisi yarım saatlik bir toplantıda ikinci yapıyı seçti. Bu karar renkli tasarım üzerinde alınsaydı tartışma logonun boyutuna kayabilirdi.
Sık yapılan hata
Wireframe'i atlayıp doğrudan renkli tasarıma geçmektir; bu durumda yapısal sorunlar estetik tartışmaların arkasında kalır. Bir diğeri, wireframe'de gerçek içerik yerine yer tutucu metin kullanmak ve sonra uzun başlıkların tasarımı bozduğunu görmektir. Üçüncüsü, yalnızca ana sayfayı çizip iç sayfaları tasarımcının insafına bırakmaktır.
Teklif alırken sorulacak soru
Tasarım öncesi hangi sayfalar için wireframe hazırlanacak ve onayınız alınmadan görsel tasarıma geçilecek mi? Wireframe aşamasında gerçek metin taslakları kullanılacak mı?
Sık sorulanlar
Wireframe ile prototip aynı şey mi?
Hayır. Wireframe sabit bir yapı çizimidir; prototip ise sayfalar arasında tıklanarak gezilebilen, akışı deneyimleten çalışan bir taslaktır.
Wireframe onayından sonra değişiklik yapılabilir mi?
Yapılabilir, ancak her ileri aşamada değişiklik maliyeti artar; bu yüzden içerik sırası ve öncelik kararlarının wireframe'de netleşmesi beklenir.