Renk Düzenlerini Uygulamak Onları Yeniden Görmeyi Gerektiriyor
Tasarımcıların harika renk kombinasyonlarını keşfetmeleri, ince ayar yapmaları ve indirmeleri için birçok çevrimiçi kaynak bulunmaktadır.
Tamamlayıcı, analog, monokromatik ve diğer kombinasyonlarla oynamak bizi heyecan verici olasılıklara açıyor ve özgürlüğün sıkıntısı yok.
Ancak kazanan bir renk düzeni ve onu kullanan kazanan bir tasarım arasında bir fark var.
Renkleri seçmek ilk adımdır. Bunları tasarım gereksinimlerinize uyacak şekilde uyarlamak da önemlidir.
Bir renk örneğinde iyi görünen şey, bir web sayfasında iyi çalışmayabilir; ancak bu, bir kareye dönüş yapmanız gerektiği anlamına gelmez. Renk şemalarına bakmanın yeni yollarını burada keşfedeceğiz.
Renk, insanların içeriği nasıl emdiği konusunda önemli bir rol oynar. Bir tasarımın rezerve edilip edilmediği ya da yüksek sesle, arkadaşça ya da uğursuz, sıcak ya da havalı bir web sitesi ziyaretçileri, düzen, tipografi, görüntü ve elbette renk şemasını oluşturan tonlar ve değerler tarafından belirlenen tondan hemen etkilenir.
Renklerin seçilmesi, web tasarımındaki en öznel iş olabilir. Bazı renkler birlikte iyi çalışır; diğerleri, çok değil. Bazı kombinasyonlar belirli insanlara hitap ediyor. Birden fazla renk seti aynı tasarıma uygun olabilir.
Neyse ki, yardım için birçok kaynak var. Renk paleti üreticileri gibi Renk Şeması Tasarımcısı , Adobe Kuler , Aviary Toucan ve Günlük Renk Şeması Hangi harika yerler arasında Bir ruh halini etkili bir şekilde ayarlayan renk kombinasyonlarını bulmak için. Ancak bir palet bulmak sadece ilk adımdır. Herhangi bir renk şemasının potansiyel etkinliği, uygulanma şekliyle tehlikeye girebilir.
Bir Plandaki Renk Sayısı Bir Fark Yaratır
Bir renk şeması birlikte çalışmak için seçilmiş bir renk kümesidir. Şemalar genellikle en az dört renge sahiptir ve genellikle basit görüntüler olarak ve bazen de
Yukarıdaki renk şeması, çoğu şemanın nasıl sunulduğuna tipiktir: Düz renklerin tekdüze örnekleri olarak. Bu set şu şekilde etiketlenebilir:
- Neşeli
- Arkadaş canlısı
- Çağdaş
- gündelik
- Birincil Cihazlar
Ama bir veya iki renk öne çıkar ve farklı sıfatlar akla gelebilir.
Yukarıdaki görüntü, renk örneğinde sunulan aynı şemaya sahiptir, ancak daha az rahat ve daha çöl benzeridir. Bu görüntü sıcak renkleri vurgular. Mavi ve yeşilin izole yamaları dikkat çekicidir. Ortaya çıkan ruh hali şöyle tanımlanabilir:
- Kumlu
- Parlak
- Ilık, hafif sıcak
- Haki
- kaba
Baskın rengin seçimi, şemanın nasıl göründüğünü etkiler.
Yine, burada aynı renkleri kullanıyoruz, ama çok farklı bir son. Bu görüntü kırmızı, yeşil ve kahverengi adalarla soyut bir dünya haritası gibi görünüyor. Görüntü sadece daha soğuk değil, aynı paletten gelse de biraz daha koyu .
İyi renk kombinasyonlarını tanıyabilmek yeterli değildir, çünkü renkler bir web sitesi tasarımına eşit olarak nadiren uygulanır. Doğru renkleri seçerken, renkleri doğru ve doğru oranda kullanmak önemlidir.
Arkaplan tonu ayarlar
Renkle bir etki yaratmak için en belirgin yer arka planda. Bu geniş alan, üstüne yerleştirilen içerik kadar çok ilgi çekebilir.
Aynı içeriğe sahip olmasına rağmen, sağdaki tasarım soldaki olandan çok daha sıcaktır. Fakat burada basit bir renk takasından daha fazlası oluyor.
Yeşil tasarımdaki içerik çubukları (yani kırmızı üzerindeki beyaz metin), geniş yeşil arka plana karşı kendiliğinden tutulur. Fakat sağdaki kırmızı arka plan, kirli yeşil çubukları yıkar. Bunun nedeni, daha sıcak olmanın yanı sıra, bu özel kırmızı tonunun daha doygun olmasıdır. Aslında, kırmızı arka plana karşı yeterli görsel ağırlığı olan tek unsurlar büyük başlıklardır. Küçük gövde metni ve soluk yeşil çubuklar karşılaştırmalı olarak soluklaşır. Bu mutlaka kötü değil; güçlü bir arka plan, sayfanın önemli bir varlığını verir. Yeşil tasarım daha soğuktur ve içeriği daha rahat bir ortam sağlar.
Hangi renk kullanımı daha iyidir? Senin niyetine bağlı. Ziyaretçiler içeriği rahat veya cesur olarak görüyor mu? Renkli çubukları oynatmak ister misin? Arka plan bilginin üstesinden geleceğinden endişe duyuyor musunuz? Markanızda bir renk diğerinden daha mı önemlidir? Bu soruların cevapları hangi rengin “doğru” olduğunu belirleyecektir. Bu tek renk paleti iki farklı çözüm sunar.
Metnin Arkasındaki Renk
Metin ve arka planın etkileşimi, her birinin boyutundan ve miktarından etkilenir. Metnin sayfa üzerindeki etkisi, arka planın rengine bağlı olarak metnin rengine bağlıdır - genel olarak arka plan hakkında daha fazla endişelenme eğilimine rağmen.
Yukarıdaki, koyu bir arka plana karşı açık metin, tür büyük olduğunda daha iyi çalışır. Başladığımız renk şemasından ödünç aldığımız bu altın, vücut metni için daha az uygundur (yaklaşık 13 piksel veya daha küçük). Çözüm basit:
Üstte, son iki sıradaki küçük metin altının gölgesinde. Oldukça beyaz değil, ilk görüntüdeki iki çizgiden çok daha okunaklı. Eklenen kontrast, küçük metnin arka plan tarafından aşırı güçlenmesini önler. Anahtar, renk düzeninizi sabit bir kural değil, başlangıç noktası olarak kullanmaktır. Bir arkaplan rengi daha küçük elementleri alt etmekle tehdit ederse, kontrastı artırın, bu da şemanın bütünlüğünü koruyacak ve içeriği okunaklı tutacaktır.
Beyaz Metin
Birçok web sayfası beyaz arka plana veya beyaz içerik alanlarına sahiptir. Fakat “beyaz”, “boş” anlamına gelmez. Beyazın geniş alanları, rengin nasıl algılandığını etkiler. Örneğin:
Başladığımız renkler metin için kullanıldığında daha hafif görünür.
- Nispeten koyu mavi, metni beyaza karşı okunaklı hale getirmek için yeterli kontrast oluşturur.
- Yeşilin bu özel tonu arka plana karışır. Niyet uyum ise, yeşil işler.
- Kırmızı + beyaz = pembe veya şeftali.
- Altın neredeyse sepya tonuna benziyor.
Beyaz dokunduğu her şeyi aydınlatır. Hafif bir ruh hali kurmak istiyorsanız, yukarıdaki kombinasyonlardan herhangi biri işe yarayabilir. Daha fazla etki için renk düzenini koyulaştırabilirsiniz.
Photoshop'ta Renk Düzenleriyle Oynatma
Tasarımınız, şemanızdaki tüm renklerin eşit olarak kullanılmasını gerektirmiyorsa, bir ya da iki rengi dominant olarak test etmelisiniz. Hile, hem birbiriyle hem de baskın renkle çalışan renklerle bir şema bulmaktır.
Neyse ki renkleri test etmek için kolay bir işlemimiz var. Farklı renk ölçümlerinin tasarımı nasıl etkilediğini görmek için, Photoshop'ta şu adımları izleyin.
1. Renk şeması bulun veya oluşturun. Örneğimizin beş rengi var, ancak üzerinde herhangi bir sayı çalışacak.
2. Beyaz bir arka plan ile Photoshop, 500 x 500 pikselde yeni bir görüntü oluşturun.
3. Dört yeni katman oluşturun (arka plan katmanınız beşinci olacaktır). Şemanız beş renkten daha az veya daha az içeriğe sahipse, katmanları buna göre ekleyin veya kaldırın.
4. Her katmanı şemanızdan farklı bir renkle doldurun.
5. Arka plan katmanının üzerindeki her katmana bir katman maskesi ekleyin. Katman paletiniz şöyle görünmelidir:
Yukarıda, katman başına renk ve katman maskeleri uygulanmış Photoshop katmanları paleti.
6. “Eşikleyici” eylemini çalıştırın her katman maskesinde - ama katmanlar üzerinde değil.
Yukarıda “Eşikleyici” eylemini kullanırken, gerçek katmanı değil, katman maskesini seçtiğinizden emin olun. İşlemi yanlışlıkla katman üzerinde çalıştırırsanız, “Geri Al” işlevi için memnun olursunuz.
Bu eylem çoğunlukla bir katman maskesinde rastgele bir desen oluşturur. Buradan, tasarımcı "Eşik" kontrolü ile ücret alır. Belirli bir katmanın daha fazlasını ortaya çıkarmak için Eşik kontrolünü sola kaydırın ve daha azını ortaya çıkartın. Bu eylemi her katman maskesine uygulamak, bir rengin diğerlerine rastgele bir düzende hakim olmasını sağlar.
Bu durumda, Eşik kontrolü, belirli bir katmanın ne kadarının görünür olduğunu belirler. Çoğunlukla siyah bir katman maskesi tabakayı gizler; çoğunlukla beyaz tabakayı ortaya çıkarır. Her katman maskesinde Eşiklendirici eylemini çalıştırmak, böyle bir renk gölgesi oluşturacaktır:
Bu Photoshop belgesi, sarı baskın olduğunda bir tasarımın nasıl görünebileceğini gösterir. Renklerin şimdi ayarlanması çok kolaydır: daha fazla (veya daha az) kontrast vermek için Photoshop komutunu kullanın ( Resim> Ayarlamalar> Ton Doygunluğu gibi ).
Örneğin, maviyle daha önce iyi işleyen yeşilin gölgesi, mavi'nin baskın olmadığı için çok iyi görünmüyor. Birkaç deney aşağıdakileri ortaya çıkarmaktadır:
Burada orijinal renk düzenimizin iki varyasyonu var. Varyasyon # 1 yeşili hafifçe koyulaştırır. Neredeyse işe yarıyor. Varyasyon # 2, kontrast eklemek ve tonları hizalamak için sarı dışındaki her şeyi değiştirir.
Ya tasarımımız çoğunlukla sarı yerine maviyse? Bu mavi tonu diğer renkler ile kontrast oluşturacak kadar karanlıktır, ancak bunların hiçbiri koordine değildir - bunların hepsi birincildir. Yeni bir dominant seçerek, yeni bir problem oluşturduk.
Yukarıdaki # 1 varyasyonu, yumuşak kırmızının yerini koyu maviyle değiştirir ve yeşilin rengini soluk bir nane haline getirir. Varyasyon # 2, daha az yerine daha fazla kırmızı (veya bordo) kullanarak diğer şekilde gider.
Bu varyasyonların herhangi birinin sorumluluğu özneldir. İdeal olarak, nihai kararı vermeden önce bunları gerçek tasarıma uygularsınız. Anahtar süreçte: bir palet olsun, baskın bir renk seçin ve diğerlerinin onunla çalışmasını sağlayın.
“Eşikleyici” Eylemi Hakkında
Bu eylemin gizemi yok. Filtre> Render> Clouds veya Filter> Render> Fark Bulutlarını bir katman maskesine uygulayarak aynı etkiyi elde edebilirsiniz. Bu eylem sadece Threshold komutunu deciles'e organize ederek süreci iyileştirir.
Lütfen çekinmeyin “Eşikleyici” eylemini indir . Daha da iyisi, kendi yorumlarınızı oluşturun ve aşağıdaki yorumlarda bir bağlantı sağlayarak herkesle paylaşın.
Eylemsiz Renklerin Değerlendirilmesi
Tabii ki, Eşik ile oynamadan rengi yargılamanın yolları var. Bir ana renk seçerek başlayın ve diğerlerinin onunla çalışmasını sağlayın.
İşte orijinal renk şeması, ana renk olarak kahverengi.
Yeşil tondaydık ve kırmızıyı doyurduk. Harsher renkleri, mavi (kendi ayarlanmamış olan) gibi kendi başlarına durur.
Burada, yeşil, sarı ve kırmızıyı sildik. Bu düşük anahtar “aksan” kahverengi arka planla karışır. Kontrastı oluşturmak için maviyi koyulaştır.
Üç koyu ana renk, orta kahverengiye iyi gelirken, soluk sarı bir vurgu rengi olarak işlev görür.
Yine, nihai karar, tasarımcı bu şemaları gerçek tasarıma uyguladığı zaman gelir. O zamana kadar bunlar sadece başlangıç noktalarıdır: çatışmaları önlemek için yararlı araçlar, tasarımları tema üzerinde tutmak için kullanışlı referanslar ve kombinasyonları keşfetmenin harika bir yolu.
Renk sadece bir tasarım öğesidir. Renk kullanımı , kişinin ruh halini kontrol etmek, birinin tadını tatlandırmak ve birkaç renk örneğinde olasılıkları görebilmek için pratik olması gereken bir beceridir.
Sadece bir şey kesin: yeşil gitmeli.
Ben Gremillion tarafından Webdesigner Deposu için özel olarak yazılmıştır. Ben bir serbestlik web tasarımcısı iletişim problemlerini daha iyi tasarımla çözer.
Renkleri nasıl test edersiniz? Renk şemaları oluşturmanın en sevdiğiniz yolları hangileri? Görüşlerinizi aşağıdaki yorumlarda paylaşın.