Ketahui Tentang Interaksi Mikro (Microinteractions) Lebih Dalam

on

|

views

and

comments

Interaksi mikro adalah momen halus yang terpusat di sekitar menyelesaikan satu tugas. Hampir semua produk di sekitar kita (baik fisik maupun digital) dipenuhi dengan interaksi mikro. Berikut adalah beberapa contoh:

Umpan balik visual yang mengkonfirmasi fakta bahwa item baru ditambahkan ke troli
Tarik untuk menyegarkan yang membantu kami memperbarui konten
Animasi antarmuka yang mengakui tindakan tertentu (mis. Tombol sakelar)

Setiap momen kecil ini membentuk interaksi mikro. Ketika kita berinteraksi dengan produk, kita jarang fokus pada mereka, tetapi kita tentu merasakan kehadiran mereka. Namun, momen kecil ini ketika dirancang dengan baik dapat meningkatkan pengalaman pengguna Anda dengan membuat antarmuka pengguna lebih sedikit mesin dan lebih manusiawi.

Dalam artikel ini, saya akan menggambarkan 5 teknik yang berguna untuk interaksi mikro dan memberikan beberapa contoh bermanfaat.

1. Buat Lingkaran Kebiasaan

Interaksi mikro memiliki dampak langsung pada keterlibatan pengguna. Interaksi mikro yang dirancang dengan baik memiliki kekuatan untuk mendorong pengguna untuk lebih banyak berinteraksi dengan suatu produk karena mereka menciptakan loop kebiasaan. Kebiasaan terbentuk ketika orang melakukan tindakan yang sama berulang kali dan terdiri dari tiga elemen:

Cue – Pemicu yang memulai tindakan
Rutin – Sebagai respons terhadap isyarat, Anda melakukan suatu tindakan
Hadiah – Manfaat yang Anda dapatkan dari menyelesaikan rutinitas, alasan untuk menyelesaikan tindakan

Image for post

Kredit gambar: wikiaPemberitahuan Facebook tentang pesan yang masuk adalah contoh yang baik dari perulangan kebiasaan: lencana merah dan ikon putih (isyarat) menunjukkan ada pesan baru, yang membuat pengguna mengklik ikon (rutin) untuk membaca pesan dari teman mereka (hadiah). Setelah beberapa saat, pengguna secara otomatis mengklik ikon ketika mereka melihat lencana merah.

Image for post

Interaksi mikro adalah unsur rahasia dalam menciptakan aplikasi yang membuat ketagihan.Kiat: Semakin kuat hadiah, semakin kuat kebiasaan itu.2. String Bersama dengan Tema

Interaksi mikro harus menjadi bagian alami dari desain produk Anda. Berikut adalah dua cara sederhana untuk memperkenalkan interaksi mikro dalam desain Anda:

Prinsip kesinambungan. Anda mungkin pernah mendengar tentang istilah perjalanan pengguna. Ketika pengguna berinteraksi dengan suatu produk, mereka melalui serangkaian langkah dan setiap langkah dalam proses ini merupakan kelanjutan logis dari langkah sebelumnya. Dimungkinkan untuk membuat interaksi dengan produk lebih nyaman dengan menghidupkan transisi antara berbagai kondisi sehingga transisi terlihat mulus, tidak terputus-putus.

Image for post
Kredit gambar: Cam Runcie
Prediktabilitas antarmuka pengguna. Interaksi manusia-komputer jauh lebih nyaman bagi pengguna ketika mereka dapat mengetahui apa yang akan terjadi selanjutnya. Interaksi mikro yang dirancang dengan baik dapat memandu pengguna dan membantu mereka memahami konten dan fungsionalitas.
Image for post
Image credit: Leo Zakour

Image for post

Image credits: Matt D. Smith

3. Gunakan Umpan Balik Animasi

Animasi dapat berkontribusi besar pada pengalaman pengguna jika digunakan dengan benar. Animasi fungsional dan menyenangkan dapat digunakan untuk memberikan umpan balik:

Animasi fungsional dapat membantu mengurangi beban kognitif.

Image for post

Kredit gambar: Tamino Martinius
Detail animasi yang menyenangkan yang diperkenalkan dalam interaksi mikro membuat interaksi lebih menyenangkan karena gerakan membuat antarmuka pengguna menjadi lebih hidup.

Image for post

Image credit: Chris Bannister
Image for post
Image credit: Tubik

4. Gunakan Humor

Humor memainkan peran penting dalam interaksi manusia-komputer. Ketika produk menciptakan respons emosional positif dari pengguna akhir, ia memiliki peluang yang lebih baik untuk menciptakan audiens yang loyal. Misalnya, MailChimp, layanan web untuk membuat dan mengirim email, memberi penghargaan kepada pengguna untuk membuat dan menjadwalkan email pertama mereka dengan menambahkan humor dan kepositifan yang tidak terduga selama proses berlangsung. Dengan menambahkan kejutan kecil dan menyenangkan sepanjang perjalanan pengguna, MailChimp menjadikan pengiriman email jauh lebih menyenangkan.

Image for post

Tampilan konfirmasi MailChimp untuk kampanye email menggunakan humor ringan untuk memudahkan situasi tegang
5. Hindari Interaksi yang Tidak DiinginkanSaat Anda mendesain interaksi mikro, selalu pastikan isyarat visual dan animasi sesuai. Banyak perancang yang berupaya membuat UI lebih menyenangkan kelebihan UI dengan interaksi mikro animasi, dan ini sering menciptakan interaksi yang terlalu rumit. Yang selanjutnya dapat dilihat pada contoh di bawah ini – ini adalah interaksi yang indah tapi tidak terlalu berharga.
Image for post
Memiliki gumpalan terbang melintasi layar, setiap pengguna menggulir melalui obrolan, dapat menjadi sedikit menjengkelkan setelah beberapa saat. Kredit gambar: Jakub AntalíkBayangkan melihat efek animasi seperti itu setiap kali Anda mengetuk tombol tindakan mengambang. Ini bisa sangat menjengkelkan. Itulah mengapa sangat penting untuk mengikuti prinsip KISS saat Anda mendesain layar. Jadi ketika merencanakan interaksi mikro kita, kita harus fokus hanya pada hal-hal praktis interaksi mikro bagi pengguna.Pelajari cara mendesain antarmuka pengguna

Interaksi antara komputer dan manusia harus sama intuitifnya dengan percakapan antara dua manusia. Yayasan Desain Interaksi akan membantu Anda mempelajari cara mendesain untuk efisiensi dan persuasi.

Kesimpulan

Saat Anda merancang suatu produk, Anda harus fokus pada detail makro dan mikro. Bahkan detail kecil pun patut diperhatikan, karena perhatian pada setiap detail adalah kunci kesuksesan Anda, membuat interaksi manusia-komputer mudah digunakan.

Terima kasih!

 

 

 

 

 

sumber:uxplanet.org

Share this
Tags

Must-read

Mantaflow Creating Fire

Menciptakan efek api? Mudah dengan Mantaflow! https://www.youtube.com/watch?v=lR9vjaYzeYQ
spot_img

Recent articles

More like this