FITTS' LAW: ILMU DI BALIK UKURAN DAN POSISI TOMBOL

 

MUHAMMAD IKHSAN

240401116

TEKNIK INFORMATIKA

UNIVERSITAS MUHAMMADIYAH RIAU

 

Mengapa Tombol Kecil Sering Membuat Kita Kesal?

Pernah merasa kesal karena salah menekan tombol di aplikasi ponsel? Atau butuh beberapa kali percobaan hanya untuk menutup iklan kecil di layar? Pengalaman sederhana ini sebenarnya berkaitan erat dengan satu prinsip penting dalam Interaksi Manusia dan Komputer (IMK), yaitu Fitts' Law.

  

PENDAHULUAN

Dalam perkuliahan IMK, kita belajar bahwa desain antarmuka tidak hanya soal tampilan yang menarik, tetapi juga tentang bagaimana manusia berinteraksi secara alami dengan sistem. Fitts' Law menjelaskan hubungan antara ukuran, jarak, dan waktu yang dibutuhkan pengguna untuk mencapai suatu target di layar. Prinsip ini sangat relevan dalam dunia desain UI/UX modern.

Artikel ini membahas Fitts' Law secara sederhana, aplikatif, dan dekat dengan pengalaman sehari-hari pengguna.

 

APA ITU FITTS’ LAW?

Fitts' Law menyatakan bahwa:

Semakin besar dan semakin dekat suatu target, semakin cepat dan mudah target tersebut dijangkau oleh pengguna.

Dalam konteks digital, target ini bisa berupa tombol, ikon, menu, atau elemen interaktif lainnya. Sebaliknya, tombol yang kecil dan jauh akan membutuhkan waktu lebih lama dan meningkatkan risiko kesalahan.

 

MENGAPA FITTS’ LAW PENTING DALAM DESAIN UI

Prinsip ini membantu desainer memahami keterbatasan motorik manusia. Tangan dan jari kita tidak selalu presisi, apalagi saat menggunakan layar sentuh. Dengan menerapkan Fitts' Law, desain menjadi:

  • Lebih efisien
  • Lebih nyaman digunakan
  • Lebih minim kesalahan (error)

 

CONTOH PRAKTIS PENERAPAN FITTS’ LAW 

  Tombol “Kirim” pada Aplikasi Chat

Pada aplikasi seperti WhatsApp atau Telegram, tombol Kirim dibuat cukup besar dan berada dekat dengan area pengetikan.
Hal ini sesuai dengan Fitts’ Law karena:

  • Jarak jari ke tombol sangat dekat
  • Ukuran tombol cukup besar
    → Pengguna bisa mengirim pesan lebih cepat dan minim kesalahan

  Tombol Navigasi di Bagian Bawah Layar Smartphone

Banyak aplikasi menempatkan menu utama di bagian bawah layar (bottom navigation).
Alasannya:

  • Ibu jari lebih mudah menjangkau bagian bawah layar
  • Target lebih dekat → waktu interaksi lebih singkat

Contohnya: menu Home, Search, dan Profile di Instagram.

 

   Sudut Layar pada Desktop

Pada sistem operasi desktop, sudut layar (misalnya pojok kiri bawah untuk Start Menu) sangat mudah diakses.
Pointer mouse akan “berhenti” secara alami di sudut layar, sehingga:

  • Target lebih mudah dicapai
  • Interaksi lebih cepat

  

TIPS APLIKATIF UNTUK MAHASISWA DAN DESAINER PEMULA

 

Berikut beberapa tips sederhana yang bisa langsung diterapkan:

  • Gunakan tombol dengan ukuran yang cukup besar untuk aksi utama
  • Letakkan elemen penting di area yang mudah dijangkau
  • Beri jarak yang cukup antar elemen interaktif
  • Uji desain menggunakan perangkat nyata, bukan hanya di layar komputer

 

KESIMPULAN

Fitts' Law mengajarkan kita bahwa desain yang baik adalah desain yang memahami manusia. Dengan memperhatikan ukuran dan posisi elemen antarmuka, kita bisa menciptakan sistem yang lebih ramah, efisien, dan menyenangkan untuk digunakan.

Sebagai mahasiswa Teknik Informatika, pemahaman prinsip ini sangat penting, terutama dalam pengembangan aplikasi dan sistem interaktif.

 

 

 

 

 

Artikel ini ditulis sebagai bagian dari pembelajaran mata kuliah Interaksi Manusia dan Komputer di Program Studi Teknik Informatika, Universitas Muhammadiyah Riau. Informasi lebih lanjut mengenai Universitas Muhammadiyah Riau dapat diakses melalui website resmi:

🔗 https://www.umri.ac.id

 

 

REFERENSI

·  Fitts, P. M. (1954). The information capacity of the human motor system in controlling the amplitude of movement. Journal of Experimental Psychology, 47(6), 381–391.

·  Norman, D. A. (2013). The Design of Everyday Things (Revised and Expanded Edition). New York: Basic Books.

·  Nielsen, J. (1994). Usability Engineering. San Francisco: Morgan Kaufmann.

·  Nielsen Norman Group. (n.d.). Fitts’s Law and User Interface Design. Diakses dari https://www.nngroup.com

·  Shneiderman, B., Plaisant, C., Cohen, M., Jacobs, S., Elmqvist, N., & Diakopoulos, N. (2016). Designing the User Interface: Strategies for Effective Human-Computer Interaction. Pearson Education.

·  Dix, A., Finlay, J., Abowd, G. D., & Beale, R. (2004). Human-Computer Interaction (3rd ed.). Harlow: Pearson Education.

·  Materi perkuliahan Interaksi Manusia dan Komputer (IMK), Program Studi Teknik Informatika, Universitas Muhammadiyah Riau. Diakses melalui https://www.umri.ac.id