Rahasia Desain UX yang Membunuh: Semuanya Ada Dalam Interaksi Mikro

Diterbitkan: 2016-11-13

Desain ada di detail.

Suatu hari saya menulis pesan untuk seorang teman lama yang tidak mudah untuk ditulis karena itu adalah pesan untuk mengungkapkan belasungkawa saya atas kehilangan ibunya. Kami telah berbicara di telepon beberapa kali di awal minggu, tetapi saya ingin mengiriminya pesan singkat di aplikasi Facebook Messenger untuk memberi tahu dia bahwa saya sedang memikirkannya. Saya selesai menulis pesan dan memutuskan untuk menambahkan sedikit "hati" di akhir.

Tindakan sederhana mengetuk hati ini akhirnya berubah menjadi ledakan menyenangkan hati merah mengambang di layar ponsel saya yang juga disertai dengan beberapa efek suara konyol. Saat ini dalam waktu, sementara singkat dan cepat, membawa saya beberapa detik kejutan dan kegembiraan selama waktu yang sulit.

Inilah yang terjadi pada layar saya setelah mengetuk hati merah.

fb_hati

Detail kecil ini, atau dikenal sebagai interaksi mikro, dapat membuat pengalaman antara pengguna dan perangkat/produk lebih menyenangkan, mudah, efektif, dan manusiawi. Kita bahkan sering tidak menyadari interaksi mikro ini.

Mereka cerdik dan kadang-kadang hampir tidak terlihat; tetapi, mereka dapat membuat produk menjadi sesuatu yang disukai pengguna, bukan sesuatu yang mereka anggap suam-suam kuku.

Dengan kata lain, interaksi mikro memiliki potensi untuk secara ajaib menjembatani kesenjangan antara pengguna dan teknologi melalui hubungan emosional dan manusia, sekaligus mendorong mereka untuk terus kembali lagi.

Apa itu Interaksi Mikro?

Interaksi mikro didasarkan pada penyelesaian satu momen atau tugas melalui penyediaan pengalaman yang menyenangkan dan umpan balik yang berguna bagi pengguna. Momen mikro inilah yang pada akhirnya memandu pengguna melalui aliran dengan cara yang intuitif dan efektif.

Dan Saffer, penulis buku "Microinteractions" dan Wakil Presiden Produk untuk Mayfield Robotics , mendefinisikan interaksi mikro sebagai "Momen produk yang terkandung yang berputar di sekitar satu kasus penggunaan—mereka memiliki satu tugas utama. Setiap kali Anda mengubah pengaturan, menyinkronkan data atau perangkat Anda, mengatur alarm, memilih kata sandi, masuk, mengatur pesan status, atau favorit atau 'menyukai' sesuatu, Anda terlibat dengan interaksi mikro. Mereka ada di mana-mana: di perangkat yang kita bawa, peralatan di rumah kita, aplikasi di ponsel dan desktop kita, bahkan tertanam di lingkungan tempat kita tinggal dan bekerja. Sebagian besar peralatan dan beberapa aplikasi dibangun seluruhnya di sekitar satu interaksi mikro.”

Menurut Saffer, interaksi mikro baik untuk:

  • Menyelesaikan satu tugas dan satu tugas saja.
  • Berinteraksi dengan satu bagian data, seperti suhu atau peringkat sebuah lagu.
  • Mengontrol proses yang sedang berlangsung, seperti volume lagu di Spotify
    menyesuaikan pengaturan.
  • Melihat atau membuat konten kecil, seperti status di Facebook
    mengaktifkan atau menonaktifkan fitur atau fungsi.

Mengapa Menggabungkan Interaksi Mikro Ke Dalam Desain Anda?

  • Mereka membantu mendorong pengguna untuk berinteraksi dengan situs Anda, apakah itu mengklik tombol, berbagi konten, atau menanggapi pesan atau pemberitahuan.
  • Mereka memberikan umpan balik kepada pengguna dengan segera.
  • Mereka membantu pengguna menavigasi melalui situs.
  • Mereka membantu memandu pengguna melalui alur dengan cara yang intuitif dan mudah.

Saffer menggambarkan empat bagian interaksi mikro sebagai pemicu, aturan, umpan balik, dan loop dan mode. Mari selami lebih dalam apa arti dari masing-masing langkah ini.

Pemicu

Pemicu adalah apa yang memulai interaksi. Ini adalah isyarat, visual atau lainnya, yang mendorong pengguna untuk mengambil tindakan. Pemicu dapat berupa kepakan ikon untuk mendorong pengguna mengetuk atau mengkliknya. Tombol biru yang mengambang di bagian atas umpan Twitter Anda yang bertuliskan "tweet baru" dengan panah mengarah ke atas memicu Anda untuk mengkliknya untuk melihat semua tweet baru yang telah diposting sejak Anda pergi.

Beberapa pemicu terbaik adalah pemicu yang benar-benar mengantisipasi kebutuhan pengguna tanpa harus menyatakan kebutuhannya . Ini mengharuskan perancang untuk mengumpulkan penelitian pengguna dan data perilaku untuk membantu memprediksi apa yang akan menjadi kebutuhan pengguna dan merancang pemicu yang sesuai.

Aturan

Pemicunya berhubungan dengan aturan. Aturan-aturan ini menjelaskan apa yang terjadi selama interaksi. Aturan harus terasa alami bagi pengguna untuk dicapai dan aturan itu ada untuk membantu meminimalkan kesalahan. Contoh bagusnya adalah jika Anda mencoba mengirim email melalui Gmail tanpa memasukkan baris subjek, Gmail akan memberi tahu Anda bahwa "email tidak memiliki baris subjek" menanyakan apakah Anda masih ingin mengirimnya.

Direkomendasikan untukmu:

Bagaimana Metaverse Akan Mengubah Industri Otomotif India

Bagaimana Metaverse Akan Mengubah Industri Otomotif India

Apa Arti Ketentuan Anti-Profiteering Bagi Startup India?

Apa Arti Ketentuan Anti-Profiteering Bagi Startup India?

Bagaimana Startup Edtech Membantu Meningkatkan Keterampilan & Mempersiapkan Tenaga Kerja untuk Masa Depan

Bagaimana Startup Edtech Membantu Tenaga Kerja India Meningkatkan Keterampilan & Menjadi Siap Masa Depan...

Saham Teknologi Zaman Baru Minggu Ini: Masalah Zomato Berlanjut, EaseMyTrip Posting Stro...

Startup India Mengambil Jalan Pintas Dalam Mengejar Pendanaan

Startup India Mengambil Jalan Pintas Dalam Mengejar Pendanaan

Startup pemasaran digital Logicserve Digital dilaporkan telah mengumpulkan INR 80 Cr dalam pendanaan dari perusahaan manajemen aset alternatif Florintree Advisors.

Platform Pemasaran Digital Logicserve Bags Pendanaan INR 80 Cr, Berganti Nama Sebagai LS Dig...

Masukan

Umpan balik didasarkan pada aturan dan memberikan informasi kepada pengguna tentang apa yang terjadi pada saat itu. Saya sangat menyukai umpan balik yang saya terima pada formulir yang dirancang dengan mempertimbangkan pengguna. Memasukkan validasi sebaris dalam desain Anda dalam konteks yang tepat dapat sangat membantu pengguna.

Misalnya, saat memasukkan nama pengguna, jika saya melihat tanda centang hijau, saya tahu saya dapat melanjutkan untuk mengisi bidang kata sandi. Saya tidak dapat memberi tahu Anda berapa kali saya mengisi bidang nama pengguna dan kata sandi, tekan kirim, dan diberitahu dengan warna merah bahwa nama pengguna atau kata sandi salah.

Masalah dengan situasi ini adalah saya sama sekali tidak tahu bidang atau huruf mana yang salah . Jika saya dapat membuat perubahan yang benar di sepanjang jalan, itu membuat seluruh proses menjadi jauh lebih mudah. Tanda centang hijau kecil itu, meskipun kelihatannya tidak penting, membuat semua perbedaan dalam perasaan pengguna selama dan setelah proses pengisian formulir dan berpotensi menghasilkan tingkat penyelesaian yang lebih tinggi.

Formulir pendaftaran Twitter adalah contoh yang bagus dan sederhana tentang bagaimana validasi sebaris harus digunakan. Tanda centang muncul di sisi kanan bidang formulir saat saya menyelesaikan tindakan. Pesan kesalahan merah juga terbukti berguna dengan memberi tahu saya apa yang harus saya lakukan untuk melengkapi formulir dengan benar.

Aplikasi perjalanan Hopper juga menggunakan interaksi mikro dengan bijak. Setelah memasukkan tanggal dan tujuan yang ingin saya pelajari lebih lanjut, kelinci kecil yang lucu melompat-lompat saat aplikasi "berpikir" dan menarik hasil untuk saya lihat. Tidak ada yang suka menunggu. Namun, melihat kelinci melompat-lompat membawa sedikit kesenangan pada pengalaman menunggu yang singkat itu, sekaligus memberi tahu pengguna bahwa ada sesuatu yang benar-benar terjadi dan hasilnya akan segera ditampilkan.

Loop & Mode

Loop dan mode menentukan meta-aturan interaksi yang lebih besar. Jika interaksi mikro digunakan berulang kali, penting untuk mempertimbangkan bagaimana interaksi berubah. Pikirkan tentang bagaimana interaksi ini beradaptasi berdasarkan perilaku pengguna. Apa perbedaan microinteraction yang pertama kali digunakan dengan yang ke-7 kali?

Cobalah membuat loop yang beradaptasi dari waktu ke waktu, membuat pengalaman menjadi lebih kaya setiap kali mereka berinteraksi dengannya. Fitur On This Day Memories Facebook adalah contoh yang bagus tentang cara membuat pengalaman yang beradaptasi setiap kali digunakan.

Mayoritas pengguna Facebook memeriksa feed berita mereka beberapa kali sehari. Memiliki fitur yang terkadang menarik pembaruan status atau gambar dari 4 tahun yang lalu dapat memiliki efek emosional (semoga positif) pada pengguna. Ada potensi interaksi mikro khusus ini memiliki efek negatif. Misalnya, menampilkan postingan lama yang dapat membuat pengguna sedih atau stres memiliki konsekuensi negatif yang tidak diinginkan. Saya menyarankan agar Facebook mencari cara agar pengalaman negatif itu tidak terjadi.

Hal-hal yang Perlu Diingat Saat Merancang Interaksi Mikro

Jangan over desain . Interaksi mikro seharusnya tidak terasa aneh atau memakan waktu terlalu lama untuk dimuat. Mereka harus melayani tujuan sambil mengalir mulus dalam keseluruhan desain Anda.

Pertama kali seseorang mengalami mikrointeraksi, dia tidak akan merasakan hal yang sama seperti ketika mereka menggunakannya untuk ke-10 atau ke-100. Buat interaksi mikro dapat disesuaikan dengan konteksnya. Jika ini adalah pertama kalinya pengguna, minta bantuan panah untuk menavigasi aplikasi. Beri mereka pilihan untuk tidak menampilkan pesan itu lagi, sehingga tidak mengganggu di masa depan.

Ini membawa saya ke tip ketiga. Jangan mulai dari nol . Pahami pengguna Anda, motivasi mereka, dan konteksnya dengan melakukan riset pengguna. Informasi yang Anda kumpulkan akan memberi Anda informasi yang Anda butuhkan untuk membuat keputusan Anda lebih efektif dan bermanfaat. Jika mereka berada di sana untuk ke-20 kalinya, cari tahu apa motivasi dan tujuan mereka dan ciptakan interaksi mikro berdasarkan temuan Anda.

Ingat, tujuannya adalah agar interaksi ini halus dan efektif. Pastikan gaya interaksi mikro cocok secara alami dengan gaya desain antarmuka Anda secara keseluruhan. Interaksi seharusnya tidak tampak tidak pada tempatnya atau membingungkan dan interaksi mikro harus terhubung ke keseluruhan desain aplikasi.

6 Contoh Interaksi Mikro yang Dilakukan dengan Benar

Kejutan di Lengan Anda

Saya mendengar seseorang menggambarkan memiliki kemeja lengan panjang yang lembut dan nyaman yang sama selama bertahun-tahun. Suatu hari saat berlari di jalan setapak yang dinaungi pepohonan dengan mengenakan kemeja lengan panjang yang sama, pelari menggambarkan kedinginan dan menarik kain ekstra, yang dimaksudkan untuk hari yang dingin untuk menutupi tangannya, untuk membalik atasan di atas tangannya. Kain di bawahnya mengungkapkan pernyataan "Anda dicintai."

Kata-kata ini, yang secara diam-diam tercetak di tempat yang tepat dari kain, disembunyikan untuk ditunjukkan pada saat-saat seperti ini yang mengejutkan mereka yang memakainya dengan momen kegembiraan mikro .

Emoji Slack

Situs web Little Big Details mengkurasi beberapa contoh interaksi mikro yang bagus. Salah satu yang mereka tunjukkan adalah ketika mencari emoji di Slack dan emoji yang Anda cari tidak ada, emoji "menangis" disarankan sebagai opsi. Alih-alih pengguna menjadi kesal ketika mereka tidak dapat menemukan apa yang mereka inginkan, emoji "menangis" membuat mereka merasa geli .

slack_cry_emoji

penerjemah Google

Saat Anda menekan tombol "dengarkan" untuk kedua kalinya di Google Terjemahan, terjemahan akan diulang dalam kecepatan yang lebih lambat dengan asumsi Anda memerlukan sedikit waktu ekstra untuk memahami apa yang dikatakannya.

Mode Malam Di Google Maps

Saya selalu menyukai bagaimana latar belakang aplikasi Google Maps berubah menjadi hitam sesuai waktu. Mode Malam dimaksudkan untuk membantu penglihatan dan keamanan malam dan sepenuhnya otomatis.

Buat Saya Pulsa

Lihat situs ini Make Me Pulse untuk pengalaman interaktif yang benar-benar menyenangkan. Penggunaan interaksi mikro ( progres bar, suara, warna ) membantu memandu pengguna melalui alur melalui pemicu, aturan, umpan balik, dan loop.

Scroll Bar

Bahkan bilah gulir abu-abu kecil di sisi kanan halaman ini adalah contoh yang bagus dan sederhana tentang bagaimana interaksi mikro dapat berguna dan efektif sehingga Anda sebagai pembaca tahu berapa banyak materi yang tersisa untuk membaca artikel ini.

Semoga artikel ini menginspirasi Anda untuk mulai memasukkan interaksi mikro ke dalam desain Anda. Mereka memiliki potensi untuk mengubah pengalaman yang dimiliki pengguna Anda dengan desain Anda dari biasa-biasa saja menjadi sesuatu yang benar-benar berkesan.

[Posting ini pertama kali muncul di Proto.io dan telah direproduksi dengan izin.]