Programming

4 Cara Kreatif Membuat Visibilitas Status Sistem dalam User Interface (UI)

1. Feedback Visual yang menunjukan lokasi pengguna atau proses

Dalam menavigasi suatu sistem aplikasi maupun website, siapapun pasti tidak suka jika mereka tidak tahu sedang ada dimana dan menu apa. Oleh karena itu penting untuk memberi tahu pengguna akan hal ini melalui feedback visual . Feedback visual bisa berupa perubahaan warna latar atau munculnya slide animasi seperti berikut :

2. Visual Feedback yang mengkonfirmasi aksi yang diambil pengguna

Sangat penting untuk segera memberikan feedback untuk semua aksi yang diambil pengguna ketika mereka berada dalam aplikasi atau website. Dengan memasukan elemen visual secara langsung akan menimbulkan kesan bahwa aplikasi sudah menerima perintah pengguna.

Ini mencegah kesalahan pengguna seperti mengetuk / tap dua kali pada tombol yang sama 2 kali.

Dalam bentuk dasarnya, sangat penting untuk menunjukkan bahwa sistem benar-benar menangkap ketukan / klik. Tehnik ini bisa diterapkan berupa memberikan efek hover atau terasa menekan tombol pada semua CTA (Call to action) yang ada di aplikasi atau websitemu.

Berikut contoh lainnya :

Sesudah di tap / klik Sebelum di tap / klik

Feedback visual pada tombol On / Off

3. Visual Feedback yang menunjukan status sistem

Ketika sistem membutuhkan waktu untuk meload suatu menu / melakukan suatu aksi, kamu bisa menggunakan visual feedback berupa indikator proses load secara looping (berulang) jika waktu yang dibutuhkan kurang dari 10 detik.

Atau berupa Progress bar jika waktu yang dibutuhkan lebih dari 10 detik.

Indikator ini bisa jadi bentuk komunikasi antara sistem dan pengguna. Mencegah timbulnya ketidak pastian dipikiran pengguna dan mengurangi kegelisahan mereka.

Akan tetapi jika dibutuhkan waktu lebih lama, disarankan untuk menggunakan Container khusus yang disebut Skeleton Screen. Berikut contohnya :

Desktop

Proses Load (menggunakan Container Skeleton Screen)

Setelah proses load selesai

Aplikasi :

Proses Load (menggunakan Container Skeleton Screen)

4. Triggered Events

Notifikasi / Indikator

Tujuan pemberitahuan yang efektif adalah untuk mengarahkan perhatian pengguna bahwa ada event (kejadian) baru. Misalnya saja ketika ada pesan WA masuk atau notifikasi baru pada akun sosial media kamu.

Oleh Sebabnya gunakan animasi halus untuk pemberitahuan karena efek animasi secara alami menarik perhatian pengguna. Ini karena mata manusia terfokus pada objek bergerak.

Request untuk Aksi Pengguna

Ada banyak kasus dimana sistem meminta data untuk aksi yang diambil oleh user. Misalnya saja ketika mereka akan login ke akun sosial media, sistem pasti memberi tahu untuk memasukan terlebih dahulu email akun serta password atau kata kuncinya.

Ketika mereka melakukan kesalahan (misal salah menggunakan jenis email) maka penting untuk sistem segera memberikan feedback visual serta opsi terbaiknya agar pengguna bisa secara instan memperbaiki kesalahan tersebut.

Dalam desain User Interface (UI) maupun User Experience (UX) berskala besar, seringkali para desainer mengabaikan feedback visual. Padahal nyatanya feedback visual sangat penting jika ingin pengguna nyaman menggunakan aplikasi atau sistem yang dibuat.

Sumber : https://uxplanet.org/4-ways-to-communicate-the-visibility-of-system-status-in-ui-14ff2351c8e8

About the author

Avatar photo

Techfor Id

Leave a Comment

Click to ask
Hai, Tanya-Tanya Aja
Hi ini Windy, dari techfor

Windy bisa membantu kamu memahami layanan Techfor
Seperti

1. Kursus Online By Expert
2. Partnership Event dan Konten
3. Layanan liputan multimedia
4. Dan hal lain yg ingin kamu tau

Kirim saja pesan ini serta berikan salah satu nomor diatas atau beritahukan windy lebih jelas agar dapat membantu Kamu