Apa itu Wireframe?

Wireframe adalah sebuah kerangka untuk menata suatu item di situs web atau aplikasi lawan. Wireframe memungkinkan seorang pengembang dengan mudah mengerjakan struktur pengembangan dan arah dari situs web atau aplikasi yang dibangun. Pada browser sendiri, sering menemukan tampilan situs web atau aplikasi yang indah dan menarik. Gambar rangka itulah yang dikenal sebagai skema halaman yang merupakan panduan visual yang mewakili kerangka tampilan aplikasi. Wireframe dibuat dengan tujuan mengatur elemen dan mencapai tujuan tertentu. Tujuan tersebut diinformasikan sebagai bisnis dan ide kreatif.

Seperti Apa Bentuk dari Wireframe ?

1. Wireframe biasanya berwarna hitam dan putih atau skala abu-abu.
2. Teks Lorem ipsum biasa digunakan sebagai pengganti.
3. Daripada menampilkan gambar, menggunakan kotak sederhana dengan tanda "x" akan menyelesaikan pekerjaan tersebut.

Alat Wireframe

Untuk membuat wireframe, kenali beberapa tools yang bisa dimanfaatkan seperti memakai software /aplikasi atau menggambar secara manual pada kertas putih kosong. Menggambar di kertas putih kosong memungkinkan desainer untuk dapat mengerjakan sebuah wireframe dengan mudah dan cepat. Jika menggunakan tools software/aplikasi ada beberapa yang direkomendasikan seperti Figma, Zeppelin, Cacoo, Jumpchart, Gliffy, Adobe Illustrator dan Mockflow Whimsical.

Apa Itu Prototyping?

Prototype adalah gambaran awal dari sebuah ide atau desain yang digunakan untuk mendapatkan tanggapan dari pengguna. Tujuan dari prototipe adalah untuk menguji aliran solusi desain dan mengumpulkan umpan balik pengguna baik dari pihak internal dan eksternal sebelum melanjutkan untuk membangun produk akhir. Sebuah prototipe dikatakan berhasil jika tim desain telah merevisi desain secara interaktif berdasarkan umpan balik dari pengguna.

Manfaat Prototipe

Berikut adalah manfaatnya :

1. Dapat menghemat waktu dan biaya pengembangan produk

Dapat menekan biaya dan menghemat waktu dalam proses pengembangan produk. Dengan demikian, sumber daya yang tersisa dapat dipilih untuk kebutuhan lain.

2. Dapat Mengetahui Kebutuhan Pengguna Terlebih Dahulu

Memanfaatkan sistem prototyping dapat mengetahui kebutuhan pengguna terlebih dahulu. Dengan begitu proses pengembangan produk akan berlangsung lebih cepat.

3. Menjadi acuan untuk mengembangkan produk

Model prototype dapat menjadi acuan atau patokan dalam mengembangkan sebuah produk. Selain itu, dapat menemukan kekurangan dan mencari solusi untuk membuat produk menjadi lebih baik lagi.

4. Dapat menjadi bahan presentasi

Menggunakan prototipe untuk merepresentasikan produk yang akan diluncurkan. Sehingga memudahkan audiens mendapatkan gambaran tentang produk yang akan diluncurkan.

Perbedaan Wireframe dan Prototyping

Pada dasarnya, desainer UI/UX membuat berbagai contoh konsep desain tidak hanya menggunakan wireframe. Seperti yang sudah dijelaskan sebelumnya, wireframe merupakan blue print dari sebuah arsitektur. Konsep wireframe hanya bertujuan untuk menyampaikan tata letak, tata letak, navigasi, struktur dan organisasi konten. Wireframe biasanya hanya bergambar hitam putih saja dan tekanan pada isi dari konten yang akan dibuat.

Sedangkan prototype merupakan konsep clickable yang sudah dapat merespons berbagai perintah. Prototipe lebih mengarahkan interaksi pengguna dengan antarmuka. Konsep ini memungkinkan desainer untuk menguji perjalanan pengguna dan menemukan berbagai masalah yang ada pada produk.

Selain itu, wireframe memiliki fidelitas rendah yang memerlukan waktu lebih sedikit, memanfaatkan placeholder dan fokus pada keseluruhan struktur dan menjadi alat untuk mendapatkan persetujuan dari pemangku kepentingan.

Sedangkan prototipe memiliki fidelitas tinggi yang memerlukan waktu lebih lama, memanfaatkan desain yang sebenarnya dan memungkinkan menguji pengalaman pengguna dan mendapatkan umpan balik dari interaksi pengguna.

Penutup

Wireframe dan prototype merupakan konsep arsitektur yang memiliki ciri khas dan fungsi masing-masing. Desainer dapat menyesuaikan setiap kebutuhan yang diinginkan. Namun perlu diingat bahwa pengguna dari kedua konsep tersebut harus didasarkan pada pemikiran pengguna.