Hukum UX & Psikologi Kognitif

Desain sistem bukan sekadar preferensi visual atau gaya estetika, melainkan penerapan kaidah ilmiah psikologi kognitif manusia. Setiap komponen dalam Majalengka Design System dikalibrasi untuk mematuhi hukum-hukum kognitif antarmuka:

1. Hukum Penargetan & Keputusan

Hukum Fitts (Fitts's Law)

Waktu untuk meraih suatu target merupakan fungsi dari jarak ke target dan lebar target.

• Penerapan di Majalengka:
  • Tombol aksi utama dibuat dengan visual proporsional (32px / 40px / 48px) namun memiliki hit-area sentuh minimal 44×44px pada perangkat seluler (@media (pointer: coarse)).
  • Aksi penting diletakkan di area jangkauan ibu jari (bottom-sheet / mobile drawer) agar mudah disentuh.
• Larangan: Jangan menaruh ikon aksi berukuran kecil (< 24px) saling berdekatan tanpa bantalan ruang klik.

Hukum Hick-Hyman (Hick's Law)

Waktu yang dibutuhkan untuk mengambil keputusan meningkat secara logaritmik seiring bertambahnya jumlah pilihan.

• Penerapan di Majalengka:
  • Formulir panjang dibagi bertahap menggunakan komponen Stepper.
  • Pilihan layanan dikelompokkan dalam kategori logis (maksimal 5–7 opsi per grup). Opsi rekomendasi disorot agar warga tidak mengalami kebuntuan analisis (decision paralysis).

2. Memori Kerja & Persepsi

Hukum Miller (Miller's Law) & Chunking

Memori kerja manusia hanya dapat menampung rata-rata 7 ± 2 unit informasi (chunks) sekaligus.

• Penerapan di Majalengka:
  • Nomor Induk Kependudukan (NIK) 16 digit dipisahkan visualnya per 4 blok: 3210 1234 5678 0001.
  • Kode verifikasi OTP dipecah menjadi 6 kotak input terpisah (.mjl-pin-input).
  • Nomor telepon diformat dengan tanda hubung agar mudah diingat saat verifikasi SMS.

Hukum Jakob (Jakob's Law)

Pengguna menghabiskan sebagian besar waktunya di situs lain. Mereka mengharapkan situs Anda bekerja dengan cara yang sudah biasa mereka gunakan.

• Penerapan di Majalengka:
  • Logo/identitas pengelola situs selalu berada di kiri atas dan mengarah ke Beranda.
  • Pita identitas pengelola (TrustBanner), kalau dipakai, berada di puncak teratas halaman.
  • Tombol konfirmasi utama berada di sisi kanan bawah dialog modal.
  • Breadcrumb berada tepat di atas judul konten.

Efek Von Restorff (Isolation Effect)

Ketika beberapa objek serupa hadir, objek yang tampil berbeda adalah yang paling diingat dan dipilih.

• Penerapan di Majalengka:
  • Dalam satu layar atau kartu formulir, hanya ada 1 tombol primer berwarna Biru Majalengka 700 (#0014A8).
  • Aksi bantuan (Batal, Kembali, Simpan Draf) menggunakan gaya sekunder atau outline netral agar tidak bersaing menarik atensi visual.

3. Ketahanan Sistem & Reduksi Kompleksitas

Hukum Tesler (Conservation of Complexity)

Setiap sistem memiliki jumlah kompleksitas dasar yang tidak bisa dihilangkan, melainkan harus diserap: oleh sistem, atau oleh pengguna.

• Penerapan di Majalengka:
  • Kompleksitas validasi diserap oleh sistem: formulir otomatis membersihkan spasi tak sengaja, mendeteksi huruf besar/kecil, dan mengenali format penulisan tanggal Indonesia tanpa menolak warga secara kaku.

Hukum Postel (Prinsip Robustness)

"Be conservative in what you send, liberal in what you accept." Bersikaplah toleran terhadap apa yang diterima, dan disiplin terhadap apa yang dikirim.

• Penerapan di Majalengka:
  • Kolom nomor HP menerima variasi input 0812..., +62812..., maupun 62812..., lalu dinormalisasi otomatis ke format standar sebelum dikirim ke API backend.

4. Kecepatan & Persepsi Waktu

Doherty Threshold (< 400ms)

Produktivitas pengguna meningkat drastis saat sistem merespons di bawah 400 milidetik.

• Penerapan di Majalengka:
  • Komponen Skeleton shimmer digunakan saat memuat data agar warga segera melihat struktur halaman sebelum konten tiba, mencegah kekhawatiran bahwa sistem macet.
  • Hover state dan feedback klik tombol dirancang instan (< 80ms) mengikuti prinsip desain modern Kumo UI agar antarmuka terasa gesit dan responsif.

Efek Goal-Gradient

Kecenderungan untuk mendekati suatu tujuan meningkat seiring semakin dekatnya individu dengan garis akhir.

• Penerapan di Majalengka:
  • Stepper alur permohonan menampilkan persentase progres yang jelas.
  • Tahap awal pengajuan dibuat seringkas mungkin (misal: verifikasi NIK) agar warga merasa sudah "memulai dan unggul" sebelum mengisi data yang lebih detail.