Kenapa gerak itu penting
Nielsen Norman Group menjelaskan empat tugas yang dikerjakan gerak dengan baik di sebuah antarmuka. Masing-masing membantu orang memahami sesuatu yang mungkin terlewat.
- Umpan balik: menunjukkan bahwa sistem menangkap aksimu, seperti tombol yang terlihat tertekan.
- Perubahan state: menunjukkan sesuatu berganti mode, seperti ikon putar yang berubah jadi jeda.
- Navigasi: menunjukkan ke mana kamu pergi, seperti panel yang meluncur dari samping.
- Penanda: memberi petunjuk apa yang bisa kamu lakukan, seperti kartu yang sedikit mengintip untuk menunjukkan bahwa ia bisa digeser.
Timing dan easing
Tidak ada benda di dunia nyata yang mulai atau berhenti seketika. Easing adalah cara animasi mempercepat dan melambat, dan itulah perbedaan terbesar antara gerak yang terasa murahan dan gerak yang terasa pas. Sebagian besar gerak di antarmuka itu singkat, hanya sepersekian detik, jadi membantu tanpa membuat orang menunggu.
Linear Seperti robot. Kecepatannya sama dari awal sampai akhir.
Ease out Mulai cepat, berhenti lembut. Cocok untuk elemen yang datang.
Spring Sedikit memantul lewat batas. Jenaka, pakai dengan hati-hati.
Mikro-interaksi
Mikro-interaksi adalah momen kecil yang dibangun di sekitar satu tugas: menyukai postingan, menyalakan pengaturan, menarik layar untuk memuat ulang. Masing-masing punya pemicu, respons, dan kadang sedikit kepribadian. Di sinilah banyak produk menunjukkan mereknya.
Gerak untuk semua orang
Sebagian orang merasa pusing atau mual melihat gerakan di layar. Sistem operasi memungkinkan mereka meminta gerak yang dikurangi, dan situs web bisa menghormatinya lewat pengaturan prefers-reduced-motion. Bagian dari pekerjaanmu adalah mendesain versi tenang dari setiap animasi.
Motion graphics untuk merek
Di luar antarmuka, kamu akan menganimasikan elemen merek: logo yang menyusun dirinya sendiri, postingan media sosial dengan tipografi bergerak, video produk pendek yang berulang. Kamu akan membuat prototipe di Figma dan memakai alat AI untuk menjelajahi ide dan storyboard dengan cepat.
