anyakan desainer mana pun dan mereka akan memberi tahu Anda bahwa fase brainstorming dan konsep adalah bagian terpenting dari proses desain. Setiap desain hebat dimulai dengan sebuah ide, dan ini berlaku tidak hanya untuk logo atau desain ilustrasi tetapi juga untuk desain web.
Apakah produk akhir Anda adalah dokumen Photoshop atau HTML dan CSS, Anda harus selalu mulai dengan bingkai gambar – kerangka kerja visual yang menggambarkan tata letak konten, elemen antarmuka, dan sistem navigasi. Saat Anda mendemonstrasikan fungsionalitas desain Anda kepada klien, itu memberi mereka opsi untuk dipilih. Ini dapat menghemat waktu sebelum Anda berinvestasi dalam satu versi.
4 cara wireframe desain web berikut adalah beberapa teknik dan perangkat lunak terbaik yang tersedia untuk membantu Anda memulai proyek berikutnya.
Pensil dan Kertas
Tetap sekolah dulu. Terlepas dari semua kemajuan terbaru kami dalam teknologi, banyak desainer lebih suka memilah ide-ide mereka dengan sketsa kuno. Menggunakan pensil dan kertas, mudah untuk membuat layout yang memecahkan masalah organisasi dari setiap halaman.
Pro:
- Mempercepat
- Kesederhanaan
- Kreativitas
Cons:
- Sulit untuk mereproduksi / berbagi
- Orang mungkin berpikir Anda adalah “designosaur”
MockingBird
Aplikasi berbasis web yang mudah digunakan ini disebut MockingBird sangat bagus untuk membuat mockup situs web yang cepat dan fungsional. Ini memiliki antarmuka pengguna intuitif yang penuh dengan elemen web yang sudah dibuat sebelumnya dan memungkinkan Anda untuk menghubungkan halaman bersama. Selain itu, Anda dapat bekerja secara kolaboratif pada proyek dengan anggota tim Anda atau klien Anda.
Pro:
- Bekerja dari browser di mesin apa pun
- Kemampuan untuk menautkan halaman
- Mudah berkolaborasi
- GRATIS / terjangkau
Cons:
- Pilihan terbatas untuk mempercantik mock up Anda
- Untuk bekerja di lebih dari dua proyek, Anda perlu meningkatkan ke versi berbayar
SimpleDiagram
SimpleDiagram adalah, Anda dapat menebaknya, sangat sederhana! Mudah digunakan dan sangat menyenangkan.
Antarmuka seret dan jatuhkan membuat menempatkan maket dasar menjadi sebuah brease. Ada berbagai pilihan untuk gaya / latar belakang, dan mudah untuk menyimpan pekerjaan Anda sebagai .png sehingga Anda dapat mengirim email ke klien Anda atau mengunggahnya di 99designs. Meskipun program ini tidak memiliki fungsionalitas mendalam dari beberapa program pembingkaian kawat lainnya, program ini terlihat apik dan Anda pasti akan menikmati bermain-main dengannya.
Lihatlah mock up ini untuk desain web responsif yang saya lakukan dalam beberapa detik:
Pro:
- Menyenangkan!
- Kompatibel di semua sistem operasi Mac, Windows, Linux
- Gaya digambar tangan yang berseni
Cons:
- Fungsionalitas terbatas
- Dibutuhkan pembelian setelah percobaan
iMockups
Jika Anda cukup beruntung memiliki iPad, Anda mungkin ingin mencoba bertukar pikiran dan membuat konsep desain Anda dari kenyamanan sofa Anda dengan program intuitif yang disebut iMockups .
Fitur snap-to-grid memungkinkan penyelarasan piksel sempurna. Anda dapat dengan mudah berbagi file yang dapat diedit dengan klien Anda atau mengekspor ke format universal seperti .png atau .jpg.
Pro:
- Bekerja dari iPad Anda
- Fungsi snap-to-pixel
- Hasil profesional dengan antarmuka yang menyenangkan
Cons:
- Hanya tersedia untuk iPad
sumber:99designs.com
