Panduan Dasar Untuk Menentukan Desain Website

Panduan Dasar Untuk Menentukan Desain Website – Membuat web website semakin kompleks serta umumnya bukan profesi satu orang. Berarti untuk menentukan jika konsep tidak berubah- ubah serta dimaksimalkan buat penuhi tujuan bidang usaha serta menghasilkan pengalaman yang mengasyikkan untuk konsumen.

inowweb

Panduan Dasar Untuk Menentukan Desain Website

 

inowweb – Salah satu metode buat membenarkan kalau regu terletak di laman yang serupa kala mengonsep bagian web website yang terpisah ataupun menaruh konsep dari developer merupakan dengan membuat pemilihan konsep ataupun bimbingan style konsep website.

Sangat bermanfaat untuk memiliki panduan gaya untuk menciptakan pengalaman yang kohesif di antara halaman yang berbeda. Juga membantu untuk memastikan bahwa pengembangan masa depan atau produksi pihak ketiga akan mengikuti pedoman merek dan akan dianggap sebagai bagian dari merek secara keseluruhan.

Luke Clum telah menyentuh permukaan menggunakan panduan gaya sebagai langkah pertama Anda dalam desain web tahun lalu dan saya ingin melihat lebih mendalam tentang cara membuat panduan gaya desain web yang dapat digunakan untuk proyek Anda.

Baca Juga : Bagaimana Pengembang Web Dapat Membantu Bisnis Restoran

Apa itu Panduan Gaya?

Panduan gaya adalah kumpulan elemen pra-desain, grafik, dan aturan yang harus diikuti oleh desainer atau pengembang untuk memastikan bahwa bagian situs web yang terpisah akan konsisten dan pada akhirnya akan menciptakan pengalaman yang kohesif.

Mengapa Penting?

Ini amat berarti kala banyak pendesain bertugas di web website ataupun aplikasi website besar buat membenarkan kalau mereka tidak memaknakan sangat banyak serta tidak mengganti ataupun membiasakan style bersumber pada preferensi individu.

Dalam pengembangan, memiliki elemen situs web yang ditentukan memudahkan pengembang untuk menggunakan kembali elemen-elemen ini. Selain itu, ini dapat mempermudah karena mereka akan mendapatkan elemen apa yang harus mereka kodekan dan akan melihat dengan tepat bagaimana tampilannya dari awal.

Untuk membuat hidup pengembang lebih mudah, adalah tugas perancang untuk memasukkan semua kemungkinan interaksi seperti mengarahkan kursor, mengklik, mengunjungi, dan status lainnya untuk tombol, judul, tautan, dll.

Membuat Panduan Gaya Desain Web

1. Pelajari Mereknya

Pertama, Anda perlu mempelajari merek sehingga Anda memahami apa artinya. Kenali cerita di balik merek, amati tim, dan cari tahu visi, misi, dan nilai perusahaan. Penting untuk menggali lebih dalam merek sehingga panduan gaya yang Anda hasilkan akan mewakili organisasi secara visual dan emosional.

Jika Anda seorang desainer yang tidak bisa membuat kode, cukup buka Photoshop dan beri judul dan deskripsi singkat dokumen Anda tentang apa dokumen itu dan untuk apa.

Jika Anda dapat membuat kode, lebih baik membuat dokumen html dengan aset yang telah dikodekan sebelumnya sehingga dapat dengan mudah digunakan kembali.

2. Definisikan Tipografi

Menurut Oliver Reichenstein , tipografi adalah 95 persen dari desain web. Anda harus mendapatkan tipografi yang benar karena ini adalah salah satu alat komunikasi terpenting antara pengunjung dan situs web Anda.

Tetapkan hierarki dan identifikasi. Ada jenis judul: h1, h2, h3, h4, h5 dan h6. Kemudian body copy, variasi bold dan italic. Pikirkan tentang salinan khusus yang akan digunakan untuk tautan yang lebih kecil, teks pengantar, dan sebagainya. Berikan keluarga font, berat dan warna.

3. Palet Warna

Sungguh luar biasa bagaimana manusia memandang warna dan mengasosiasikan warna dengan merek terkenal. Pikirkan Coca-Cola, saya yakin Anda melihat warna merah itu sekarang.

Mulailah dengan menetapkan warna primer untuk panduan gaya Anda yang akan mendominasi situs web Anda, warna dominan harus mencakup tidak lebih dari tiga warna. Namun, dalam beberapa kasus, Anda memerlukan warna sekunder dan bahkan tersier untuk mengilustrasikan antarmuka pengguna Anda, pastikan Anda juga mendefinisikannya. Sertakan juga warna-warna netral seperti putih, abu-abu, dan hitam agar warna merek utama terlihat menonjol.

4. Suara

Suara yang saya maksud adalah salinan yang sebenarnya. Anda telah mempelajari merek sebelum memulai panduan gaya dan menemukan bahwa merek itu muda dan trendi. Jika tidak ada petunjuk untuk suara salinan, Anda harus menentukannya.

Ini bisa menjadi contoh sederhana yang menunjukkan bahwa suara harus profesional namun lucu dan ramah. Alih-alih menyatakan “Anda mendapatkan kesalahan 404”, Anda dapat mengatakan “Ya ampun, Anda telah merusak jalinan. 404 kesalahan.” Jika suaranya lebih korporat, Anda tidak akan melakukan itu. Kecemerlangan bersembunyi dalam hal-hal kecil.

5. Ikonografi

Ikon telah ada selama ribuan tahun dan lebih tua dari teks dan kata-kata. Manfaatkan penggunaan ikon dalam proyek Anda karena ikon tersebut akan memberikan ide instan kepada pengunjung tentang apa yang sedang terjadi dan apa yang akan terjadi selanjutnya. Memilih ikon yang tepat akan memberikan lebih banyak konteks pada konten daripada palet warna, salinan, atau grafik.

Disaat memakai simbol, yakinkan buat mempertimbangkan audiens sasaran, agama, asal usul, alhasil Kamu menjauhi kesalahpahaman serta kesalahpahaman. Satu perihal lagi, pikirkan mengenai merk serta nilainya alhasil Kamu tidak memakai simbol yang digambar tangan di web website perbankan besar.

6. Pencitraan

Gambar berbicara ribuan kata. Pastikan untuk menyertakan citra yang mendefinisikan gaya dan arah gambar yang harus digunakan situs web. Sekali lagi, pikirkan tentang nilai merek dan misinya. Misalnya, badan amal air menggunakan citra mencolok yang memiliki emosi yang kuat, tujuan yang baik dan panggilan emosi manusia agar mereka beruntung memiliki komoditas hidup yang penting seperti air, makanan, listrik dan pendidikan.

7. Formulir

Formulir adalah apa yang membuat situs web atau aplikasi web Anda interaktif dan dinamis sehingga pengguna dapat memasukkan data dan kemudian Anda dapat memanipulasinya dan melakukan pekerjaannya.

Pastikan untuk membuat hierarki dan sertakan kemungkinan umpan balik dari formulir — aktif, arahkan kursor, tambahkan pesan kesalahan, peringatan, dan pesan sukses termasuk hal-hal seperti kata sandi yang terlalu lemah, email yang tidak valid atau pesan sukses yang sederhana, misalnya “email telah terkirim.”

8. Tombol

Tombol adalah campuran palet warna, bentuk dan suara. Andalkan aset yang dibuat sebelumnya ini untuk membuat tombol yang terlihat konsisten dan fungsional dengan desain yang berbeda.

9. Spasi

Bagaimana cara mengatur jarak dalam panduan gaya? Sangat penting untuk menyebutkan jarak. Itu bisa dalam bentuk kotak yang digunakan untuk tata letak; itu bisa berupa jarak yang ditentukan antara judul, tombol, gambar, formulir, dan elemen lainnya.

Memperoleh jarak yang pas merupakan berarti sebab membagikan lebih banyak ruang bernapas buat bagian, serta pemakaian yang tidak berubah- ubah membuat profesi Kamu nampak tertata serta handal.

10. Anjuran dan Larangan

Last but not least: Jadikan bagian DO dan DON’Ts seperti FAQ yang menunjukkan jebakan paling umum dan berikan contoh bagaimana hal-hal seharusnya terlihat dan berfungsi.

Berikut adalah beberapa contoh panduan gaya terbaik untuk digunakan sebagai inspirasi saat membuat panduan gaya Anda sendiri. Ingatlah bahwa panduan ini sangat dipengaruhi oleh pengaturan organisasi, visi, misi dan nilai-nilai mereka dan beberapa keputusan mungkin tidak relevan atau tidak logis dalam kaitannya dengan apa yang Anda lakukan, jadi jangan membabi buta mengikuti hal-hal yang dilakukan di sana.