Microsoft Visio dapat digunakan untuk membuat berbagai jenis desain GUI.
Microsoft Visio 2010 adalah alat desain grafis yang dapat digunakan untuk membuat diagram, elemen antarmuka, menu navigasi, dan objek visual lainnya. Ini menawarkan berbagai alat untuk membuat desain antarmuka pengguna grafis (GUI). Diagram akan menunjukkan bagaimana aplikasi atau antarmuka Web akan muncul dalam bentuk akhirnya. Mengembangkan GUI di Visio tidak terlalu sulit, dan desain dapat diekspor sebagai file PDF. Ikuti beberapa panduan untuk mempelajari cara membuat mockup wire-frame GUI dasar untuk situs web.
Langkah 1
Buka Microsoft Visio. Buat gambar baru dengan mengklik ikon gambar kosong. Klik tombol "Buat".
Video Hari Ini
Langkah 2
Klik jendela Shapes di sisi kiri layar. Pilih "Bentuk Lainnya." Pilih "Bentuk Dasar US unit." Klik "Bentuk Cepat."
Langkah 3
Buat kotak heading dengan mengklik kanan pada bentuk kotak persegi panjang dan menyeret bentuknya ke area gambar. Ubah ukuran kotak untuk menutupi sekitar 15 persen dari area atas gambar.
Langkah 4
Buat kotak menu navigasi dengan mengklik kanan pada bentuk kotak persegi panjang dan menyeret bentuk di bawah kotak header. Ubah ukuran kotak agar memiliki tinggi sekitar setengah inci dan lebar yang sama dengan kotak header.
Langkah 5
Buat kotak tubuh utama yang besar dengan mengklik kanan pada bentuk kotak persegi panjang dan menyeretnya ke bawah kotak menu navigasi. Ubah ukuran kotak agar memiliki lebar yang sama dengan header dan kotak menu navigasi dan untuk menutupi bagian bawah area gambar.
Langkah 6
Buat dua kotak persegi panjang dengan mengklik kanan pada bentuk kotak persegi panjang dan menyeret bentuk ke area gambar dua kali. Ubah ukuran setiap kotak agar sesuai dengan setengah dari kotak tubuh utama. Pindahkan setiap kotak agar pas berdekatan satu sama lain di dalam kotak tubuh utama.
Langkah 7
Buat bidang teks yang mewakili tautan navigasi dengan mengklik tombol "Teks" di bagian atas bilah navigasi. Pilih area di dalam kotak navigasi untuk membuat bidang teks kecil dengan mengklik tombol kiri mouse. Gerakkan mouse untuk mengubah ukuran bidang ke panjang yang diinginkan. Ketik teks untuk mengatakan "Rumah".
Langkah 8
Buat empat bidang teks lagi dengan menggunakan tombol kiri mouse. Ketik "Item Menu" di setiap kotak. Ubah ukuran setiap kotak agar sesuai dengan ukuran kotak "Beranda".
Langkah 9
Pilih area di dalam kotak header utama dan buat bidang teks dengan deskripsi "Header Utama".
Langkah 10
Buat kotak teks di dalam setiap kotak yang terletak di dalam area kotak konten utama gambar. Berikan deskripsi pada setiap kotak teks, seperti "Area Konten". Ubah ukuran setiap kotak teks menjadi ukuran yang sama. Pilih tombol "Penunjuk" di menu navigasi atas.
Langkah 11
Simpan gambar dengan mengklik "File" dari menu navigasi atas dan pilih "Save as."
Tip
Meskipun Visio tidak dilengkapi dengan stensil atau objek prototipe GUI, perusahaan pihak ketiga memang menawarkan alat tersebut untuk diunduh. Jika Anda bermaksud menggunakan Visio untuk membuat desain kolaboratif, ingatlah bahwa format file gambar Visio tidak kompatibel dengan sebagian besar paket perangkat lunak menggambar.
Peringatan
Gambar yang terlalu rumit dapat menyebabkan Visio melambat dalam menyegarkan gambar setelah membuat perubahan.
