Navigasi Utiliti Bagaimana Ia Mempengaruhi Reka Bentuk Pengalaman Pengguna

Untuk merancang navigasi yang berkesan dan mesra pengguna, kita bukan sahaja perlu memikirkan tentang bagaimana isi kandungan kami ke dalam menu yang berstruktur untuk membolehkan pengguna mudah mencari apa yang mereka mahu, tetapi juga bagaimana untuk reka bentuk alat yang mereka perlukan untuk berinteraksi dengan laman web ini

Navigasi yang tidak ketat berkaitan dengan kandungan, dan membantu pengguna melaksanakan tindakan yang berbeza dipanggil navigasi utiliti, dan ia adalah aspek yang kurang dibincangkan tetapi sangat penting dalam reka bentuk pengalaman pengguna. Cari bar, log masuk dan borang pendaftaran, melanggan, perkongsian dan butang cetak, kereta belanja, menu kontekstual, dan alat yang membolehkan pengguna untuk menukar bahasa atau saiz fon adalah contoh biasa navigasi utiliti.

Merekabentuknya tidak semudah yang kelihatan pada pandangan pertama, ia memerlukan pertimbangan untuk mengetahui unsur-unsur yang kita perlukan, di mana untuk meletakkan dan cara mempamerkannya untuk memastikan pelawat kami dapat dengan cepat mencari mereka dan memahami bagaimana mereka berfungsi.

Bagaimana Impak Navigasi Utiliti UX

Apabila kami merancang navigasi utiliti, kami perlu memutuskan bagaimana kami mahu pengguna kami berinteraksi dengan laman web kami. Kami perlu menyediakan mereka dengan struktur interaksi yang sesuai dengan matlamat perniagaan kami, membawa pengguna melalui perjalanan pelanggan, memberikan mereka pilihan yang mudah difahami, dan menyediakan mereka dengan pengalaman pengguna yang menyenangkan.

Pertama sekali, mereka perlu dapat dengan cepat melakukan tindakan yang mereka mahu. Jika kita membolehkan mereka berbuat demikian, kepuasan pelanggan akan berkembang, dan dengan senang hati pengguna cenderung menghabiskan lebih banyak masa dan lebih banyak wang di laman web.

Halaman rumah AirBnB mengikuti prinsip UX ini, dan menu utama hanya mengandungi alat utiliti. Ini bukan penyelesaian biasa, tetapi jika kita melihat kadar pertumbuhan yang luar biasa AirBnB, itu adalah pilihan yang sempurna untuk mereka.

Item 4 menu utama menargetkan 4 orang utama yang biasanya melawat laman web AirbnB: orang yang berminat menjadi tuan rumah (“Menjadi tuan rumah”), orang yang ingin menyelesaikan masalah yang berlaku ketika mereka menggunakan perkhidmatan tersebut (“Bantuan”), pengguna baru dan kembali (“Daftar” dan “Log masuk”). AirbnB's home-oriented utility home page juga mengandungi bar pencarian cepat yang merupakan alat penting di sebuah penginapan menyewa laman web.

Kedua, pengguna tidak memerlukan utiliti yang berlebihan, kerana terlalu banyak kekacauan mengganggu perhatian dan mengurangkan tumpuan. Alat apa yang diperlukan dalam navigasi utiliti kami dan apa yang tidak bergantung pada sifat laman web kami. Sebagai contoh, berguna untuk menyertakan cetakan Cetak di blog atau laman berita, tetapi ciri yang sama boleh menjadi gangguan yang tidak perlu di papan forum atau laman web media sosial.

Washington Post contohnya memaparkan navigasi utiliti pada halaman pos tunggalnya berbeza dari halaman utama. Dengan cara ini, pengguna hanya menemui alat utiliti yang relevan, dan tidak dicemari dengan pilihan yang mereka tidak mahu menggunakannya.

Terdapat 3 item navigasi utiliti yang boleh digunakan oleh pelawat menggunakan laman web. Ini disertakan dengan bijak dalam bar atas tetap (alat carian, “Masuk”, dan “Langgan”), tetapi pengguna tidak perlu memikirkan pilihan yang berkaitan dengan jawatan tunggal seperti “Senarai Membaca” apabila mereka melayari laman utama atau salah satu halaman kategori.

Ketiga, pengguna perlu memahami dengan cepat apa yang boleh mereka lakukan di laman web kami. Pelawat tidak semestinya tahu apa yang mereka mahu, jadi kami sentiasa perlu memberi mereka maklumat tentang pilihan yang mereka ada.

Sekiranya anda melihat tangkapan skrin di bawah, anda dapat melihat bahawa The New York Times memberitahu pengguna tentang ketersediaan 3 edisi yang berbeza: Amerika, Antarabangsa, dan Cina, dan juga membolehkan mereka untuk cepat beralih antara ketiga-tiga. Contoh hebat navigasi utiliti pintar ini menunjukkan pengguna kurang jelas pilihan mereka mungkin tidak akan mencari sendiri, dengan cara yang tidak menghalang dan elegan.

Cari Tempat Terbaik

Terdapat peletakan biasa untuk navigasi utiliti di mana pengguna secara intuitif mencari alat-alat ini, kerana itulah yang mereka gunakan untuk kebanyakan laman web. Konvensyen reka bentuk web yang melanggar dianggap sebagai praktik pengalaman pengguna yang buruk, dan ia benar-benar benar untuk navigasi utiliti yang, dalam kebanyakan kes, lebih banyak tentang kebolehgunaan daripada kreativiti.

Sebagai navigasi utiliti menengah ke navigasi berasaskan kandungan di kebanyakan laman web, ia sering diletakkan di kawasan kurang jelas tetapi masih kelihatan. Ini biasanya bermaksud (1) sudut kanan laman web, dan (2) bahagian bawah footer. Ia Idea yang baik untuk mengikuti konvensyen ini, sebagai ini adalah tempat di mana kebanyakan pengguna mencari alat utiliti terlebih dahulu.

Seperti yang anda dapat lihat di bawah ini, Reuters telah meletakkan kebanyakan alat utilitinya ke dalam dua kawasan tipikal ini, sudut kanan atas laman web, dan bahagian bawah footer di bawah navigasi berasaskan kandungan. Penyelesaian unik di sini adalah footer tambahan tetap dengan 2 item utiliti yang pereka dianggap sebagai yang paling penting: “Masuk atau mendaftar” dan “Terkini dari My Wire”.

Sangat menarik untuk diperhatikan bahawa kawasan navigasi utiliti tambahan masih diletakkan dalam jenis footer di mana pengguna biasanya mencari alatan yang serupa, jadi pereka Reuters kreatif dengan cara tetapi masih mengikuti konvensyen reka bentuk web untuk mengekalkan kebolehgunaan.

Membina Struktur Logik

Pengelompokan peralatan utiliti ke dalam struktur logik adalah penting jika kita ingin membina tapak dengan kadar penukaran yang tinggi. Ini boleh jadi cabaran walaupun kami tidak mahu memberikan pengguna banyak pilihan, tetapi Amazon mengambil kompleksiti navigasi utiliti ke peringkat seterusnya. Amazon mempunyai navigasi utiliti yang sangat rumit dengan banyak pilihan, tetapi jika kita menggunakan Amazon secara berkala, ia tidak muncul begitu. Inilah keajaiban reka bentuk pintar.

Mereka bukan sahaja meletakkan navigasi utiliti di sudut kanan atas di mana pengguna menjangka dapat mencarinya, tetapi mereka juga membahagikannya kepada 3 kumpulan utama: (1) bar carian, (2) maklumat berkaitan pengguna (di bawah bar carian ), dan (3) tindakan yang boleh dilakukan pengguna di laman web ini.

Ia bijak kerana, terima kasih kepada isyarat visual seperti kereta belanja atau ikon carian, pelanggan boleh membuat keputusan dalam sekelip mata yang kumpulan mereka mahu menggunakan, dan sejak saat itu mereka dapat mengabaikan dua yang lain. Hanya ada satu kumpulan (“Akaun anda”, “Cuba Perdana”, “Bakul”, dan “Wish List”) yang mempunyai submenus yang juga berstruktur secara logik, dan kumpulan submenu yang berbeza dibahagikan oleh pemisah yang bijak tetapi kelihatan untuk membantu pengguna dengan cepat mencari apa yang mereka mahu.

Buat Reka Bentuk Visual Berkesan

Reka bentuk visual navigasi utiliti berkesan perlu mengikuti prinsip KISS yang terkenal (Keep It Simple, Stupid). Adalah disyorkan untuk menyediakan ikon dengan label teks, membuat kawalan kelihatan seperti kawalan, dan secara visual memberi penekanan kepada tindakan yang paling penting. Ia juga boleh menjadi idea yang baik untuk membezakan navigasi utiliti dan kandungan berasaskan dengan menggunakan reka bentuk yang sedikit berbeza.

Dua contoh hebat reka bentuk visual yang berkesan boleh didapati di laman web Walmart dan Etsy. Pereka diletakkan navigasi utiliti di bahagian atas kedua-dua tapak, dan menyerlahkannya dengan warna yang berbeza dari yang lain navigasi, Walmart dengan latar belakang biru, dan Etsy dengan fon biru.

Kedua-dua tapak menekankan tindakan pengguna yang paling penting dengan unsur reka bentuk visual yang berbeza, Walmart menggunakan warna kuning untuk butang Carian dan Log Masuk, manakala Etsy memberikan sempadan biru yang bijak ke butang Masuk, dan termasuk ikon keranjang belanja kelabu di atas menu Keranjang.

Ini adalah satu-satunya tempat di mana Etsy menggunakan ikon dalam menu utilitinya, sementara Walmart memaparkan ikon di sebelah setiap item, tetapi masih tidak lupa untuk memasukkan label teks yang diperlukan tepat di sebelah ikon.