Demo İste

Wireframe, MockUp, Prototip Anlam Karmaşasına Son Nokta...

Mustafa El-Aliwat, tasarım sürecinde wireframe, mockup ve prototip aşamalarının sırasını ve önemini paylaşıyor. Wireframe'in iskeleti çıkarmak için kullanıldığını, mockup'ın estetik kaygıları içerdiğini ve prototibin ise çalışan bir versiyon olduğunu açıklıyor. Yazar, bu aşamalarda kullanılabilecek çeşitli uygulamalara da değiniyor.

Loading...

Geçen gün ortağımla oturduk yarım saat ‘yok wireframe şudur, yok mockup şöyle, o öyle değil aslında böyle’ gibi boş boş anlamlar üzerine tartıştık. En sonunda aynı şeyleri farklı kelimelerle anlattığımızda hemfikir olup HapŞeklinde’ye konu etmeye karar kıldık.

Sıralama şu şekilde: Sketch/Eskiz -> Wireframe -> Mockup -> Prototip

Wireframe
Görsel ve işlevsel bir ön hazırlık aşaması ve tasarımın belki de ilk adımıdır. Bir kağıt ya da çizim programı üzerinde hazırlanabilir. Estetik kaygı anlamında renk dahil neredeyse hiçbir şeye gerek yoktur. Önemli olan iskeleti çıkartmak ve bir ön fikir sahibi olmaktır. İçerik bilgi mimarisidir: Menüler, metinler, butonlar, resimler, bunların konumları ve kapladığı alanlar, gruplamalar, sayfalar/ekranlar arası bağlantılar, senaryolarla kullanıcı etkileşimleri yer alır.
Faydası: Fazla vakit ve kaynak harcamadan yapılır. Siz ve müşteri istediğiniz şey üzerinde tartışır ve mutabık kalırsınız. Tasarımcı, yazılımcı ve bilumum ekip rahat eder.
Önerilen uygulamalar: Sketch, Balsamiq, Pencil, Omnigraffle (*)

Mockup
Aslında model veya maket de diyebiliriz. Wireframe’i alıp müşteriye güzel janjanlı bir şekilde tam ölçekli sunmaktır. Yani estetik kaygısı olan, son kullanıcının nihai şekildeki kullanımlarına en yakın görsel sunumdur. Bu sunum bir pdf olabileceği gibi müşterinin hayal edebilmesi için tamamen statik bir mobil uygulama da olabilir.
Faydası: Görsel tasarım ve gerçek dünyadaki kullanım alanları netleşmiş olur. Müşteri en sonunda neyle karşılaşacağını bilir, sürprize yer kalmaz.
Önerilen uygulamalar: Invision, UXPin, Marvel, Framer, JustInMind

Prototip
İşte bu en can alıcısıdır çünkü hayalinizin çalışan, işleyen basit bir versiyonudur. Tabi ki full fonksiyon değildir ama interaktif bir simulasyondur. Müşteriye verdiğinizde ‘aa bitirmişsiniz’ tepkisi almanız muhtemeldir.

Faydası: Hatalar ve kolay kullanımlı olup olmadığı gözlenir. Ayrıca ürünü yatırımcılara ve patronunuza göstermek için büyük fırsattır.
Önerilen uygulamalar: Invision, JustInMind, UXPin, 3D yazıcılar

(*) Bu yazıda bahsedilen uygulamalar genelde her aşama için kullanılabiliyorlar. Bir de web tabanlı ücretsiz birçok seçenek bulabilirsiniz.

Mustafa El-Aliwat

Gürkan Platin
Hacettepe Üniversitesi Yönetim ve Organizasyon mezunu olan Gürkan Platin, sırasıyla Mensan, Citibank, Garanti Bankası ve Kredi Kayıt Bürosu’nda çeşitli pozisyonlarda yöneticilik yapmıştır. Platin, 1996 yılından beri blog yazmaktadır ve makaleleri çeşitli ulusal ve uluslararası yayınlarda yayınlanmaktadır.
Toplantı Planlayın
Sitemizdeki deneyimi iyileştirmek ve hizmetlerimizi daha yüksek kalitede sunabilmek için yasal düzenlemelere uygun çerezler (cookies) kullanıyoruz. "Anladım" butonuna tıklayarak çerez politikamızı kabul etmiş oluyorsunuz. Çerez tercihlerinizi düzenlemek için "Ayarlar" a gidebilirsiniz.

Zorunlu Çerezler

Her zaman etkin
Zorunlu çerezler, web sitesine ilişkin temel işlevleri etkinleştirerek web sitesinin kullanılabilir hale gelmesini sağlayan çerezlerdir. Web sitesi bu çerezler olmadan düzgün çalışmaz.
Çerez Politikamız Gizlilik Politikamız

İşlevsellik ve Analiz Çerezleri

İşlevsellik ve analiz çerezleri, kullanıcıların web sitesine ilişkin geçmiş kullanımlarından yola çıkılarak gelecekteki ziyaretlerinde daha işlevsel bir kullanım deneyimi sunmayı hedefler. Web sitelerinin kullanıcılara dil, bölge vb. gibi kişiselleştirilmiş bir hizmet sunmasına olanak tanıyan, istatistik ve etkinlik verilerini işleyen çerezlerdir.
Çerez Politikamız Gizlilik Politikamız

Hedefleme ve Performans Çerezleri

Hedefleme ve performans çerezleri, ziyaretçilerin web sitesine ilişkin kullanım bilgilerini ve tercihlerini anonim olarak toplayan ve bu sayede web sitesinin performansının geliştirilmesini ve ziyaretçi tercihlerine yönelik kullanım deneyimlerinin arttırılmasını sağlayan çerezlerdir.
Çerez Politikamız Gizlilik Politikamız

Reklam Çerezleri

Reklam çerezleri, üçüncü taraflara ait çerezlerdir ve web sitelerinde ziyaretçilerin davranışlarını izlemek için kullanılırlar. Bu çerezlerin amaçları, ziyaretçilerin ihtiyaçlarına yönelik ilgilerini çekecek reklamların gösterilmesine yardımcı olmaktır ve sorumluluğu çerez sahibi üçüncü taraflara aittir.
Çerez Politikamız Gizlilik Politikamız
next4biz Destek