Warna dan Emosi dalam Desain Interface

Seringkali ketika saya bercengkrama bersama teman-teman membahas tentang “desain interface”, beberapa dari kami memiliki kendala ketika memasuki tahap visual terutama saat menentukan warna yang pas. Dari situ saya tertarik untuk menggali beberapa literatur dan membuat coretan sederhana agar mudah dipahami.

Warna dapat menimbulkan emosi

Sadarkah kalian bahwa warna dapat menstimulus emosi atau perasaan manusia?

Pernahkah kalian mengalami perubahan perasaan saat memasuki ruangan yang memiliki warna berbeda dari ruangan sebelumnya? Sebagai contoh ketika kalian berpindah dari ruangan yang memiliki warna tembok hitam kemudian memasuki ruangan bertembok warna biru, apakah kalian merasa lebih rileks?

Colors, like features, follow the changes of the emotions.

— Pablo Picasso

Menurut penelitian, warna dapat mempengaruhi mood dan menimbulkan perubahaan perasaan. Beberapa warna dapat meningkatkan tekanan darah, peningkatan metabolisme, dan ketegangan mata. Di beberapa negara seperti Mesir dan China bahkan warna digunakan sebagai sarana terapi penyembuhan yang disebut Chromotherapy.

Arti warna

Secara filosifis masing-masing warna memiliki arti yang berbeda-beda.

• Merah : Semangat, Kuat, Penting, Agresif
• Biru : Kalem, Santai, Aman, Terpercaya
• Hijau : Alami, Segar, Stabil
• Kuning : Bahagia, Bersahabat, Mengingatkan
• Orange : Ceria, Segar, Murah
• Ungu : Mewah, Romantis, Misterius
• Pink : Feminim, Muda
• Coklat : Alami, Tradisional
• Hitam : Kuat, Tajam
• Putih : Bersih, Sederhana, Suci
• Abu-abu : Formal, Netral

Secara garis besar warna dapat dikategorikan menjadi tiga kelompok yaitu warna dingin (biru, hijau, ungu), warna panas (merah, pink, orange, kuning), dan warna netral (hitam, putih, abu-abu, coklat).

Meracik skema warna untuk desain interface

Secara teori, ada beberapa macam teknik “mengoplos” warna dalam desain interface. Berikut diantaranya :

• Monochromatic

Monochromatic adalah teknik pemilihan warna menggunakan satu warna dominan/kuat. Teknik ini menimbulkan suasana minimalistik dan harmonis secara keseluruhan.

Contohnya penggunaan warna biru sebagai warna dominan dan elemen-elemen penting lainnya.

• Analogous

Teknik ini hampir sama dengan monochromatic, hanya saja ditambahkan aksen warna tambahan yang diambil dengan cara menggeser warna di palet.

Misalkan kita menggunakan warna dingin : biru, maka warna tambahan diambil dengan menggeser palet sedikit ke arah hijau atau ungu untuk mendapatkan turunannya.

• Complementary (Kontras)

Teknik Complementary adalah memadukan warna yang kontras atau berlawanan untuk menimbulkan kesan “mengundang” yang tegas. Dengan menggunakan teknik ini, pembagian fungsi/konteks menjadi jelas.

Misalkan warna dominan yang digunakan adalah biru, maka bisa dipilih warna pink sebagai warna sekunder.

Warna pink inilah yang nantinya bisa digunakan untuk warna tombol utama ataupun interaksi lainnya. Bila diterapkan dengan konsistensi yang baik maka skema warna ini akan menstimulus user untuk mengingat bahwa warna pink adalah warna tombol/memicu interaksi.

• Split-complementary

Teknik ini merupakan pengembangan dari teknik complementary. yang membedakan adalah digunakannya tambahan warna dari turunan masing-masing warna dominan.

Sebagai contoh, warna utama nya adalah biru dan pink, maka tambahan warna nya diambil dari turunan biru dan pink.

• Triadic

Teknik ini menggunakan tiga warna yang masing-masing sama kuatnya (bukan turunan satu sama lain).

Misalkan kita menggunakan warna biru sebagai warna utama, hijau sebagai warna konten (grafik, icon, dll), dan pink sebagai tombol.

Teknik ini biasanya banyak digunakan untuk membuat interface dengan konten yang beragam ataupun fungsi yang kompleks.

• Rectangular Tetradic

Teknik ini menggunakan dua pasang warna complementary.

Misalkan sebelumnya kita sudah menggunakan biru dan pink, maka bisa ditambahkan satu pasang warna lagi yang tidak terlalu jauh dari warna tersebut misalkan ungu dan orange.

Teknik ini sedikit tricky karena perlu perhatian ekstra demi menjaga konsistensi dalam penerapannya.

Akhir Kata

Warna bisa dibilang merupakan topik yang sangat sensitif, dimana antar satu warna dengan warna yang lainnya tidak ada batas yang jelas. Bahkan antara satu orang dengan orang lain bisa mempersepsikan satu warna menjadi dua pemahaman yang berbeda.

Karena itulah pemilihan warna memang tahap proses desain yang gampang-gampang susah.

Teknik-teknik di atas merupakan teknik dasar yang menurut saya belum tentu bisa langsung diterapkan mentah-mentah dalam pembuatan desain interface karena banyak faktor yang perlu dipertimbangkan.

Kedepannya kita bahas lagi lebih ke teknis dan spesifik :)

Referensi :

https://www.verywell.com/color-psychology-2795824

https://www.uxpin.com/studio/ebooks/color-theory-web-ui-design-practical-principles/

http://www.creativebloq.com/web-design/12-colours-and-emotions-they-evoke-61515112