Law of Common Region

Ini masih satu keluarga dengan prinsip Gestalt lainnya seperti Proximity dan Similarity. Bedanya, Law of Common Region ini fokus pada bagaimana batasan visual (seperti border, background color, atau shape) membuat elemen-elemen di dalamnya terlihat sebagai satu kelompok.

Contoh paling simpel di dunia nyata: lapangan sepakbola. Garis-garis putih di lapangan membagi area menjadi beberapa zona: area penalti, lingkaran tengah, dll. Pemain dan penonton langsung paham bahwa area di dalam garis itu punya fungsi yang berbeda dari area di luarnya.

Di dunia UI dan UX, Law of Common Region ini sangat sering dipakai. Card component adalah contoh paling umum. Sebuah card dengan border atau background tertentu langsung membuat semua elemen di dalamnya (judul, gambar, deskripsi, tombol) terasa sebagai satu kesatuan.

Coba perhatiin dashboard manapun seperti Notion, Trello, atau Google Analytics. Mereka semua menggunakan card, panel, dan section dengan background atau border yang berbeda untuk mengelompokkan informasi yang berkaitan. Tanpa batasan visual ini, semua informasi akan terlihat bercampur aduk.

Yang menarik, Common Region bisa "mengalahkan" Proximity. Dua elemen yang jaraknya berjauhan tapi berada di dalam satu card akan terlihat lebih berkaitan dibanding dua elemen yang berdekatan tapi berada di card yang berbeda.

Tips praktis: gunakan background color yang subtle untuk mengelompokkan, jangan terlalu banyak border yang tebal. Dan pastikan hierarki region-nya jelas, jangan bikin region di dalam region di dalam region sampai user bingung.