Membuat User Flow Untuk Website

Pastikan website kamu memiliki user flow yang baik agar pengunjung bisa dengan mudah menemukan informasi yang mereka cari tanpa kesulitan.

Desainer mengembangkan user flow website untuk membantu pengunjung menavigasi dari masuk hingga keluar. Mari kita pelajari user flow yang bisa memperkuat starategi desain website.

Apa itu user flow?

User flow adalah diagram yang menggambarkan jalur logis yang diambil oleh pengguna saat menjelajahi sebuah website, aplikasi, atau produk digital lainnya. Diagram ini memetakan seluruh pengalaman pengguna, mulai dari titik akses awal hingga interaksi terakhir.

Berguna sebagai alat visual yang dimaksudkan untuk mengilustrasikan hubungan antara website dan pengunjung, interaksi mereka, dan hasil dari tindakan tersebut. Jadi, user flow ini seperti peta yang menunjukkan arah perjalanan kita saat berada dalam website

Kita dapat mengevaluasi dan meningkatkan pengalaman pengguna dengan berbagai cara, seperti menyederhanakan proses hingga membuat elemen navigasi lebih terlihat menonjol.

Perubahan kecil seperti ini bisa sangat berpengaruh dalam meningkatkan lalu lintas ke area tertentu dalam sebuah web dan meningkatkan konversi.

Ketika pengunjung tertarik dengan produk kita, mereka akan lebih lama bertahan di dalam web tersebut, dan ini meningkatkan kemungkinan untuk melakukan konversi.

User flow vs user journey.

Orang sering bingung antara “user flow” dengan “user journey.” Namun, penting untuk memahami perbedaan antara kedua konsep UX ini.

Mari kita mulai dengan mendefinisikannya.

User flow adalah gambaran tentang langkah-langkah atau urutan tindakan yang diambil pengguna untuk mencapai tujuan tertentu hanya saat berada dalam website. Dimulai ketika seseorang masuk ke website dan berakhir ketika mereka keluar.

Di sisi lain, user journey mencakup konteks lengkap dari pengalaman pelanggan, termasuk diluar website seperti pengaruh offline dan online serta iklan. User flow hanyalah satu aspek dari user journey yang lebih luas.

Jadi, user flow membantu kita memahami langkah-langkah konkret pengunjung saat ada di website. Misalnya, user flow bisa membantu kita melihat bagaimana seseorang menggunakan website dari saat pertama kali masuk sampai mereka mengklik tombol CTA.

Dengan user flow, kita bisa melihat setiap langkah dan keputusan yang diambil oleh konsumen, termasuk apakah terjadi konversi atau malah meninggalkan website di tengah jalan, serta halaman apa saja yang mereka lihat sebelum mengambil keputusan tersebut.

Sedangkan user journey lebih fokus pada aspek besar dari pengalaman pengguna. Perjalanan pengguna menggambarkan tindakan konsumen dari sudut pandang yang lebih luas daripada fokus pada detail-detail kecil.

User journey lebih fokus pada keseluruhan langkah yang dilakukan konsumen sebelum sampai ke website hingga setelah keluar website.

Termasuk apa yang mendorong mereka, informasi apa yang telah mereka pelajari tentang kita – dan dari mana mereka mendapatkannya – serta apakah mereka membeli sesuatu atau malah pergi ke website lain di tengah jalan.

Jadi, sederhananya user flow adalah bagian dari user journey dan saling saling melengkapi untuk memahami bagaimana pengguna berinteraksi dengan situs web secara keseluruhan.

Untuk membuat user flow yang kuat, pertama-tama kamu harus memahami target audiens. Belajar tentang harapan, keinginan, dan motivasi mereka akan membantumu membuat keputusan untuk memberikan pengalaman yang lebih baik.

Jadi, dengan memahami pengguna dengan baik, kamu bisa menciptakan alur pengalaman pengguna yang menyenangkan dan mudah diikuti.

Memahami tujuan pengguna.

• Apa masalah yang ingin mereka selesaikan?
• Fitur desain apa yang diperlukan untuk membantu mereka belajar?
• Apakah mereka memiliki kekhawatiran tentang produk yang bisa ditangani?

Identifikasi tujuan dan user flow adalah seperti peta jalan untuk mencapai hal-hal yang ingin dicapai pengunjung saat menggunakan website. Jalur-jalur ini adalah rute tercepat dari satu langkah ke langkah lainnya, misalnya dari mendaftar hingga mengatur akun.

Jadi, saat kamu membuat website, pikirkan seperti sedang mengikuti petunjuk arah untuk sampai ke tempat tujuanmu dengan lancar dan mudah.

Identifikasi tujuan dan user flow. Pastikan jalur ini sederhana. Jika ingin pengunjung mendaftar email newsletter, maka minta alamat email mereka. Daripada meminta nomor telepon kemudian mengirim pesan teks dengan tautan ke newsletter, yang menambah langkah yang tidak perlu.

Coba tanyakan pada diri sendiri, “Apakah fitur ini perlu ada di sini?” Jika jawabannya tidak yakin, maka potong saja. Mengidentifikasi jalur-jalur kunci ini membantu membuat alur pengguna mudah dengan menghilangkan langkah-langkah yang tidak perlu.

Outline the flow

Untuk memulai proses desain alur pengguna, mulailah dengan membuat flowchart atau wireframe. Ini adalah gambaran dua dimensi yang membentuk desain kasar dari versi akhir user flow.

Buatlah wireflow dasar (kombinasi antara wireframe dan flowchart) dengan pemangku kepentingan, mirip dengan mockup atau peta pikiran (representasi visual yang digunakan untuk mengatur setiap elemen secara luas). Wireflow ini terbagi menjadi tiga tahap utama:

• Entry point: Kita akan mulai dari saat kamu pertama kali membuka sebuah situs web atau aplikasi di ponselmu. Ini adalah langkah awal saat kamu mulai mengenal antarmuka pengguna (UI) dari situs atau aplikasi tersebut. Pastikan desain antarmuka pengguna yang kuat agar pengunjung tidak langsung menutup halaman.
• Map leading up to completion: kamu akan melalui berbagai langkah interaktif sebelum mencapai titik akhir. Di sinilah kamu akan merasakan fungsionalitas dari situs web atau aplikasi tersebut. Oleh karena itu, penting untuk memiliki jalur kunci terbaik agar perjalananmu berjalan dengan lancar.
• Last interaction: Titik akhir dari proses pengguna situs webmu adalah langkah terakhir ketika semua tindakan pengguna mengarah pada saat mereka mengklik tombol panggilan tindakan (CTA) atau melakukan pembelian dan menyelesaikan proses pengguna.

Gunakan shape dalam final user flow

Desainer menggunakan bentuk-bentuk khusus untuk menggambarkan fitur-fitur dalam user flow. Setiap bentuk melambangkan interaksi atau potensi interaksi, memberikan pembaca informasi lebih detail tentang fungsionalitas setiap tahap selama proses user flow.

Beberapa bentuk yang sering digunakan dan arti mereka:

• Circles: Lingkaran biasanya melambangkan tindakan dalam alur pengguna. Mereka adalah titik keputusan di mana pengunjung harus berpindah dari satu bagian situs web ke bagian lainnya. Misalnya, lingkaran pada diagram alur pengguna dapat mewakili masuk ke situs, pilihan pengunjung saat memilih dari daftar opsi, keputusan mereka untuk memesan, dan menutup situs.
• Rectangles: Bentuk persegi panjang sering kali mewakili fitur tampilan dari produk digital, seperti saat masuk ke situs. Persegi panjang bisa berupa tampilan yang memberi tahu pengunjung bahwa mereka harus memilih tugas, sedangkan tindakan pemilihan sebenarnya akan dilakukan dengan lingkaran.
• Diamonds: Berlian biasanya mewakili keputusan pengunjung. Ini bukan fitur dari situs web – mereka menunjukkan proses berpikir konsumen. Misalnya, jika seorang pengunjung harus memilih dari daftar opsi, keputusan berikutnya (yang diwakili oleh berlian) bisa menjadi, “Apakah opsi ini benar?”
• Lines with arrows: Garis dengan panah menghubungkan setiap langkah perjalanan dan menetapkan aliran urutan diagram. Mereka membimbing pembaca dari satu titik ke titik berikutnya dan menciptakan jalur yang jelas, baik dari atas ke bawah atau dari kiri ke kanan. Panah putus-putus dapat mewakili mundur yang mungkin diambil seorang pengunjung – jika mereka memilih opsi yang salah dari daftar, mereka dapat klik kembali.

Ingatlah bahwa tidak ada cara yang benar untuk membuat alur pengguna – setiap diagram situs web akan menjadi unik sesuai dengan tujuannya dan audiens targetnya.

Yang penting adalah mengembangkan alur pengguna yang kohesif dengan bentuk, warna, dan elemen yang konsisten sehingga pembaca dapat dengan mudah memahami dan mengikuti alur tersebut. Jadi, pastikan untuk membuat alur pengguna yang teratur dan mudah dipahami agar pengunjung website tidak bingung saat menggunakannya.