Kembalinya Taktil: Kedalaman, Kaca, dan Umpan Balik Fisik di UI Modern
Mengapa kedalaman, tembus cahaya, dan gerakan fisik kembali hadir dalam desain UI setelah desain datar, apa yang diubah oleh Liquid Glass dan Material 3 Expressive Apple, dan cara membuatnya tetap dapat digunakan.
Pengambilan Inti
Setelah satu dekade desain datar, kedalaman dan umpan balik fisik kembali hadir. Pada tahun 2025 Apple memperkenalkan Liquid Glass, material tembus pandang untuk kontrol dan navigasi, dan Google memperkenalkan Material 3 Expressive, yang didukung oleh penelitian tentang desain yang lebih emosional. Jika digunakan dengan baik, kedalaman menunjukkan apa yang interaktif dan gerakan menegaskan tindakan; digunakan secara sembarangan, transparansi menurunkan kontras dan mengganggu keterbacaan.
Apa yang berubah pada tahun 2025
Pada tanggal 9 Juni 2025, Apple mengumumkan pembaruan desain perangkat lunak terluasnya, yang dibuat berdasarkan material baru yang disebut Liquid Glass. Ini tembus cahaya, mencerminkan dan membiaskan apa yang ada di belakangnya, dan meluas ke iOS 26, iPadOS 26, macOS Tahoe 26, watchOS 26 dan tvOS 26. Sementara itu, Google menggambarkan Material 3 Expressive sebagai pembaruan sistem desain yang paling banyak diteliti, berdasarkan 46 studi dengan lebih dari 18.000 peserta. Google melaporkan bahwa peserta melihat elemen UI utama hingga empat kali lebih cepat dalam desain ekspresif, dan preferensi tersebut paling kuat, hingga 87%, di antara anak berusia 18 hingga 24 tahun.
Kedalaman dengan pekerjaan yang harus dilakukan
Pedoman Apple bersifat spesifik mengenai lokasi materi: Liquid Glass membentuk lapisan fungsional untuk kontrol dan navigasi yang berada di atas konten, dan tidak boleh digunakan dalam lapisan konten itu sendiri. Itulah prinsip yang berguna di balik keseluruhan tren: kedalaman harus menjelaskan struktur, memisahkan apa yang dapat Anda lakukan dari apa yang Anda baca.
Biaya kegunaan
Tidak semua orang yakin. Nielsen Norman Group berpendapat bahwa Liquid Glass di iOS 26 mengaburkan konten dan apa pun yang diletakkan di atas sesuatu yang lain menjadi lebih sulit dilihat, terutama teks dengan latar belakang sibuk. Pelajaran praktisnya adalah bahwa transparansi memerlukan pagar pembatas: menguji kontras pada konten nyata, meningkatkan keburaman atau opasitas di balik teks, dan mendukung pengaturan sistem untuk mengurangi transparansi dan meningkatkan kontras.
Umpan balik fisik adalah bagian yang tahan lama
Tren visual datang dan pergi, namun umpan balik fisik bertahan karena membantu orang. Sebuah tombol yang sedikit terkompresi saat ditekan, lembaran yang mengikuti jari dan menempel dengan pegas, atau tombol yang terpasang pada tempatnya, semuanya mengonfirmasi bahwa suatu tindakan telah dicatat. Fisika pegas adalah alat alami untuk melakukan hal ini, karena ia merespons interupsi dan kecepatan gerakan seperti yang dilakukan objek nyata.
Bagaimana cara mengadopsinya dengan hati-hati
Mulailah dengan umpan balik, bukan hiasan:
- Tambahkan umpan balik tekan, seret, dan lepaskan ke kontrol yang paling sering digunakan orang.
- Gunakan layering dan bayangan untuk memisahkan kontrol dari konten.
- Periksa kontras teks di atas permukaan tembus pandang.
- Hormati pengurangan gerakan, pengurangan transparansi, dan peningkatan pengaturan kontras.
- Pertahankan konsistensi efek melalui token gerakan dan ketinggian.
Kunci Principles untuk Diingat
- Apple memperkenalkan Liquid Glass pada Juni 2025; Google memperkenalkan Material 3 Ekspresif
- Kedalaman berfungsi ketika memisahkan kontrol dari konten
- Transparansi dapat merusak kontras dan keterbacaan; uji dengan konten nyata
- Umpan balik fisik (tekan, tarik, pegas) adalah bagian tren yang tahan lama
- Hormati pengurangan gerakan, pengurangan transparansi, dan peningkatan kontras
Pertanyaan yang Sering Diajukan
Sumber
- Apple introduces a delightful and elegant new software design — Ruang Berita Apple (9 Juni 2025)
- Materials — Pedoman Antarmuka Manusia Apple
- Liquid Glass Is Cracked, and Usability Suffers in iOS 26 — Nielsen Norman Group
- Expressive Design: Google's UX Research — Desain Google