Apa Itu Wireframe, Fungsi dan Cara Membuatnya ?

http://zlearn.id/

Bismillah.... bagi developer web maupun mobile wajib tahu apa itu si wireframe ? Apa fungsi dan kegunaan wireframe  dan bagaimana sih caranya membuat wireframe?.

Apa Itu wireframe ?

  • Wireframe  merupakan sebuah sketsa atau cetak biru untuk kerangka suatu desain web dan juga bisa untuk desain mobile. Bagi para developer di anjurkan untuk membuat wireframe terlebih dahulu sebelum membuat desain laman web nya. wirefram itu sketsa kan jadi dibuatnya hanya berkomposisi garis-garis hitam . dan wireframe tersebut harus berdasarkan web yang akan dibuat seperti penaam header yang berisi navigasi mulai dari navigasi home, about dan sebagainya harus mengikuti rancangan web yang akan dibuat. wireframe dapat dibuat secara manual menggunakan pensi maupun pulpen maupun dapat dibuat menggunakan software. tapi kalau saya sih seringnya makai software karena gambaran saya kurang bagus hehehe.
Fungsi dan Kegunaan Wireframe?

  • Memudahkan developer dalam membuat dan merealisasikan desain yang ingin dibuat dan diwujudkan.
  • bagi client atau si pemesan web sebagai konsultasi dari web yang akan dibuat dan dikerjakan oleh si developer.
  • Menerjemahakn dan menganalisis sistem yang diperlukan dari fungsioalitas, usebility, compability, responsibility, kenukian dan kesitimewaan dari desain web maupun mobile yang akan dibuat.
Cara membuatnya gimana?

  • Baik cara membuatnya mudah bial menggunkan software. software yang saya sering gunakan yaitu balsamiq dan wireframe sketcher tapi dari kedua software tersebut yang paling mudah dan banyak library nya ya wireframe sketcher  bisa di download Disini dan langsung menginstalnya. Dan keunggulan dari wireframe sketcher yaitu mendukung multi platform dapat berjalan dibanyak operating system mulai dari windows, mac os, linux dan kawan-kawannya. yan langsung saja ke tutorial disini saya akan memberikan dua tutorial yaitu pertama membuat wireframe mobile dan yang kedua tutorial membuat wireframe website.
Tutorial 1 membuat wireframe mobile android menggunkan wireframe sketcher
  • Buka wireframesketcher anda
  • Kemudian pilih file new->wireframeproject
  • Lalu isikan nama project
  • Setelah itu pilih android
  • kemudian klik finish
  • Kemudian pilih container di dalam library 
  •  Kemudian pilih group untuk dijadikan bingkai android
  • setelah itu pilih 2 text field di bagian  text
  • drag dan jadikan seperti form login
  • Setelah itu tinggal button submit di bagian assets android
zlearn.id
Tutorial 1 membuat wireframe web menggunkan wireframe sketcher
  • Buka wireframesketcher anda
  • Kemudian pilih file new->wireframeproject
  • Lalu isikan nama project
  • Setelah itu pilih Twitter Bootraps
  • kemudian klik finish 
Maka tampilannya akan langsung default seperti ini:
by zlearn  Tutorial dan Informasi Terbaik


Sekian tutorila dari zlearn semoga dapt bermanfaat dan membantu para developer untuk mempermudakh mengembangkan web dan mobile android.

Share this

Related Posts

Previous
Next Post »

Berita Unik

loading...