Skip to content Skip to sidebar Skip to footer

3 Tips Membangun Website Yang Memiliki Struktur UX Design

  

Desain web yang unik sangat dibutuhkan desainer dan pengguna untuk membangun situs web yang baik. Lagi pula, tujuan dari menempatkan desain pada media interaktif seperti komputer dan handphone adalah agar pengguna dapat dengan baik  menggunakannya. Cakupan interaksi juga merupakan ukuran yang baik untuk seberapa terlibat pengunjung situs karena jika mereka berinteraksi, mereka memperhatikan. Desain web interaktif yang baik akan memaksa pengguna untuk terlibat dengan situs web, menggulir ke bawah dan mengkonsumsi lebih banyak konten, untuk menavigasi ke halaman lain, untuk berbagi dengan teman, dan tentu saja untuk mengklik tombol promosi yang ada di website anda.

Salah satu tantangan yang dihadapi desain web interaktif adalah bahwa ada begitu banyak cara pengguna dapat berinteraksi dengan halaman di web anda, dan bahkan lebih banyak cara yang dapat merespons halaman. Beberapa desain interaktif akan menciptakan pengalaman pengguna yang cukup bak, memberikan umpan balik pengguna dan mengarahkan mereka tentang apa yang harus dilakukan selanjutnya. Untuk belajar bagaimana menceritakan pengalaman situs web interaktif yang baik dari yang buruk, kita akan mengambil pelajaran dari para profesional. Di sini, kami telah menyusun 4 tips berguna untuk desain web interaktif dengan mengumpulkan beberapa contoh favorit kami dan mendiskusikan apa yang membuat mereka bekerja.

1. Manfaatkan waktu pemuatan layar

    Loading splash screen bisa menjadi salah satu hambatan terbesar untuk pengalaman browsing web. Sebuah bisnis dapat menempatkan begitu banyak uang dan usaha untuk membangun situs web yang luar biasa dan indah, tetapi jika dibutuhkan lebih dari dua detik untuk memuat, penelitian telah menunjukkan bahwa pengunjung menjadi secara eksponensial lebih mungkin untuk pergi sebelum melihat semua itu. Hal tersebut dapat disimpulan sebagai asumsi bahwa pengguna mengalami pemuatan sebagai pengalaman negatif.

Tapi memuat layar splash screen juga bisa menjadi kesempatan. Jika Anda memiliki perhatian pengguna, mengapa tidak memanfaatkannya sebaik-baiknya? Saat-saat ini memberikan kesempatan yang tak terduga, dan oleh karena itu, ekstra khusus untuk mengesankan pengguna melalui animasi. Penggunaan animiasi ini  adalah kesempatan baru untuk memamerkan produk dan melibatkan serta menggairahkan pengguna. Seringkali, animasi ini benar-benar memberi pengguna rasa kemajuan dengan bilah pemuatan (atau sesuatu yang serupa) untuk menunjukkan berapa banyak waktu yang tersisa sebelum pengguna mengakses halaman berikutnya.

Idealnya, layar pemuatan ini menawarkan pengguna sesuatu untuk dilakukan, seperti permainan untuk dimainkan saat mereka menunggu, yang menciptakan pengalaman interaktif yang menyenangkan. Intinya adalah bahwa pemuatan tidak selalu berarti pengalaman negatif bagi pengguna. Mereka bahkan tidak harus hanya cepat dan tidak menyakitkan, terkadang mereka adalah bagian paling menarik dari sebuah situs web.

2. Mengatur informasi melalui pengguliran animasi

    Menggulir adalah salah satu interaksi paling sederhana dan paling intuitif yang dapat dilakukan pengguna. Tetapi hanya karena pengguna mungkin tidak berpikir tentang menggulir, tidak berarti perancang web seharusnya tidak melakukan hal tersebut, ada banyak cara yang desainer dapat manfaatkan yaitu bergulir animasi untuk memberikan pengguna rasa gerakan dinamis di seluruh situs web. Mari kita membahas beberapa yang umum, diantarannya :

    Animasi yang dipicu gulir

Teknik yang populer adalah memicu animasi tertentu untuk diaktifkan saat pengguna menggulir situs web. Ini cukup ajaib dalam menghidupkan visual dan menciptakan ilusi bahwa halaman yang diakses pengguna sebenarnya sedang dibangun, secara real time, sebagai tanggapan terhadap interaksi mereka.

    Paralaks bergulir (alias bergulir asimetris)

Teknik serupa yang telah mendapatkan traksi adalah paralaks scrolling. Jenis gerakan ini melibatkan katakanlah dua objek di layar bergerak pada dua kecepatan yang berbeda, saat pengguna menggulir ke bawah halaman. Hasilnya adalah simulasi kedalaman gerakan 3D, karena objek latar depan biasanya bergerak lebih cepat daripada objek latar belakang.

    Transisi halaman bergulir

Dan akhirnya, desainer dapat menggunakan transisi halaman penuh, di mana gulir halus tradisional diganti dengan lompatan ke layar berikutnya atau perubahan halaman grosir. Ini dapat menciptakan efek dramatis, memperkenalkan tidak hanya elemen halaman baru tetapi kadang-kadang skema warna yang sama sekali berbeda, membuat situs web terasa baru dengan setiap gulungan.

Secara keseluruhan, animasi bergulir ini memberi pengguna umpan balik penting tentang interaksi mereka dan memberi tahu mereka bahwa mereka baru saja memasuki bagian baru dari situs web dan harus mengharapkan perubahan dalam jenis informasi yang disampaikan. Singkatnya, mereka menyediakan hierarki dan organisasi yang jelas dalam paket interaktif yang mengesankan.

3. Putus gerakan vertikal dengan slider dan carousels

    Carousels disebut karena mereka mengembunkan konten situs web menjadi bagian berputar yang dapat dilalui pengguna, seperti gerakan pintu putar dari rekan karnaval kehidupan nyata. Mereka menjadi lebih umum di situs web karena meningkatnya popularitas interaksi menggesek di aplikasi seluler. Karena mereka pada dasarnya adalah bentuk pengguliran horizontal, mereka memberi pengguna istirahat yang sangat dibutuhkan dari monoton bergulir vertikal yang tak ada habisnya. Tapi ini bukan satu-satunya alasan mengapa Anda mungkin ingin memecah gerakan vertikal. Seperti yang telah disebutkan sebelumnya, pengguna cenderung mengasosiasikan ke bawah bergulir dengan maju ke bagian baru dari situs web. Carousels dan slider, di sisi lain, memungkinkan desainer web untuk memasukkan lebih banyak konteks ke setiap bagian, karena pengguna tidak secara teknis meninggalkan mereka.

Ini berarti daripada mengacaukan halaman dengan semua informasi yang diperlukan sekaligus, carousels runtuh elemen situs menjadi segmen yang lebih menggigit, memungkinkan pengguna untuk siklus melalui mereka sedikit demi sedikit. Ini bekerja paling baik ketika konten serupa dalam format, jadi kelompokkan bersama gambar produk, profil atau testimonial pelanggan, dll. Mereka juga berguna untuk menampilkan variasi, seperti produk yang datang dalam warna yang berbeda. Dalam hal menjiwai carousels ini, gaya berkisar dari transisi kiri-ke-kanan langsung, untuk menyeret kartu, untuk animasi roda berputar yang mengingatkan slide view master retro.