Wireframe Nedir, Uygulama Alanları Nelerdir?

Setenay Ceren Avci —  5 Ağustos 2014 — 4 Comments

İş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ı

 

Hazırladığım diğer örnekler:

Facebook WireframeTwitter Wireframe

Setenay Ceren Avci

Posts Twitter

Öğrenme meraklısı, yeni mezun Bilgisayar Mühendisi.

4 responses to Wireframe Nedir, Uygulama Alanları Nelerdir?

  1. Gecen okudugum bir yaziya gore bir de wireframe lerin soyle bir yonu var sanirim. Gelistirici ve tasarimcilara esneklik saglamak. Yani siz oturup ugrasip her ayrintiyi dusunup photoshop gibi yazilimlarla cizimler yaparsaniz hem cok vakit harcamis oluyorsunuz. Hem de bunlarin uzerinde calisacak insanlarin yaraticiligini sondurmus oluyorsunuz. Cirkin cirkin wireframe ler oldukca esneklik ve yaraticilik daha on plana cikiyor.
    Yorumlarini bekliyorum.

    • Merhaba. @tasomaniac size katiliyorum. Bazen (o an elimde olan) bir renkli kalemle bir taslak ciziyorum ya da bir kismi icin oneride bulunuyorum, tarif etmeye calisiyorum tasarimci hemen kalemin renginde yapiyor tasarimi halbuki marka renginde olmasina dikkat ederiz (: tasarimciyi ve yazilimciyi ozgur birakma her zaman kazandirir.

  2. Setenay Ceren Avci, ellerinize ve aklınıza ve emeğinize sağlık.

    Uzun süredir yazılım yapan birisi olarak;
    En temel sorun müşterinin düşlediğini bizim de düşleyemiyor olmamızdır! Hangi malzemeyi kullanarak anlatırsanız anlatın veya o size anlatsın istenen ile programlanan ne yazık ki her zaman örtüşmüyor. Burada en önemli unsur işi verenin yaptığı iş konusunda az-çok sizin bilgi sahibi olmanız ve istediğini anlamaya çok fazla zaman ayırmanız önemli. Aksi durumda yap-boz ve yeniden yap hatta projeyi terk et süreçlerini yaşarsınız. Bu da aç kalmanıza sebep olabilir. Çoğu zaman işi veren sizin geliştireceğiniz işin maliyeti hakkında gerçek bilgiye ve dolayısıyla fikre sahip değildir. Bu sebeple eğer sizden isteneni çok iyi anlayabilirseniz iş maliyetlerinizi de o derece iyi hesaplarsınız… Gayret ve başarılarınızın sürmesini dilerim.

tasomaniac için bir cevap yazın Cevabı iptal et