Cara Mendesain untuk Web Menggunakan Pola Desain

Pola desain adalah dasar dari kegunaan situs web yang baik, dan itu adalah bagian dari situs web yang dibangun. Itu adalah keputusan desain strategis yang dibuat oleh desainer web untuk memastikan pengalaman pengguna yang baik. Tugas desainer adalah memecahkan masalah kegunaan umum dan menciptakan solusi yang paling intuitif bagi pengguna, dan pola menciptakan pengalaman pengguna yang dapat diprediksi, intuitif, dan optimal. Apakah Anda baru dalam desain atau pro berpengalaman, Anda harus tetap mengetahui pola desain UI yang umum dan mengikuti perkembangan pola.

Contoh Pola Desain

Anda mungkin pernah mendengar tentang komponen; hal-hal seperti tombol, bidang formulir, bilah pencarian, dll. adalah contohnya. Untuk menggunakannya, Anda dapat memanfaatkannya dengan baik dengan membuat pola dalam desain Anda.

Satu hal yang harus diperhatikan: terkadang istilah "komponen" dan "pola desain" digunakan secara bergantian. Untuk tujuan artikel ini, komponen adalah blok penyusun situs web, dan pola adalah cara yang digunakan pengguna untuk melakukan tugas.

Seperti yang akan Anda lihat, sebuah pola "lebih besar" daripada hanya satu komponen. Pola adalah cara Anda mengoptimalkan apa yang dilakukan dengan masing-masing komponen. Ada banyak pola desain tradisional, seperti:

• Logo yang tertaut ke beranda di header situs web
• Navigasi hamburger di situs web seluler
• Formulir login dengan tautan "Reset kata sandi".
• Remah roti yang memungkinkan pengguna melacak lokasi mereka di situs
• Gerobak dengan penghitung barang di atasnya

Mengapa Desainer Harus Fokus pada Pola Desain?

Ada banyak keuntungan menggunakan pola desain. Tidak hanya membuat pekerjaan Anda lebih efisien sebagai desainer, tetapi yang lebih penting, pola membuat pengalaman lebih mudah bagi pengguna Anda.

Pola Desain Membangun Kepercayaan

Pengguna membuat asumsi cepat saat mereka tiba di situs Anda. Dalam sepersekian detik, mereka menentukan apakah perlu berinteraksi dengan konten atau apakah mereka harus mencari opsi lain.

Apakah situs Anda mudah dinavigasi? Apakah mudah menemukan informasi yang dicari pengguna Anda? Mereka tidak akan memiliki kesabaran untuk mengklik dan memecahkan masalah. Sangat penting untuk membuat kesan pertama yang baik dan membangun kepercayaan dengan pengguna Anda.

Dalam apa yang menjadi sejarah web, pola tertentu telah menjadi hal yang biasa. Desainer mengandalkan elemen antarmuka pengguna yang mapan ini untuk mendesain situs web, dan pengguna telah terbiasa melihat pola desain ini. Mereka mengenali kesamaan antara situs dan memercayai apa yang familiar.

Mari kita ambil contoh pola desain yang sudah mapan di situs eCommerce. Pengguna terbiasa melihat pratinjau produk kecil di kisi dan kemudian mengklik untuk mempelajari lebih lanjut tentang masing-masing item. Dengan menggunakan pola yang sudah ada dalam desain Anda dan menciptakan pengalaman yang mudah digunakan, Anda membangun kepercayaan dengan pengguna Anda, plus kemungkinan besar mereka akan menjadi pengunjung yang kembali.

Pola Desain itu Intuitif

Saat pengguna berinteraksi dengan situs Anda, faktor prediktabilitas menjadi sangat penting. [twitter_link]Pola yang dapat diprediksi memungkinkan pengalaman yang paling intuitif.[/twitter_link] Memiliki pola yang familiar adalah kuncinya, tetapi memastikan pola tersebut digunakan secara konsisten juga penting.

Salah satu contoh pola yang umum dan dapat diprediksi ditemukan pada formulir. Secara khusus bahwa semua formulir menyediakan pesan validasi dan kesalahan. Apakah semua formulir di situs Anda melakukan ini secara konsisten? Apakah semua pesan di tempat yang sama? Bagaimana dengan tombol submit? Apakah ada pesan yang menunjukkan bahwa formulir telah dikirim?

Dari perspektif desain, pengguna telah menemukan pola ini berkali-kali sebelumnya. Memberikan validasi formulir dengan perpesanan yang membantu menunjukkan kepada pengguna di mana ada masalah, dan memiliki pesan yang menunjukkan bahwa formulir telah dikirim adalah indikator yang membantu bahwa tindakan telah dilakukan.

Mungkin terdengar masuk akal ketika Anda mendengar bahwa pola dan prediktabilitas diperlukan untuk pengalaman pengguna yang baik. Namun, tidak terlalu sulit menemukan situs yang melanggar pola umum, yang dapat menyebabkan frustrasi atau kebingungan. Dengan mengingat hal itu, teruslah mendesain dengan pola UI yang bermanfaat. Semakin banyak pengguna mengenal mereka, semakin mereka tahu perilaku apa yang diharapkan. Pola dan konvensi membuat pengguna tidak bingung, dan berpegang teguh pada pola menciptakan pengalaman yang dapat diprediksi.

Pola Desain Menyediakan Bahasa Umum Antara Desainer

[twitter_link]Pengalaman hebat dimulai dengan desain yang efektif.[/twitter_link]

Dalam banyak kasus, desainer bekerja dalam sebuah tim. Ini membantu tim bekerja lebih efisien ketika ada pola desain yang mapan. Tidak perlu menemukan kembali roda jika masalahnya sudah dipecahkan.

Menjaga semua pola dalam satu panduan gaya front-end pusat adalah tempat yang bagus untuk menyimpan inventaris. Sebagai sumber daya global, ini adalah panduan cepat bagi semua anggota tim untuk memahami kasus penggunaan setiap pola. Bahkan jika Anda bekerja sendirian, melacak pola desain yang Anda gunakan akan memungkinkan Anda bekerja lebih efisien dan melihatnya kembali di masa mendatang.

Tahap Perencanaan

Cukup jelas mengapa pola desain harus digunakan, tetapi bagaimana desainer web benar-benar menerapkannya saat mendesain untuk web? Berikut adalah beberapa tip yang membantu mempermudah proses desain.

Gunakan Apa yang Sudah Anda Ketahui untuk Memulai

Jika Anda merancang desain ulang lengkap atau "perluasan" situs, akan sangat membantu jika Anda melakukan inventarisasi dan melihat apa yang sudah Anda ketahui. Mendapatkan titik awal yang baik adalah kuncinya. Jika ini adalah proyek yang sama sekali baru, penting untuk memikirkan hal-hal ini dan mengharapkan beberapa pertanyaan tidak diketahui pada awalnya. Untuk situasi ini, menggunakan pengalaman desain sebelumnya untuk memulai adalah langkah awal yang baik. Ini menginformasikan keputusan awal karena mereka telah mengerjakan proyek lain.

Riset Awal

Penelitian adalah kunci fondasi proyek yang kuat. Seperti yang Anda ketahui, pengguna akan selalu mencari cara termudah untuk melakukan tindakan tertentu di situs web. Memahami masalah dan tugas yang ada akan memastikan Anda merancang hal yang benar. Untuk memulai, pikirkan tentang hal-hal ini:

• Siapa pengguna saat ini? (Tujuan mereka, demografis, dll.)
• Apa lagi yang ingin Anda pelajari tentang pengguna ini?
• Pola apa yang paling sering berinteraksi dengan mereka?
• Apakah ada pola yang bermasalah dengan pengguna ini?
• Perbaikan apa yang bisa dilakukan?
• Fitur baru apa yang sedang dirancang?
• Bisakah pola yang ada saat ini berfungsi?

Fase penelitian adalah waktu untuk mengidentifikasi apa yang perlu dicapai pengguna Anda saat berinteraksi dengan situs web Anda. Contohnya adalah hal-hal seperti mencari konten, mendaftar ke buletin, melakukan pembelian, dll. Dihadapkan dengan elemen yang sudah dikenal, pengguna akan membutuhkan lebih sedikit waktu untuk berpikir dan memiliki lebih banyak alasan untuk berkonversi. Pertahankan fokus desain pada pembuatan pola dengan cara yang terasa familier bagi pengguna Anda berdasarkan pengetahuan yang ada dari apa yang mereka alami di web.

Saat memecahkan masalah desain, waktu dan anggaran selalu menjadi faktor, tetapi lakukan riset sebanyak mungkin. Inilah waktu Anda untuk mengungkap poin masalah utama pengguna Anda dan mempelajari pola desain yang ada. Apa yang umum di web? Pola apa yang telah Anda gunakan dengan sukses di masa lalu? Setelah Anda menentukan masalah yang perlu Anda selesaikan, jelajahi situs dengan pola yang menargetkan sasaran pengguna yang sama. Itu akan menjadi inspirasi yang baik untuk proyek tersebut. Tidak perlu untuk "menyalin" mereka, tetapi sangat membantu untuk mencatat apa yang ada di luar sana.

Sampai saat ini, saya merekomendasikan Anda untuk tetap konsisten dan dapat diprediksi. Perlu disebutkan bahwa pola yang ada dapat dimodifikasi dan mungkin ada kasus untuk melakukan sesuatu yang baru. Pastikan saja jika Anda memperkenalkan pola baru, itu dibenarkan oleh data pengguna dan teruji dengan baik.

Merancang untuk Web dengan Pola Desain

Prototipe dan Pengujian

Setelah fase penelitian, saatnya untuk mulai menggunakan apa yang telah Anda pelajari dengan baik. Di sinilah desain menjadi hidup dengan prototyping. Bergantung pada proses Anda, prototipe dapat berupa wireframe sederhana dengan fidelitas rendah atau desain fidelitas tinggi yang lebih kompleks.

Mulailah dengan pola yang ada dari penelitian Anda sebagai garis dasar. Saat Anda menjalani proses, pastikan prototipe mencakup semua fitur yang Anda perlukan dan memperhitungkan semua sasaran pengguna. Diperlukan sedikit revisi dan penyempurnaan untuk mencapai titik awal yang baik.

Setelah Anda yakin bahwa semua persyaratan disertakan dalam prototipe, saatnya melakukan beberapa pengujian untuk mendapatkan wawasan tentang kegunaan desain. Di sinilah Anda akan memvalidasi keefektifan pola desain bersama dengan fungsionalitas keseluruhan.

Alasan pengujian sangat penting dalam fase prototipe adalah karena dalam beberapa kasus, klien tidak dapat mengartikulasikan atau sepenuhnya memprediksi pemikiran dan kebutuhan mereka. Pengujian pengguna memungkinkan mereka untuk menunjukkan alih-alih memberi tahu. Peserta mendemonstrasikan bagaimana mereka sebenarnya menggunakan situs, sementara Anda mengamati dan belajar dari tindakan mereka. Ini berguna untuk peserta dan Anda sebagai desainer.

Penting untuk mencatat tujuan inti pengguna saat Anda melakukan pengujian, agar tetap fokus. Setelah Anda mengundang peserta tes, tampilkan desain di depan sebanyak mungkin pengguna. Jika batasan waktu terbatas, pastikan Anda menguji dengan setidaknya lima pengguna.

Subjek pengujian pengguna adalah keseluruhan topik itu sendiri. Pilih metode apa pun yang paling masuk akal berdasarkan waktu dan anggaran Anda. Akan sangat bagus untuk selalu memiliki waktu yang cukup, tetapi ini tidak selalu memungkinkan. Dalam keadaan darurat, tes kegunaan "lorong" atau "gaya kafetaria" dapat berguna (tes kegunaan yang dipasang di area lalu lintas pejalan kaki yang tinggi, memanfaatkan orang yang lewat untuk menguji produk Anda). Bahkan melibatkan beberapa rekan kerja selalu lebih baik daripada tidak ada pengujian.

Kemungkinannya, pola desain Anda tidak akan sempurna di luar gerbang. Perubahan perlu dilakukan dan lebih banyak pengujian akan diperlukan untuk memvalidasi desain yang diperbarui. Namun, Anda akan mendapatkan lebih banyak wawasan dari setiap fase pengujian, dan dapat menggabungkan apa yang telah Anda pelajari untuk melanjutkan iterasi dan pengujian hingga desain dioptimalkan.

Pola desain web memastikan pengalaman pengguna yang konsisten. Di bawah ini adalah tautan bermanfaat yang memberikan lebih banyak informasi untuk memulai:

• Panduan Komprehensif untuk Pengujian Pengguna
• Bedah Roket Steve Krug Menjadi Mudah
• Contoh Panduan Gaya