Artikel dapat diunduh pada link berikut: pdf
Berdasarkan penelitian yang dilakukan Steve Hoober mengenai penggunaan perangkat mobile, sebanyak 49% pengguna bergantung kepada satu jari yaitu ibu jari untuk menyelesaikan urusannya di ponsel mereka. Gambar di bawah menjelaskan bagaimana jari biasanya bekerja pada sebuah ponsel. Daerah hijau adalah daerah yang dapat dijangkau dengan mudah, daerah kuning adalah daerah di mana pengguna harus meregangkan jari mereka, dan daerah merah adalah daerah di mana pengguna harus mengubah cara mereka memegang ponsel agar dapat menjangkau daerah tersebut.
Salah satu screen control/widget yang dapat memudahkan pengguna ketika menggunakan ponsel hanya dengan satu jari adalah bottom navigation bar. Bottom navigation bar digunakan untuk berpindah antara fitur-fitur utama yang ada di sebuah aplikasi. Fitur-fitur yang penting untuk ditampilkan di bottom navigation bar adalah fitur utama dan sering digunakan oleh pengguna. Bottom navigation bar adalah widget yang mudah dijangkau oleh pengguna, tampil di bawah layar setiap fitur, dan fitur yang tampil sama pentingnya satu sama lain.
Bottom navigation bar memiliki bagian-bagian yaitu (1) container, (2) inactive icon, (3) inactive text label, (4) active icon, dan (5) active text label. Icon yang terdapat di bottom navigation bars haruslah serasi dengan text label yang ditampilkan. Tampilan text label harus singkat, padat, dan jelas mendeskripsikan fitur apa yang akan tampil jika pengguna memilih fitur tersebut. Tampilan text label juga tidak boleh terlalu kecil karena hanya akan menyusahkan pembacaan bagi beberapa pengguna.
Bottom navigation bar hanya digunakan di perangkat mobile dan tablet. Jumlah fitur yang ditampilkan antara 3 sampai 5, jika fitur yang ditampilkan kurang dari tiga maka tidak cocok dan lebih baik memakai tab yang berada di atas layar, jika lebih dari lima maka akan sulit untuk ditekan karena posisinya yang terlalu berdekatan dan hanya menambah kompleksitas suatu aplikasi. Bottom navigation bar dapat dihilangkan untuk sementara ketika memunculkan fitur seperti on-screen keyboard. Setiap elemen di bottom navigation bar haruslah memiliki posisi yang pasti yaitu tidak dapat digeser (scroll) secara horizontal. Bottom navigation bar tidak digunakan untuk pilihan dengan hanya satu tugas seperti hanya untuk melihat email. Bottom navigation bar juga tidak digunakan untuk fitur seperti pengaturan.
Bottom navigation memiliki ciri perilaku (behavior) khusus di dalam pengunaannya. Perilaku tersebut dapat ditinjau dari segi navigation, badges, scrolling, transition, dan color. Navigation menjelaskan cara kerja dari bottom navigation, misal dalam perangkat Android ketika memilih salah satu pilihan maka akan muncul layar awal (utama) dari pilihan tersebut dan akan mengulang semua interaksi yang pernah dilakukan pengguna di pilihan tersebut.
Ikon dari bottom navigation dapat memiliki badges yaitu tanda notifikas di ujung kanan ikon. Dalam scrolling, bottom navigation bar dapat hilang dan muncul kembali. Hilang ketika pengguna melakukan scroll ke bawah dan muncul kembali ketika scroll ke atas. Transisi antarpilihan fitur dari bottom navigation lebih baik menggunakan transisi cross-fade yaitu transisi di mana fitur sebelumnya akan menghilang atau tertimpa oleh fitur yang dipilih selanjutnya, tidak disarankan untuk menggunakan transisi lateral (side-to-side) yaitu transisi menggeser ke samping karena akan mengimplikasikan hubungan antara fitur tersebut dengan fitur yang dipilih selanjutnya dan dapat membuat pengguna berpikir bahwa mereka dapat menggunakan gestur untuk berpindah antarfitur. Warna bagian-bagian bottom navigation bar perlu untuk diperhatikan. Gunakan warna dominan aplikasi untuk menandakan fitur yang sedang aktif, hindari penggunaan warna yang berbeda beda untuk setiap icon dan text label, jika container dari bottom navigation bar berwarna selain putih dan hitam maka gunakan icon dan text label warna putih atau hitam, dan pastikan warna icon dan text label contrast dengan warna container.
Masalah-masalah yang mungkin muncul dalam penggunaan bottom navigation bar di antaranya adalah struktur navigasi membingungkan, memakan banyak tempat di layar ponsel, text label yang terlalu kecil, dan sentuhan tidak disengaja. Struktur navigasi di bottom navigation bar haruslah sesederhana mungkin dan tidak bercampur antara fitur yang satu dengan yang lainnya. Bottom navigation bar dapat memakan banyak tempat di layar ponsel, oleh karena itu bottom navigation bar sebaiknya hanya muncul untuk menampilkan pilihan-pilihan task yang ada dan tidak muncul untuk fungsi-fungsi selanjutnya.
Sebuah aplikasi yang hanya memiliki satu fitur utama dan hanya fitur tersebut yang digunakan dalam waktu lama oleh pengguna sangat tidak direkomendasikan menggunakan bottom navigation bar sebagai salah satu widgetnya. Hal tersebut dikarenakan sebagian besar waktu pengguna yaitu sekitar 90% hanya digunakan untuk satu fitur tersebut sehingga tidak efektif dalam penggunaannya. Contoh aplikasinya adalah aplikasi mailbox dan obrolan. Penggunaan bottom navigation bar juga harus dihindari untuk sebuah aplikasi yang tidak didedikasikan untuk perangkat mobile karena bottom navigation bar hanya akan memakan banyak tempat di layar dan tidak ada keuntungan tambahan dari penggunannya.
Salah satu bentuk implementasi dari bottom navigation bar dapat dilihat di aplikasi KAI Access buatan Indonesia. Penggunaan bottom navigation bar dalam aplikasi tersebut kurang sesuai. Ketidaksesuainnya tersebut dikarenakan pengguna biasanya hanya menggunakan satu fitur utama yaitu pesan tiket dan tidak sering menggunakan fitur lainnya, sebaiknya pengembang aplikasi menggunakan widget side menu untuk menggantikan bottom navigation bar. Meskipun demikian, penggunaan bottom navigation bar di aplikasi tersebut cukup baik seperti sebanyak 4 fitur ditampilkan di bottom navigation bar pada aplikasi tersebut, warna icon dan text label sesuai dengan warna dominan dari aplikasi yaitu biru tua, dan bottom navigation bar juga tidak selalu muncul di setiap layar, hanya muncul untuk menampilkan pilihas-pilihan fitur yang ada sehingga tidak memakan banyak tempat dan mengganngu dalam penggunaannya. Namun terdapat beberapa hal yang perlu diperbaiki seperti icon pada text label “MY TRIPS” tidak serasi seharusnya bisa diganti menjadi icon yang lebih mendefinisikan text label tersebut dan jika menekan tombol “Back” di setiap layar pertama dari active icon akan langsung mengakhiri aplikasi. Hal tersebut dapat menggangu pengguna yang baru pertama kali menggunakan aplikasi tersebut, seharusnya tombol “Back” mengembalikan pengguna ke fitur yang dipilih sebelumnya atau mengembalikan ke fitur “HOME” dan baru setelah itu tombol “Back” dapat mengakhiri aplikasi.
Sumber:
[Anonim]. Bottom Navigation. [Online] Available at: https://material.io/design/components/bottom-navigation.html [Accessed 13 November 2018]
Babich, N. 2016. UX Design for Mobile: Bottom Navigation. [Online] Available at: https://uxplanet.org/perfect-bottom-navigation-for-mobile-app-effabbb98c0f [Accessed 13 November 2018].
Thalion. 2017. When Bottom Navigation Fails? Revealing the Pain Points. [Online] Available at: https://uxmisfit.com/2017/07/09/when-bottom-navigation-fails-revealing-the-pain-points/ [Accessed 13 November 2018].
Latif's Blog 