People Innovation Excellence
 

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


Published at : Updated
Leave Your Footprint

    Periksa Browser Anda

    Check Your Browser

    Situs ini tidak lagi mendukung penggunaan browser dengan teknologi tertinggal.

    Apabila Anda melihat pesan ini, berarti Anda masih menggunakan browser Internet Explorer seri 8 / 7 / 6 / ...

    Sebagai informasi, browser yang anda gunakan ini tidaklah aman dan tidak dapat menampilkan teknologi CSS terakhir yang dapat membuat sebuah situs tampil lebih baik. Bahkan Microsoft sebagai pembuatnya, telah merekomendasikan agar menggunakan browser yang lebih modern.

    Untuk tampilan yang lebih baik, gunakan salah satu browser berikut. Download dan Install, seluruhnya gratis untuk digunakan.

    We're Moving Forward.

    This Site Is No Longer Supporting Out-of Date Browser.

    If you are viewing this message, it means that you are currently using Internet Explorer 8 / 7 / 6 / below to access this site. FYI, it is unsafe and unable to render the latest CSS improvements. Even Microsoft, its creator, wants you to install more modern browser.

    Best viewed with one of these browser instead. It is totally free.

    1. Google Chrome
    2. Mozilla Firefox
    3. Opera
    4. Internet Explorer 9
    Close