Renkler yaşamın estetiksel ve ifadesel anlamında önemli parçalarından biridir. Yaşam ve insan için değerli olan bu etmenin, tasarımda da bir hayli kullanıldığını ve önemini biliyoruz. Bu içeriğimizde ise renk teorisinden, renklerin özellikle dijital tasarımda kullanımından, kullanırken nelere dikkat edilebileceğinden ve renklerin birbirleriyle uyumlarındaki noktalardan bahsedeceğiz.
Tipografi gibi tasarımda önemli bir yere sahip olan renk, insan-bilgisayar etkileşiminin önemli bir bileşenidir. Tasarımcılar, arayüz tasarımında kullandıkları renk kombinasyonlarına bir renk şeması olarak atıfta bulunur. Sonsuz sayıda olası renk kombinasyonu olduğundan, ürününüz için en iyi sonucu verecek renk şemasını seçmek zor olabilir. Neyse ki, uyumlu ve güçlü renk kombinasyonları seçmemizi sağlayan renk teorisi, yaptığımız tasarımlarda uygulanabilir renkler seçmemiz konusunda bizlere oldukça yardımcı olmaktadır.
Renk teorisi, hangi renklerin birbirleriyle uyumlu olduğunu bilimsel bir şekilde belirleyen ve sanatla bunu uyumlu hale getiren bir yöntemdir. Renk teorisi oluştururken ise kullanılan araç renk tekerleğidir. Renk tekerleği, 1666'da renk spektrumunu bir daireye eşleyen Isaac Newton tarafından icat edilmiş ve günümüze kadar detaylandırılarak gelmiştir. Renkler arasındaki ilişkiyi göstererek, bilimsel ve sanatsal açıdan renkleri uygun bir şekilde kullanmamızı sağlayan renk tekerleği birçok kişi tarafından yorumlanmış ve günümüzde tasarım yaparken hala kullandığımız yöntem haline gelmiştir.
Renk tekerleği, rengin kullanılacağı tüm işleri yaparken renkleri seçebilmemiz için kullandığımız bir diyagramdır. Renk tekerleğinin nasıl oluştuğundan bahsedecek olursak birincil renkler yani ana renkler ışığın temel anlamda algılanması ile oluşan renklerdir. İkincil renkler ise ana renklerin birbiri ile homojen karıştırılmasıyla oluşan renklerdir. Son olarak üçüncül renkler ise birincil ve ikincil renklerin karıştırılmasıyla elde edilen ve bu sayede tasarımlarımıza özel tonlar kazandırmamızı sağlayan renklerdir. Fakat tabi ki tasarımlarımızda yalnızca ana ve ara renkler kullanmıyoruz. Bazen seçtiğimiz bir rengin biraz daha açığını bazense biraz daha koyusunu kullanarak bir görsel hiyerarşi oluşturmaya çalışıyoruz. Bu süreçte ise bize yardımcı olan, renk tekerleğinde yer alan üç ana renkten, üç ara renkten ve altı ana üçüncül renkten faydalanıyoruz.
Genel kullandığımız yani birincil, ikincil ve üçüncül renklerin yanında bazen renklere siyah, gri ve beyaz ekleyerek farklı renklerde ortaya çıkarabileceğimizi belirtmiştik. Bu çeşitliliği sağlayabilmek için ise tints, tones ve shades olarak adlandırılır.
Hue (Ton)
Hue en basit tanımıyla, saf renkler anlamını taşır. Aslında hep daha karmaşık anlaşılsa da hue renk tekerleğindeki herhangi bir renk olabilir. Öte yandan hue, baktığımız bir rengin renk ailesini ifade eder. Rengin kırmızı, mavi ve yeşilde bulunduğu noktaya göre rengin açısı yani hue değeri değişir. Hue 0 ise rengimiz kırmızı 90 ise sarı, 180 ise yeşil ve 370 ise mavidir. Hue rengin yoğunluk derecesini gösterir. Şimdi biraz da tintlerden, yani doğal renklerin belirli bir oranda beyazla olan ilişkilerinden bahsedelim.
Tint (Tonlama)
Elinizdeki bir rengi biraz beyaz ile harmanladığınızda, onu biraz yumuşatmış olduğunuzu düşünseniz de teknik olarak aslında onu desatüre etmiş olursunuz. Pastel renkler, genellikle tint renklerdir. Ayrışmış olduğu renge çok yakın olarak gözükselerde daha soluk durumdadırlar. Eğer bir rengi tint etmek istiyorsanız, her zaman beyaz ile başlamanız, istediğiniz tonu elde edene kadar beyaz eklemekte acele etmemeniz gerekmektedir.
Shade (Gölge)
Shadeler bir tona siyah eklendiğinde elde edilen, paletlerin genellikle daha yoğun, daha zengin ve daha koyu renklerdir. Siyah renk çok az miktarda kullanılsa bile bir tonun karakterini tamamıyla değiştirebilir. Tintlerin aksine, shade renklerin elde edilmesi gerektiği durumlarda, karıştırmaya rengin kendisi ile başlamak daha iyi bir yaklaşım olacaktır.
Tone
Bir renge gri eklediğimiz zaman, o rengin tonlarına ulaşmış oluruz. Gri renk dünyasının dengeleyecisi, nötrleyicisi olarak kabul edilir. Bir renge gri ekleyerek onu aslında matlaştırmış da olursunuz. Tonlu renkler göze her zaman daha hoş gözükmeleri ile bilinirler. Eğer tasarımlarınıza sofistike bir tat katmak istiyorsanız, tonlamalara oldukça titizlikle yer vermelisiniz. Yeni bir proje için renk paletinizi oluştururken bunu mutlaka aklınızda bulundurmanızda fayda var. Tasarımlarınıza bir kontrast eklemek, gözü istediğiniz yere çekerek manipüle etmek istiyorsanız, farklı tonlar eklemek iyi bir fikir olabilir.
Renk teorisinin mantığını ve nasıl ortaya çıktığını keşfettik. Peki tasarımda bir renk paleti oluştururken hangi adımlardan gitmek gerekir?
Marka Kimliği Üzerinden Renk Seçimi
Bir renk paleti yaratmak isterken ilk yapmamız gereken şey temel bir renklere karar vererek işe başlamaktır. Eğer temel bir rengimiz yok ise, yeni bir marka tasarımı yapmayı düşünüyorsak renklerin marka kimliklerine olan etkisini göz ardı etmemiz gerekmektedir.
Tasarımlarımızda hangi kitleye hitap ettiğimiz, kimleri etkilemek istediğimiz, kullanıcılarımızda nasıl bir etki bırakmak istediğimiz gibi konularda renklerin doğru tercihi en önemli kararlardan biridir. Örneğin, Starbucks yeşil rengi kullanarak tek bir duyguyu değil kullanıcılarında birçok farklı duyguyu etkilemeyi amaçlamıştır. Bunun sebebi olarak ise yeşilin, diğer renk reseptörlerine göre gözlerimizde daha fazla yer kapladığından kullanıcılar ile de daha çeşitli ilişkiler kurabilmesi gösterilebilir. Ya da Burger King’in kırmızının acıktırıcı ve arzulama hissi uyandırması özelliklerinden faydalanması ve müşterilerinin dikkatini çekmesi de renklerin önemini anlatmaya örnek gösterilebilir. Kısaca renklerin anlamlarına ve kullanıcılarda uyandırdıkları duygu ve düşüncelere bakacak olursak;
İlk süreçte renklerinizi seçerken sadece renklerin birlikte ne kadar güzel görünebileceğini ve renklerin birlikte ne denli uyum sağlayacağını düşünmeyin. Hedef kitlenizin seçtiğiniz her bir renkle kuracağı ilişkiye dikkat edin ve renklerin markanızın söylemlerine ve imajına uygun olduğundan emin olun. Marka kimliği tasarlarken nelere dikkat edilmeli, markanın değerleri nasıl oluşturulur ve bu değerlere göre nasıl tasarımlar ortaya çıkartabilirim diye düşünüyorsanız, Marka Stratejisi ve UX/UI Uygulamaları eğitimimize göz atmayı unutmayın.
Eğer hali hazırda oluşmuş bir marka kimliğiniz varsa ya da marka kimliği için moodboard hazırlayıp, temel renklerinizi seçtiyseniz arayüz tasarımında tasarım sistemi yaratırken kullanacağınız yegane elemanlardan birine gelelim; renk paleti yaratmak. Renk paleti oluştururken ise seçtiğiniz ana renge uyumlu, ürününüzü ön plana çıkaracak renkler seçmenizde fayda var. Bununla alakalı renk tekerleği üzerinden yola çıkan renk harmonisinden sizlere bahsetmek isteriz.
Renk Harmonisinden (Color Harmony) Yararlanmak
Renk teorisinin ne demek olduğunu ve bu teori üzerinden renk tekerleğinin nasıl oluştuğunu biliyoruz. Bundan sonraki aşama ise bu teoriyi ve tekerleği kullanarak tasarımlarımız için renkleri nasıl belirleyeceğimiz olacak. Her renk kendine ait bir güzelliğe sahip olsa da bazen renkler arasındaki uyumlar o kadar da güzel olmayabilir.
Renklerin kendileri arasındaki ahengi bulmak için ise Renk Harmonisi bizlere yardımcı olur. Renk Harmonisi, renk tekerleği üzerinden çeşitli kombinasyonlar ile palet oluşturabileceğimiz bir yöntemdir. En sık kullanılan harmoni yöntemleri ise,
Complementary (Tamamlayıcı)
Renk Tekerleği üzerinde birbirine karşıt şekilde konumlanan renklerin oluşturduğu harmonidir. Zıt renklerin uyumu ile oluşan bu harmonide karşıt iki renkte beraber kullanıldığında büyük bir ağırlık katar. Kontrastlık yaratarak içeriklerinizi öne çıkarabilir, marka kimliğinizdeki hareketli yapıyı bu renk harmonisi ile gösterebilirsiniz.
İki zıt renk ne kadar güçlü konseptler yaratsa da, bir o kadar da tehlikeli olabilir. İki karşıt rengi kullanırken bir renge daha fazla ağırlık verebilir, iki güçlü rengi birbiriyle rekabete sokmayabilirsiniz. Yukarıdaki örnekte sitenin arkaplanında turuncu hakimken, butonlar ve dikkat çekilmek istenen yerler de kontrastlık yaratılarak mavinin kullanıldığını görüyoruz. Marka kimliği olarak ise güçlü, vurucu, eğlenceli anlamlarını da bu renk kullanımı ve görselleri üzerinden yorumlayabiliriz.
Complementary renkleri beyaz ile kullanabilir, ikisinin arasındaki zıtlığı beyaz ile dengeleyerek sade formlar da elde edebilirsiniz. İki rengi birbiriyle karıştırmayarak ama iki rengin de gücünü kullanarak içeriğini ön plana çıkaran bir örnek görüyoruz. Beyaz renginin daha yoğun kullanıldığı bu örnek daha kurumsal, sade ve köklü bir marka kimliğiyle bizi karşılıyor. Complementary renk kullanarak da marka dinamikliğini vurguluyor.
Tamamlayıcı (Complementary) Renk harmonisi nerelerde, nasıl kullanılır daha fazla bilgi sahibi olmak isterseniz, buradaki içeriği inceleyebilirsiniz.
Split Complementary (Bölünmüş Tamamlayıcı)
Tamamlayıcı renk harmonisinin farklı bir versiyonu diyebiliriz. Ürünlerinizde kontrastlık yaratmak istiyorsanız, ancak renk paletinde daha fazla renk bulunmasını ve bu zıtlığı yaratırken çok da göz alıcı olmasın istiyorsanız, bölünmüş tamamlayıcı (split-complementary) kuralından yararlanabilirsiniz.
Giriş sayfaları gibi yerlerde, içeriği ön plana çıkartmak amacıyla kullanılabilecek marka kimliğindeki hareketli, dinamik etkisini kullanıcıya yansıtabilecek bir renk harmonisidir. Arayüz tasarımında kullanırken ise butonlar, bilgilendirmeler, karşılama ekranları gibi yerlerde bu renkler kullanılabilir.
Analogous (Analog)
Genellikle soğuk ve sıcak renkler üzerinden kurgulanan, yarattığınız markanın soğuk ve sıcak renklerle alakalı net bir çizgisi varsa bunun korunmasını sağlayan renk harmonilerinden biridir. Bu renk paletinde ürünü ön plana çıkarmak, renkleri ürünün önüne geçmesini sağlamak ve işlevsellik daha çok ön plandadır.
Yukarıdaki markada soğuk tonlar dediğimiz renkler tercih edilerek bir analog harmonisi ile bir renk paleti hazırlanmış. Bu renkleri kutularla kullanarak, siteye güven hissiyatının artması sağlanılmış. Kendinden ve duruşundan emin, kullanıcısına güven veren bir marka kimliği yansıtılmak istenmiş.
Bu örnekte ise sıcak renkli bir analog harmonisi yaratılmış. Samimi, sıcak kanlı bir marka kimliği oluşturulmaya çalışılmış. Arayüz tasarımında beyaz rengi temel olarak kullanıp, ayarlar, butonlar ve bilgilendirme kısımlarında renk kullanımı yapılmış ve önemli noktalara değinen yalın bir arayüz tasarımı yaratılmış.
Monochromatic (Tek Renkli)
Tek bir HUE seçip, ton, tint ve shade farkları üzerinden renk paleti oluşturulmasına monochromatic ismi verilir. Bu renk harmonisi de analog renkler gibi, ürünün kendisini ve işlevini ön plana çıkartmak ister, renkler yardımcı elemanlar olur. Markanın sahip olduğu kimliğe göre soğuk ve sıcak olarak kendini yansıtabilir. Genellikle net, stabil, güven duygularının ön planda olduğu markalarda gördüğümüz bir renk harmonisidir.
Yukarıdaki örnekte de kırmızı ve kırmızının tonları kullanılarak yaratılan, gri ve beyaz tonları ile de desteklenen bir renk paleti görüyoruz. Kullandığı renkler ve diğer öğeler ile güçlü ve deneyimli marka kimliğini bizlere hissettiriyor.
Triadic (Üçlü)
Renk tekerleği üzerinde en çok seçime sahip olan renk kurallarından biridir. Dinamik, eğlenceli, dikkat çekici gibi marka kimliğine sahip olan firmalarda karşılabileceğimiz bu renk harmonisi bir şeyleri ön plana çıkarmak ve eğlenceli bir hava yaratmak için oldukça kullanışlıdır.
Yukarıdaki örnekte triad kullanılarak hareketli ve canlı bir marka kimliği yaratılmaya çalışılmış.
Bir uygulama içerisinde özellikle meditasyon, dil öğrenme, spor gibi bireysel olarak girip kendinizi geliştirdiğiniz ve gelişiminizi gördüğünüz uygulamalar da hareketlilik katmak için triad harmonisi sıklıkla kullanılır.
Renklerin uygulamalar ve web sitelerinde kullanım örneklerini incelemek isterseniz buradaki yazıyı inceleyebilirsiniz.
RENK PALETİ OLUŞTURMA ARAÇLARI
Renk paleti oluşturmak için yararlanabileceğiniz başlıca renk harmonisi yöntemlerinden bahsettik. Tabiki de bu harmonilerin dışında markanıza ya da ürününüze iyi gelebileceğini düşündüğünüz renk paletleri oluşturabilirsiniz. Bununla alakalı faydalanabileceğiniz renk paleti oluşturma araçlarını ve nasıl kullanılacağını da aşağıda listeledik.
Renk paleti yaratırken sıklıkla kullanılan, kullanıcısına aynı zamanda renk kurallarını da veren adobe color, renk paleti yaratılırken sıklıkla kullanılan araçlardan bir tanesi. Renklerin kodlarına rahatça ulaşabildiğiniz ve beğendiğiniz rengin hızlı bir şekilde shade, tint ya da tone ayarını belirleyip, bu duruma göre renk aileleri oluşturabildiğiniz bu araç aynı zamanda fotoğraf üzerinden renk paleti oluşturma ve erişilebilirlik konusu anlamında da kullanıcısına bir çok imkan tanımaktadır. Renkleri kullanırken dikkat etmemiz gereken erişilebilirlik kısmına ise buradaki linki ziyaret ederek daha detaylı keşfedebilirsiniz.
Hızlı bir şekilde renk paleti oluşturmak için kullanabileceğiniz coolor.so, sizlere renk harmonilerinden faydalanarak karışık bir şekilde renk paletleri sunar. Bu renk paletlerinde beğendiğiniz rengi ya da renkleri kilitleyerek birçok renk paleti yaratma imkanını da kullanıcısına sunar. Aynı zamanda daha önceden yaratılan renk paletlerinden ilham alabilir ya da yarattığınız moodboard üzerinden renk paleti oluşturabilirsiniz.
Bir renk paleti için fikriniz var fakat nasıl görüneceğini bilmiyorsanız designspitaion.com size göre diyebiliriz. 5 renge kadar seçiminizi yapabilir renklerinizin ürün, afiş, insan ve birçok farklı materyal üzerinde nasıl görüneceğine bakabilirsiniz.
“Renkler için Google” mottosuyla kendisini tanıtan Picular, markanız ya da yaratacağınız tasarımla ile alakalı kelimeleri girerek, renk paletinizi ya da temel marka renginizi seçebileceğiniz bir platform.
Kısacası, renk tekerleğinin oluşumu, marka değerlerine uygun renk seçimi ve yaratılacak ürünlerin renk paletlerinin çıkarılması hakkında bu yazımızda sizleri bilgilendirmeye çalıştık. Hayatımızın ve tasarımın önemli parçalarından biri olan renkler hakkında sizler neler düşünüyorsunuz, bu konu hakkında düşüncelerinizi Space Club kominitemiz üzerinden bizlerle ve tasarım konusunda meraklı yüzlerce komünite üyemizle tartışabilirsiniz. Ayrıca marka kimliğine göre renk belirleme ve renk paleti oluşturma, markanın seslenişini tasarlamak, markanız ile uyumlu UX/UI tasarımları yaratmak isterseniz Marka Stratejisi ve UX/UI eğitimimize de göz atabilirsiniz.
Oluşturulma Tarihi
23/9/22
Güncellenme Tarihi
28/9/22
Online Eğitim
Tasarım Sürecinde Yapay Zeka Pratikleri
Yapay Zeka’nın En Gelişmiş Görsel Üretim Aracı Midjourney ile Sınırları Zorlayın 🚀