School of Information Systems

Pentingnya Animasi yang Baik pada UX

UX kini semakin berkembang dan dibutuhkan oleh website dan aplikasi. Terdapat beberapa cara untuk meningkatkan kualitas sebuah desain UX:

  1. Membuat sebuah user interface yang user friendly
  2. Animasi dan transisi

Ya, animasi dan transisi merupakan salah satu hal yang penting dalam sebuah desain UX. Pada dasarnya manusia merupakan makhluk visual, oleh karena itu sebuah animasi dalam proyek kita dapat menarik pengguna dan membedakan hasil yang telah kita buat dengan buatan kompetitor.  Selain itu, sebuah animasi yang benar, dapat memberi kepuasan tersendiri kepada pengguna dan membantu pengguna dalam memahami penggunaan sebuah website/aplikasi dan bagaimana menggunakan sebuah app/web dengan efektif.

Saat kita berbicara mengenai animasi fungsional, kita berbicara mengenai animasi yang memiliki alasan logis. Animasi tersebut mengurangi beban kognitif, dan menghasilkan pemahaman yang lebih baik mengenai hubungan spasial. Singkatnya, animasi membawa kehidupan kepada user intercace.

Dalam membuat sebuah animasi, animasi tersebut harus nyaman digunakan oleh pengguna. Animasi yang baik dapat meningkatkan kepercayaan seseorang kepada kita. Tetapi jangan terlalu banyak membuat animasi, karena animasi digunakan bukan hanya untuk visual tetapi juga untuk mengatasi permasalahan.

Cara Yang Benar Dalam Menggunakan UX Animation

Membuat animasi pada UX mudah, tetapi membuat animasi yang benar dan nyaman digunakan, tentu tidak mudah. Berikut beberapa cara untuk membuat animasi UX yang benar:

Gunakan tampilan loading yang membuat pengguna tetap tertarik

Beberapa studi menunjukkan bahwa lebih dari 40% pengguna mengharapkan sebuah web/app memuat dalam waktu 2 detik atau kurang. Jika melebihi 4 detik, maka pengguna akan merasa frustrasi. Setelah 8 detik mereka keluar. Kelebihan 1 detik saja pada sebuah site, akan mengurangi 7% pengguna. Waktu loading merupakan sesuatu yang sangat krusial untuk kesuksesan sebuah site, app, atau program.

Oleh karena itu, animasi yang menyenangkan, dapat membantu mengalihkan pandangan pengguna saat sedang menunggu sistem memuat halaman, dan membuat pengguna terfokus pada animasi yang menyenangkan.

Gambar 1.1 Contoh Animasi Loading

Animasi berdasarkan dimana pengguna harus fokus

Biasanya saat membuka sebuah app/web, kita langsung ditampilkan dengan tampilan penuh dengan items dan kita tidak yakin harus mulai darimana. Pada saat seperti ini, kita dapat menggunakan animasi. Animasi dapat membantu pengguna dalam memprioritaskan mana yang harus dimulai terlebih dahulu.

Contohnya,  bila terdapat banyak post, maka perlihatkan bahwa post tersebut dapat digeser pada saat pengguna baru membuka app (tidak hanya langsung muncul saja). Sehingga pengguna tau bahwa untuk melihat post lainnya, mereka dapat melakukan geser layar.

Agar pengguna tidak tersesat pada website

Setelah kita membuat UX yang sepertinya tanpa cacat, maka lebih penting lagi memberikan user sebuah kesadaran spasial. Contohnya, saat sebuah objek bergerak keluar dari layar ke kiri, maka objek tersebut harus masuk lagi dari ruang dimana ia keluar. Ini dapat membantu user memahami bagaimana app berkerja dan dapat membantu mereka merasa lebih nyaman berinteraksi dengannya.

Gunakan feedback untuk menampilkan apa yang telah diselesaikan

Animasi dapat membantu pengguna mengetahui bahwa sebuah app berkerja dengan semestinya.

Bibliography

Babich, N. (2017, January 11). How Functional Animation Helps Improve User Experience. Retrieved May 31, 2018, from Smashing Magazine: https://www.smashingmagazine.com/2017/01/how-functional-animation-helps-improve-user-experience/

Fanguy, W. (2018, May 22). The Importance of Good Animation in UX. Retrieved May 31, 2018, from Invision Blog: https://www.invisionapp.com/blog/importance-good-animation-ux/

Seghers, S. (2017, April 7). The power of animations in UX design. Retrieved May 31, 2018, from Medium: https://medium.com/@Sheby/the-power-of-animations-in-ux-design-ac6fec53d253

Evelyn Pricilia