Cara memilih, memakai dan keseimbangan color palette untuk UI desain
Summary
Halo namaku dedy, saya baru memulai karir di UI/UX. Disini masih ada yang nanya
“kak untuk pilih warna yang bagus untuk desain caranya gimana?” Atau “kak solusi dong untuk masih kurang bagus hal warna.”
Yah saya juga termasuk kok di saat awal UI desain, setelah lihat tutorial video dan mempelajari materi hal warna. Saya akan membagikan hasil pembelajaran tentang warna. Sebelum itu saya terinpirasi dari artikel Danny Sapio. Artikel yang dibawa sangat membantu dan lengkap.
1. Gunakan color palette
Apa itu color palette?
Color palette itu sekumpulan warna yang di mix dan match sehingga menghasilkan kombinasi warna yang unik, menarik dan menciptakan suasana hati atau perasaan yang diinginkan. Warna-warna hangat menciptakan perasaan dinamis, warna-warna sejuk menciptakan perasaan yang menenangkan, netral dapat digunakan untuk meningkatkan atau melunakkan salah satu dari itu atau untuk menciptakan perasaan yang canggih.
“Cara untuk mendapatkan color palette yang bagus?.”
Untuk caranya yaitu memahami tentang teori warna dan toolsnya
Step 1 — Primary and Secondary color
Primary color yaitu warna yang paling sering ditampilkan di seluruh layar dan komponen aplikasi. Ini biasanya warna yang ditetapkan merek sebagai identitas. Menggunakan warna merek sebagai Primary color memperkuat kesadaran merek tersebut.
Secondary color memberikan lebih banyak cara untuk menonjolkan dan membedakan produk. Memiliki Secondary color adalah opsional, jadi kamu bisa pakai primary color jika tidak mempunyai secondary color
Step 2 — Background, surface dan teks color
Saya biasa nya buat tampilan awal UI pertamanya untuk background warna putih sebagai dasar warna, Surface untuk card / kartu dan warna terakhir menentukan warna teks.
Step 3 — buat color palette
Ini color palette saya buat untuk desain UI. Karena saya hanya ambil inti materinya, jadi untuk lebih detail bisa belajar di material design.
Step 4 — kombinasi semua
Ini website untuk mencari color palette
Dribbble.com/colors
Dribbble sangat direkomendasikan untuk mencari inspirasi UI. Untuk mencari warna ada di fitur color search, tekan dan pilih warna yang kamu sukai atau warna produk.
Color Hunt
Color Hunt menurut saya, tempat website yang suka mencari warna. saya sudah cek dan warnanya saya lihat bagus. rekomendasi.
ColorPalette
Website ini menggunakan gambar pemandangan, dekorasi dll dan menjadikan color palette di gambar tersebut. cocok yang suka cari inspirasi untuk desain dan Foto.
Coolors
Yang mau generator color palette hanya beberapa detik, Coolors pilihan yang bagus. Karena mudah di pakai, fitur yang saya coba lumayan membantu.
2. Pakai rule 60–30–10
Saya mempelajari rule 60–30–10 dari artikel Wojciech Zieliński. Di artikel di bawa cara memakai warna untuk UI desain. Arti dari rule 60–30–10 yaitu
60% adalah warna dominan, 30% adalah warna sekunder dan 10% untuk warna aksen.
Aturan desain interior ini adalah teknik dekorasi yang dapat membantu menyatukan skema warna dengan mudah. Proporsi 60% + 30% + 10% dimaksudkan untuk memberikan keseimbangan pada warna. Formula ini bekerja karena menciptakan rasa keseimbangan dan memungkinkan mata untuk bergerak dengan nyaman dari satu titik fokus ke titik fokus berikutnya. Ini juga sangat mudah digunakan.
Saya sudah mencobanya dan sedang menerapkan rule 60–30–10 ini dan sangat membantu.
Ini warna saya pakai untuk rule 60–30–10
Artikel untuk rule 60–30–10
How the 60–30–10 rule saved the day
Di dalam artikel tersebut kasusnya redesign dan menggunakan rule 60–30–10. Saya sudah baca dan mudah untuk dimengertikan
Flowapp
Website ini memberikan tips dan trick rule 60–30–10 dengan singkat dan jelas.
Mungkin segitu saja saya bahas. Sebenarnya masih banyak materinya seperti:
- Color Terminology
- Color meaning
- Color wheel
- State, dll.
Hehehe cuma ku bagikan yang menurutku bagus untuk yang masih kurang di bagian warna, jika ada salah atau kurang lengkap mohon bisa dikomentari, saya baru belajar juga. Harap baca Artikel yang sudah ku catumkan disana sudah lengkap dan detail masalah warna.
Terimakasih sudah membaca.