Renk Olayı…

Daha önce yazdığım tasarım için 4 ipucu’nu okumadıysanız belki ordan başlamak istersiniz.

Renk dediğimiz şey hakkında pek düşünmeyiz. Çünkü hiçbir çaba sarf etmeden görürüz onu ve üzerinde düşünmek için bir sebebimiz yoktur. Dolayısı ile onun aslında bir nevi ilüzyon olduğunu fark etmeyiz. Renk, aslında üzerine düşünüp, biraz araştırma yapınca oldukça acayip bir şeydir. Teorik şeyleri pek sevmediğinizi biliyorum ve çok fazla ayrıntıya girmek de istemiyorum, ama en basitinden mesela “neden CMYK ve RGB gibi farklı renk türleri” var gibi bir sorunun cevabını almak istiyorsak biraz teoriye girmek durumundayız.

Herhangi bir ışık kaynağından (bu gündüz genellikle güneştir) fırlayan fotonlar (kısaca ışığın atomları diye özetleyelim, aslında tam olarak değil ama şimdilik yeterli bir tanım olacaktır bu) saniye’de 300.000 km (aslında bu hız da sadece vakum ortamında bu değerdedir :P )  hızla ilerleyip yollarına çıkan objelere çarparlar. Bu çarpışma sonrası sağa sola sekerek dağılırlar. İnsan gözü de işte bu, çarpışmadan seken fotonları yakalar ve sinirler yardımı ile bu bilgiyi beyne yollar. Beyin gelen sinyalleri anlamlandıracak imgeleri kafamızda anında oluşturur ve biz de görmüş oluruz. Yani bir ışık kaynağından çıkan elektromanyetik dalgalar, objelerden yansırlar ve gözümüze çarpan kısmı beyinde anlamlandırılır.

İşte renk denen şey aslında, bu elektromanyetik tayfın ufak bir kesitinde kalan farklı dalga boylarında ışıklardır. İnsan gözü, mor ötesi (ultraviolet) ve kızıl ötesi (infrared) olarak adlandırılan dalga boyları arasında kalan, ışınları görebilir. Rengi belirleyen işte bu dalga boylarıdır. İnsan gözünün görme aralığı ve bunun elektromanyetik tayftaki yere aşağıdaki diyagramda.

Yanda Ultraviolet ve Infrared arasında kalan o daracık alanda, yani yaklaşık 380nm ile 749nm (diye yazıyor :P)  arasında kalan kısmı gözlerimiz algılıyor ve biz bunu değişik renkler olarak görüyoruz. Gelelim bunun biz ilgilendiren kısmına.

Yani rengin oluşması için bir ışık kaynağına ihtiyaç var ve bu kaynak olmazsa hiç renk olmuyor dolayısı ile ışıksız-karanlık bir odada tek gördüğümüz şey siyah. İşte yukarıda belirttiğim CMYK, RGB farkı burada yatıyor. RGB’ye additive (eklemeli), CMYK’ya da subtractive (çıkarmalı) renk sistemleri de denir çünkü RGB’de her renkteki ışık birbiri üstüne geldikçe toplam enerji artar ve ışık daha aydınlık bir renk alırken, CMYK’da üst üste farklı renklerde boyaların sürülmesinde olduğu gibi, her eklenen renk, ışığı kağıttan daha az sektirir hale getirir ve gördüğümüz renk gittikçe koyulaşır.

Dolayısı ile RGB ışık kaynağını(örn: TV) daha iyi temsil ederken, CMYK bir ışık kaynağından gelen ışığın üstünde sektiği (örn: dergi) sistemlerini daha iyi temsil ediyor. Multimedia işler için RGB kullanılırken, baskı işler için de CMYK kullanılıyor. (Bunu şu şekilde düşünmek daha kolayınıza gelebilir. TV ekranı açıkken ve hiç sinyal yokken ekran siyah gözükür, dolayısı ile daha sonra eklenen her renk onun toplam rengini daha parlak yapar (RGB). Boş bir dergi sayfası da bembeyazdır, onun üstüne eklenen her renk toplam rengi daha koyu yapar. )

Ama işin ilginç yanı insan gözü bu değerlerdense HSL dediğimiz (Hue, Saturation, Brightness) olarak bilinen sistemi daha iyi anlıyor. Peki HSL de ne? Sondan gitmek daha kolay olacak sanırım. L, lightness yani rengi oluşturan aydınlık/karanlık değeri (bir renk açık mı koyu mu?). S: Saturation, yani dengin doygunluk değeri,(çingene pembesi mi, pastel pembe mi?), H: Hue yani rengin rengi. Bu laf biraz garip ama bunu anlatmanın başka yolu yok. İnsan gözünün en iyi HSL olarak anlamasından kaytım ne peki ? İnsan gözü hep kontrast arar. Bu yüzden siyah beyaz bir filmde (Hue ve Saturation yoktur sadece siyah beyaz ve gri tonları vardır, ki bu da HSL’nin Lightness olan kısmı) gördüklerini çok yadırgamaz. Siyah beyaz bir film bizim için gayet anlaşılabilir ve rahat bir kontrast verir. Bazen contrast yapan hue’dali renkler üst üste gelir, bazen de doygunluktaki, ama sonuç gözümüz için lightness contrastı kadar güzel ve kolay anlaşılır değildir. Sonuç olarak  iyi eğitilmemiş bir göz herhangi bir renk içerisinde ne kadar kırmızı, yeşil, mavi (RGB) ya da magenta, cyan sarı (CMYK)  olduğunu anlamaz iken, hangi renkten, ne kadar doygun ve ne kadar açık/koyu olduğunu (HSL) kolayca anlayabilir. Bir de LAB diye bir renk sistemi var ki, benim onla bugüne kadar hiç işim olmadı o yüzden nasıl bi olayı var bilmiyorum. Hem bu teori kısmı düşündüğümden uzun sürdü ve yazı ile anlatmak çok zormuş bunu yaa. Kamaştım burada hehehe. Dönelim pratiğe:

Sıkılanlar buradan devam etsin. Daha önce yazdığım tasarımın 4 ipucunu hatırlarsak, bu yazıda o 4 konudan biri olan renk’e girmiş bulunuyorum. Renk yukarıda da anlattığım gibi çok karmaşık bir şey gibi gelebilir, kişiden kişiye fark ediyor olabilir, renkler ve zevkler tartışılmaz diye bir laf vardır hepimiz duymuşuzdur. buradan açıklıyorum şimdi işin aslını ey okurlar! Orada tartışılmayacak renkler tek renktir. Mesela mavi? Mavi bir kişinin en sevdiği renk olabilir. Bir diğer sarı sever. Sebebi önemli değildir, muhtemelen de rasyonel olarak açıklanacak bir sebep yoktur. (Şimanların siyahı dışında :P) Maviyi yeşilden güzel yapan nedir ? Tek başına iken rengin pek bir anlamı yoktur aslında; Aynı bir şarkıda tek bir nota gibi… Sadece FA sesini duysak, buna “benim en sevdiğim ses FA’dır” gibi bir şey diyebilir miyiz? Şarkıyı şarkı yapan ardı ardına bir uyum içinde gelen notalardır. İşte güzel bir tasarımı da güzel tasarım yapan birbirleri ile uyumlu renklerin yan yana kullanılması ile olur. Renklerin bu yan yana kullanımları ile ilgili de kurallar vardır. Belli hue’da bir renk başka bir hue’daki bir renk üzerinde çok fena sonuç verebilir. Örneğin kırmızı bir rengin üzerine mavi ile bir yazı yazın, göz kanseri olabilirsiniz. Aynı böyle kötü sonuçlar vermesi kesin renk kombinasyonları olduğu gibi, iyi sonuçlar veren renk kombinasyonları ve bu süreci yöneten kural vardır. Yani zevkler ve renkler sonuçta tartışılabilir. Aşağıda bu kuralların en çok kullanılanlarını görüyoruz. Bu kurallara göre ilk seçtiğimiz renge göre diğer renkleri nasıl seçmeliyiz. İlk rengimize ana renk diyelim, ve bu renk genellikle müşterinin logo yada  kurumsal rengi, yada o tasarımda kullanmamız gereken bir resmin rengidir. Bir resimden renk alma konusuna birazdan gelicez. Önce ana rengimiz bildiğimiz durumlarda sonraki renkleri nasıl seçebileceğimize bakalım.

Monochoromatic: Bu kurala göre ana rengimize eşlik edecek renkler, aynı rengin tonlarıdır. Yani rengimiz mavi ise, diğer renkler açık mavi ve koyu mavi gibi, hue’su aynı(hepsi mavi tonu) ama özellikle brightness’ı farklı (koyu-açık) renklerdir. Brightness kontrastı yarattığı için göze fena gelmeyen bir renk skalası oluşturur ama hue’su hep aynı olduğu için (hep mavi)  farklı bir renk eksikliği hissedilebilir.


Analog_renkler:
Bu kurala göre seçilen diğer renkler, ana rengin, renk skalasındaki komşu renkleridir. Yani farklı hue’larda renklerdir ve iyi bir kontrast yapılabilmesi için, farklı lightness değerlerinde renkler seçilmelidir. Brightness’ı aynı olan farklı hue’su olan renkler güzel kontrast oluşturmazlar.

Complementary: Bu kurala göre seçilen renkler, renk skalasında bir birlerine en zıt yerlerden seçilir. Hue’ları tam olarak zıttır. Genellikle 2-3 renk aynı hue’dan, kontrastı yapacak tek renk zıt hue’dan alınır, ve bu renk az ve ufak yerlerde kullanılır. Mesela 2-3 Mavi tonu ile hazırlanan bir sitede, pencerelerin üstünde olan sarı bir kutu gibi. Bu ufak renk tasarımımıza bir enerji ve renk katar.


Split_Complementary:
Bu kurala triad falan da denir çünkü renk skalasında üçgen oluşturacak noktalardan seçilen renkler tarafından oluşturulan renklerdir. Analog renklerin birbirlerine yakın olmaları yüzünden göze yakın gelirken, zıt taraftan gelen renk’te complementary’de olduğu gibi bir renk zıtlığı oluşturarak tasarıma dinamiklik katar.

Complement/Analog: Bu kuralda da kısaca complementary ve analog renklerin karışmasından oluşur. Sık kullanılacak renkler hue’ları birbirlerine yakın olan renklerdir, ve zıt hue’dan gelen renk az kullanılır.

Burada yazdığım kuralları açık söylemek gerekirse ezbere bilmiyorum. Yani oturup düşününce RGB tablosunu (yada CMYK) tablosunu kafamdan çizebilirim ama her renk için complementary’si nedir falan diye bir ezberim yok. Zaten gerek te yok! Çünkü yukarıdaki kuralları okuduktan sonra hemen http://kuler.adobe.com/#create/fromacolor adresine gidin ve bu kuralların nasıl çalıştığı ile ilgili biraz kurcalama yapın. Yapmanız gereken tek şey, bir ana renk seçmek (base color) daha sonra kurallardan birini seçmek, site size hemen seçtiğiniz ana renge göre mesela Triad renkler ne olmalı gösterecek. Daha sonra ister slider’ları sağa sola çekerek, isterseniz de sayısal olarak oluşan renkleri daha da şekillendirebilirsiniz. Oldukça kolay ve kullanışlı. Artık hangi rengi seçeyim, hangi renk hangi renk ile iyi gider diye bir derdiniz kalmadı. İsterseniz kuler’de iken “create from an image” butonunu tıklayarak istediğiniz bir resmi upload edip, o resme en uygun renkleri kuler’e de seçtirebilirsiniz. Burada aynı zaman da colorful (renkli), bright ( aydınlık), deep (derin) muted (pastel) ya da dark (koyu) gibi seçimlerle istediğiniz ruh hali ile ilgili renkler de seçtirebilirsiniz kuler’e.

Ama diyelim ki renklerimizi kuler seçsin istemiyoruz. O zaman ana rengimizi nasıl seçeceğiz ? Yukarıda da dediğim gibi ana renk büyük ihtimalle müşteri brief’i içinde saklıdır. Bu bazen müşterinin kurumsal renkleri olabilir. Siz bu renklerden başlayarak ve kuler’i kullanarak güzel bir kombinasyon oluşturabilirsiniz. Peki ama elimizde bir resim varsa ve bu resimden renk almak istiyorsak? Bir resimde bazen belli renkler baskındır, bazen de renkler iç içe girmiştir. Milyonlarca renk arasından ana rengimizi nasıl seçebiliriz? Bunun en kolay yolu o resmi photoshop’ta açmak. Ve daha sonra sonra resme bir mosaic filtresi vermek (filters > pixelate > mosaic). Değer arttırdıkça karelerimiz büyüyecek ve mesela önceden 200×200 pixelden oluşan bir yerde 40.000 farklı renkte pixel olabilecek iken, şimdi tüm o 40.000 pixel’in ortalama rengini göreceğiz. Ağırlıklı olan bir rengimiz varsa, mesela aşağıdaki resimde kahve rengi tonları olabilir, bunu ana rengimiz yapabiliriz. Daha sonra yukarıdaki kuralları uygulayarak, tasarımımız için farklı renk tonları seçebiliriz.

Tabi burada da bodoslama gitmemek gerekiyor. Yine yukarıdaki örneğe bakarsak resmin solunda kahve tonları arasında hafif sarılar var, resmin sağında ise düşük saturasyonlu yeşiller. Bu renkleri de göz önüne almalıyız. Yoksa aldım bir rengi, bastım analog’a oldu diye salmayın kendinizi can dostlar.

4 sayfa yazı yazacağımı bilsem (word ile) beklide başlayamazdım bu yazıya diyor ve aranızdan ayrılmadan önce bana bu yazıda yardımı olan adobe.kuler sitesine, before after dergisine, bir takım photoshop çizimleri yapan Meaaauz elime, ve yazıları yazan iki elime de teşekkür ederim. Hadi gidin kuler’de oynayın biraz…

Reklamlar

Etiketler:

About cenkozmercan

I do the things that I like to do and if 1 is good, 10 is a whole lot better.

6 responses to “Renk Olayı…”

  1. Onur Ceylan says :

    Yillarca elifi gorup mertek sanmisiz :)

    • cenkozmercan says :

      is this supposed to be some kindda april fool’s fail or what ?
      by the way, your mandatory service is due soon, and I encountered your staff sergant who was looking for you. you’re so screwed nab :P

  2. Mimar says :

    teşekkür ederim bende bunu arıyordum..güzel bilgiler

Bir Cevap Yazın

Aşağıya bilgilerinizi girin veya oturum açmak için bir simgeye tıklayın:

WordPress.com Logosu

WordPress.com hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Twitter resmi

Twitter hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Facebook fotoğrafı

Facebook hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Google+ fotoğrafı

Google+ hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Connecting to %s

%d blogcu bunu beğendi: