Wireframe Nedir, Uygulama Alanları Nelerdir?

İşlerin sistematik olarak yürütülmesinin istendiği her çalışmanın bir proje analiz süreci vardır. Proje analiz sürecinde yapılacak işin net olarak belirlenmemesinin doğuracağı kafa karışıklıkları, işin ortasında gelecek revizyon taleplerinin sizi X yolundan çıkarıp Y yoluna sokmasının yaşatacağı zaman kayıpları ve tasarım sürecinde istenilen işlevlere sahip bir ürünün ortaya konulamaması gibi durumlar muhtemelen can sıkıcı olacaktır.

Wireframe, tek satır kod yazmadan, tabiri caizse tasarımın ‘T’ sine dahi dokunmadan projenin kurgusu ve işlevselliği hakkında hem yazılımcıya hem de müşteriye fikir sahibi olma imkanı sağlayan proje ön hazırlık aşamasıdır. Proje hakkında düşündüklerinizin görsel taslağı niteliğindedir ve projenin özellikleri ve fonksiyonalitesi hakkında bilgi verir. Proje içeriğinin nasıl konumlandırılacağını, neyin ne kadar yer kaplayacağını aşağı yukarı ortaya koyacağı için planlamanın doğru oranlarla yapılmasını sağlar.

Örnek

Masaüstü ve mobil uygulama projeleri için de kullanılan wireframe’lerin web alanında basit bir uygulamasını aşağıdaki örnekten inceleyebilirsiniz.

Kadın Yazılımcı Wireframe

Hangi tür wireframe’leri seçmeliyim?

Dinamik olarak hazırlanmış bir wireframe ile yapılan sunumlar sayesinde müşteriyle kurulan iletişim çok daha sağlıklı olacaktır. Sık sık karşılaşabileceğiniz, isteklerini tam anlamıyla size iletemeyen müşterilerle wireframe üzerinde çalışabilir ve projede henüz ilerlemeden bütün detayları kararlaştırabilirsiniz. Bu size müşterinin gözünde profesyonel görünüm verirken, zamandan tasarruf edip, istenmeyen durumlardan kendinizi korumanızı sağlayacaktır. Ayrıca müşterinin proje sonunda elde edeceği ürün hakkında daha projeye başlamadan fikir sahibi olması, revize taleplerini bu aşamada yapması ve oluşturduğunuz son proje taslağını kabul etmesi size proje sonunda bu taslağa uygun olarak yapılmış işin de kabul edildiği garantisini verecektir.

Eğer dinamik bir wireframe oluşturduysanız çalışan bir web sitesiymiş gibi kullanıcı deneyimi sağlayacağından gereklilikler konusunda sağlam bir fikir verir.

“Everybody wins!”

Duruma tasarım açısından bakılacak olursa, yapılması gerekenleri görsel ve işlevsel olarak tasarımcının önüne koyacağı için istenilenleri listeleyen bir dokümandan daha çok yardımcı olacaktır. Burada dikkat edilmesi gereken nokta, tasarımcının yaratıcılığını kısıtlamayacak şekilde taslaklar oluşturmanın önemini unutmamak olmalıdır.

Sonuç

Sonuç olarak wireframe’in, ürün geliştirme ve proje yönetimi için çok önemli bir yeri olduğunu rahatlıkla söyleyebilirim. Wireframe kullanımı için web üzerinde ücretli/ücretsiz servisler olduğu gibi, ücretli/ücretsiz masaüstü programları da mevcut. Hangisinin daha iyi olduğu hakkında yorumda bulunmayacak olsam da, profesyonel iş hayatında en çok kullanılan ve ücretli bir servis olan Balsamiq‘i önerebilirim. Başlangıç için 30 + 30 (gün) deneme sürümünü de kullanabilirsiniz tabii. 🙂 Linux tutkunları için Pencil, OS X kullanıcıları için de Omnigraffle önerilenler arasında.

Balsamiq online çalışma ortamı:

Balsamiq Çalışma Ortamı

Pencil çalışma ortamı:

Pencil Çalışma Ortamı

Diğer örnekler:

Facebook WireframeTwitter Wireframe