Tasarımda Renk Psikolojisi

Her renk bir karardır. Bir düğmedeki kırmızı, dekorasyon değil, bir dönüştürme bahsidir. Bir sağlık uygulamasındaki mavi, estetik tercih değil, bir güven sinyalidir. Bunu anlayan markalar işe yarayan paletler gönderir. Anlamayan markalar iyi görünen ve hiçbir şeyi dönüştürmeyen paletler gönderir.

Renk psikolojisinin gerçek tasarım kararlarıyla karşılaştığında tam olarak nasıl göründüğü budur.

Renkler dekoratif değildir

Renk, beyinin bir görselle karşılaştığında işlem gördüğü ilk şeydir. Göz bir başlığı okuması veya bir logoyu tanıması öncesinde, zaten renge yanıt vermiştir. Bu tepki duygusal, anlık ve çoğunlukla bilinçdışıdır.

Bu mistisizm değil. Bu sinirbilim. Renk, kültür, deneyim ve bağlamdan oluşturulan dernekleri tetikler. Kırmızı evrensel olarak "tehlike" anlamına gelmez. Nerede göründüğüne ve neyin etrafını sardığına bağlı olarak, aciliyet, enerji, tutku, iştah veya uyarı anlamına gelir.

Çoğu tasarımcının yaptığı hata, renk psikolojisini bir arama tablosu olarak ele almaktır. Kırmızı heyecana eşittir, mavi güvene eşittir, yeşil doğaya eşittir. Bu çerçeve çok basittir yararlı olabilecek kadar. Renk psikolojisi bağlamsal, evrensel değil.

Her renk gerçekte ne iletir

İşte dürüst dökümü. Aşırı basitleştirilmiş sürümü değil, ama her renk gerçek bir ürün, gerçek bir marka veya gerçek bir arayüzde göründüğünde ne yapar.

Kırmızı, diğer herhangi bir renkten daha hızlı dikkat çeker. Coca-Cola, YouTube ve Netflix, kırmızı aciliyet ve iştahı tetiklediği için bunu kullanır. Bir arayüzde, kırmızı senin "şimdi harekete geç" rengidir: satış rozetleri, hata durumları, nötr sayfalarda birincil CTA'lar. Ölçülü kullanın yoksa hiçbir şey ifade etmez.

Mavi, bir nedenden dolayı internetin sevdiği renktir. Güven, istikrar ve yetkinlik sinyali verir. PayPal, LinkedIn ve Calm'ın tümü "burada güvendesin" söylemek için maviye dayanır. Risk sıkıcılıktır. Alanınızda her rakip mavi kullanıyorsa, mavi kimliğin kalabalık içinde kaybolur.

Yeşil, çift görev yapar. Sağlık ve ekoloji markalarında (Whole Foods, Beyond Meat), doğal ve sağlıklı olarak okunur. Fintech'te (Robinhood, Mint), para ve büyüme olarak okunur. Spotify, müzik için yeşil kullanarak kalıbı kırdı ve güçlü markalamanya, varsayılan dernekleri geçersiz kılabileceğini kanıtladı.

Sarı, saf iyimserlik ve sıcaklıktır, ama iyi bir şekilde kullanılması en zor renktir. Çok sarı ezicidir. Çok az kaybolur. Snapchat, IKEA ve National Geographic bunu arka plan yıkaması değil, hakim bir sinyal olarak kullanır. En iyi küçük, yüksek kontrastlı dozlarda işler.

Mor, premium ve gelenekçi olmayan sinyali verir. Figma, Twitch ve Cadbury bunu mavi-yeşil çoğunluktan ayırt etmek için kullanır. Fintech'te, mor "biz senin babanın bankası değiliz" der. Çocumsallaşmadan yaratıcı olarak okunur.

Turuncu, kırmızının aciliyeti ile sarının sıcaklığı arasında dostça orta yerdir. Headspace, HubSpot ve Fanta bunu enerji verici ama erişilebilir hissetmek için kullanır. Kırmızının alarmı olmadan açık ve koyu arka planlar karşısında bir ışık içinde durduğu için en güçlü CTA renklerinden biridir.

Siyah, otorite ve lüksü iletir. Apple, Chanel ve The New York Times bunu "ilginç olmak için renge ihtiyacımız yok" söylemek için kullanır. Editoryal tasarımda siyah güvendir. Modada, bu premium'dur. Teknolojide, çaba olmaksızın sofistikasyon budur.

Bağlam teoriden üstün olur

Spotify yeşildir. Whole Foods da. Biri müzik akışını satıyor. Diğeri organik bakkaliye satıyor. Aynı renk, tamamen farklı dernekler. Yeşil her iki bağlamda da aynı işi yapamıyor.

Renk psikolojisi tavsiyesinin çoğunun çöktüğü yer burası. Renkler, üç faktöre bağlı olarak değişen esnek sinyaller olduğunda, sabit anlam olarak ele alır.

Doygunluk ve değer. Soluk toz pembesi, neon sıcak pembeyle tamamen farklı bir şey iletir. Aynı ton, farklı gezegen. Desature edilmiş renkler, gelişmiş ve sakin olarak okunur. Doymuş renkler cesur ve enerjik olarak okunur.

Komşu renkler. Beyaz bir sayfadaki kırmızı düğme, kendinden emin bir CTA olarak okunur. Turuncu bir sayfadaki aynı kırmızı düğme gürültü olarak okunur. Renkler tek başına var olamaz. Onların yanında olan her şeyle ilişkide var olurlar.

Kültürel bağlam. Beyaz, batı tasarımında saflık anlamına gelir. Doğu Asya'nın bazı bölümlerinde yas anlamına gelir. Coğrafyayı göz ardı eden herhangi bir çerçeve eksiktir.

Dönüştüren paletler için üç kural

Bu makaleden başka hiçbir şey almazsanız, bu üçünü alın.

Kural 1: Kontrast eylemi sürüler. Herhangi bir arayüzde en önemli renk kararı, CTA için hangi rengi seçtiğin değil. Ekrandaki eylem ile diğer her şey arasında ne kadar kontrast yarattığındır. Bir düğme, bağlamında görsel olarak en farklı öğe olduğu sürece herhangi bir renk olabilir.

Kural 2: Tutarlılık tanıma oluşturur. Daha az renk seçin ve her yerde aynı şekilde kullanın. Stripe sonsuza kadar mor kullanır. Mailchimp tutarlı bir şekilde sarı kullanır. Renk paleti kendisi, her marka dokunma noktasında uygulanmasının tutarlılığından daha az önemlidir.

Kural 3: Erişilebilirlik isteğe bağlı değildir. Erkeklerin yüzde 8'i ve kadınların yüzde 0,5'i bir tür renk görme eksikliğine sahiptir. Tasarımınız anlamı iletmek için yalnızca renge dayanıyorsa, milyonlarca kullanıcıyı dışlıyorsunuz. Rengi her zaman metin, simge veya desenleriyle eşleştirin.

Paletinizi nasıl test edersiniz

Dört test. Beş dakika. Dördünü de çalıştırmadan göndermeyin.

1. Kısık test. Paletinizde kısık gözlerle, her şey bulanıklaşana kadar. Hala birincil eylemin nerede olduğunu söyleyebilir misin? CTA kaybolursa, kontrastınız başarısız olmuştur.
2. Gri tonlama testi. Tasarımınızı gri tonlamaya dönüştürün. Hiyerarşi hala tutuyor mu? Her şey aynı griye düzleşirse, görsel kimliğiniz çok fazla ton'a dayanır ve değere yeterli değildir.
3. Bağlam testi. Paletinizi tasarım bağlamı olmaksızın beş kişiye gösterin. Hangi tür şirket için olduğunu sorun. Cevapları niyetinizden çok farklı saçılırsa, palet iletişim kurmamaktadır.
4. Erişilebilirlik denetimi. Renk kombinasyonlarınızı WCAG kontrast denetçisinden geçirin. Vücut metni minimum 4,5:1 oranını gerektirir. Büyük metin 3:1 gerektirir.

Sık sorulan sorular

Renk psikolojisi gerçekten dönüşümleri etkiler mi?

Evet, ancak çoğu makalenin iddia ettiği şekilde değil. Bir düğmeyi yeşilden kırmızıya değiştirmek dönüşümleri yüzde 21 arttırmaz. Önemli olan kontras ve bağlamdır. Göze çarpan bir düğme, spesifik renginden bağımsız olarak daha iyi dönüştürülür.

CTA düğmesi için en iyi renk nedir?

Sayfanızın geri kalanına karşı en yüksek kontrastı olan herhangi bir renk. Evrensel bir cevap yok. Sayfanız çoğunlukla maviyse, turuncu ortaya çıkacak. Sayfanız tarafsız ise, neredeyse her doymuş renk işe yarar. Tek yanlış seçim, karışan bir CTA'dır.

Bir marka paletinin kaç rengi olması gerekir?

Üç ila beş. Bir birincil, bir ikincil, bir aksan ve bir veya iki tarafsız. Daha fazlası gürültü oluşturur. Daha az esnekliği sınırlar. Kısıtlama özelliktir.