PENGGUNAAN WIREFRAME UNTUK MEMBUAT DESAIN


Jasa Web Design


Didalam proses pembuatan website ada beberapa tahap yang akan dilewati dalam pengerjaannya. Dalam tahap-tahap awal pengembangan ini kita akan bertemu dengan banyak client membahas apa maunya pihak client dengan web tersebut. Membahas fitur, content, image, tampilan dan sebagainya. Setelah client menjelaskan apa yang mereka inginkan dengan web tersebut dan kita akomodasikan maka selanjutnya giliran kita menuangkan apa yang diinginkan client dalam layout halaman websitenya. Apakah dalam tahap ini kita akan langsung menuangkannya dalam bentuk visual design? Membuka photoshop dan membuat desain lengkap dengan warna, tekstur, font, image, dan elemen desain lainnya. Tentu saja tidak, sebelum masuk ke tahap visual design kita perlu menuangkan apa yang diinginkan client ke dalam bentuk wireframe terlebih dahulu sebagai tahap awal.

Apa itu Wireframe?

Wireframe adalah rancangan awal sebuah desain web yang dibuat secara manual menggunakan photoshop atau software pengedit gambar lainnya. Secara garis besar di dalam wireframe ini kita menempatkan elemen-elemen penting dari halaman web tersebut pada posisinya masing-masing seperti banner, body content, menu link, kolom, footer maupun fitur-fitur lainnya yang ada dalam web nantinya. Secara visual tampilan dari wireframe ini hanya terdiri dari kotak dan garis yang menandakan posisi dari masing-masing elemen dari layout halaman web. 

Terdapat banyak variasi dalam proses desain sebagaimana banyaknya desainer saat ini, jadi tidak ada satu cara yang pasti dalam penggunaan wireframe. Semua desainer memiliki cara dan prosesnya sendiri. Beberapa desainer menggunakan proses yang lebih panjang, sedangkan yang lainnya menggunakan cara yang lebih singkat misalnya dengan membuat sketsa dikertas lalu mengimpelementasikannya di kode HTML.

Semua boleh-boleh saja asalkan hasilnya tetap sesuai dengan kebutuhan client. Namun apabila kita ringkas menjadi beberapa proses, maka kita dapat menunjukkan cara yang terbaik untuk menggunakan wireframe pada situasi yang berbeda-beda.

Berikut adalah beberapa penggunaan wireframe untuk membuat desain yang sering dilakukan oleh desainer saat ini dalam mengerjakan proyek yang dikerjakannya.

Traditional Process (Wireframe > Mockup > Prototype)

Pada proses tradisional ini, wireframe awalnya berawal dari proses yang mengingatkan pada waterfall design method. Pada proses ini, ketetapan dan funsionalitas meningkat secara liner pada fasenya.



Proses ini bergantung pada spesialisasi masing-masing fase: Fase wireframing mengkhususkan diri dalam menguraikan dan meresmikan sebuah gambar besar, Fase mockup dikhususkan pada rincian visual dan fase prototipe menjadi tulang punggungnya. Sebagai dokumen pemersatu, dia menyediakan pondasi yang dibangun pada mockup dan prototipe. 

Jika anda stalk pada metode waterfall, anda masih bisa menggunakan kertas . Photoshop dan alat wireframing. Namun tidak terlalu banyak menghabiskan waktu karena perubahan dapat terjadi ketika anda tidak memprediksi hal tersebut.

Rapid Prototyping (Wireframe > Prototype)

Hasil dasi strategi desain Agile, Rapid prototipe meninggalkan metode tradisional dalam membangun sebuah produk sampai dengan selesai dan bukannya membangun beberapa (multiple) tapi membangun dengan lebih simple dan minimun dengan untuk pengujian secara lebih cepat.

Meskipun klaim yang bertentangan, namun wireframe membuat rapid prototyping lebih efektif, karena sifat dari membangun secara cepat, pengujian, dan membangun ulang prototipe, sebuah wireframe interaktif bekerja lebih baik dalam hal ini dari pada prototipe tradisional.

Wireframe interaktif lebih cepat dan lebih mudah untuk dibuat, namun masih akan menghasilkan penggunaan data yang sama dari pengujian. Mereka sangat mudah untuk dibuat dalam faktanya, anda bisa membuat dan menguji beberapa secara bersamaan.

Early Coding (Wireframe > Kode Prototipe)

Sebagai alternatif lain, anda bisa menggunakan metode Early Coding dari wireframe menjadi sebuah kode prototipe tahap awal. Metode ini bekerja paling baik untuk proyrk-proyek dengan persyaratan teknis yang unik dimana perlu untuk mempertimbangkan koding sesegara mungkin, cara ini juga direkomendasikan oleh para desainer yang merasa percaya diri dengan kemampuan koding mereka.

Apapun alasannya wireframe masih berfungsi sebagai pedoman sebagai visual yang bermanfaat sebelum melakukan prototipe HTML. Dalam kebanyakan kasus, wireframe merupakan satu-satunya blueprint yang dipilih untuk dibuat desainnya dan apapun yang tertinggal/terlewatkan akan dilengkapi pada saat pengembangan yang sebenarnya, dimana ini juga sering kali terjadi masalah, kecuali anda sangat mahir pada kode.

Demikian yang dapat kami sampaikan seputar penggunaan wireframe untuk membuat desain yang dapat dilakukan oleh web desainer. Semua jenis proses diatas dapat anda pilih mana yang paling anda sukai dan mana yang paling mudah untuk anda gunakan, hasil merupakan hal yang sangat penting. Selagi hasilnya sama, dan itu memudahkan pekerjaan maka cara apapun dapat anda pilih.

Disini kami juga ingin menawarkaN jasa web design yang telah ditangani oleh tenaga kerja yang ahli serta profesional sehingga tidak mengewakan hasil web seperti yang anda inginkan.

Semoga bermanfaat dan Terimakasih ...