Tema Tasarım Rehberi #1

Tasarım Yönergeleri
1- Öncelikle yapmak istediğiniz temanın hedef kitlesini ve tasarımda kullanacağınız renk tonlarını belirleyin. Bunun için Color Schemer veya Colour Lovers adresini kullanabilirsiniz.

Örnek bir renk şablonu göstermek istiyorum;

3 tane ana renk ve tonlarını hazırladık. Renk paleti tasarımda çok yardımcı olacaktır.

2- Tasarımda kullanacağınız renkleride sınırlamayı unutmayın. Gereksiz fazla çeşit renkli tasarımlar göze hoş gelmez. Renk uyumuna bu nedenle dikkat etmeliyiz. Sıcaklık yelpazesine uymayı unutmayın. Ya tüm sıcak renkleri ya da tüm soğuk renkleri seçin. Sıcak renkler kırmızılar, turuncular, sarılar, kahverengiler vb. Soğuk renkler ise maviler ve morlardır. Eğer tüm renklerinizi bir sıcaklık aralığında seçerseniz, büyük ihtimalle uyumlu olacaklardır.

Şu örneğimizi inceleyelim;

Ne kadar kötü görünüyor değil mi? Sürekli bu resme bakarak gözlerimizi yorarız, haliylede tasarımımızda bir anlam kazanmaz. Bu nedenle şu tarzda renk tonlarında hazırlanmış uygulamalar yapın;

3- Tasarımda watermark tarzı arkaplanı şeffaf olan bir resim kullanmak istiyorsanız saydamlık değerlerini %10-15 arası yapabilirsiniz. Örneğimizi inceleyelim;

Arkaplan konsantrat değeri %15 olan bir resim


Arkaplan konsantrat değeri %100 olan bir resim

Aradaki farkı şimdi daha iyi anlamış olmalısınız. Yapacağımız tasarımlarda renk konsantratı çok önemlidir. Eğer, ziyaretçinin dikkatini tasarımınızdaki önemli bir alana çekmek istiyorsanız, bunu kontrastla başarabilirsiniz! Tüm tasarımı açık renkte tutabilir ve dikkat çekmek istediğiniz alanı karartabilirsiniz.

4- Şimdi objelerin büyüklüğünün nasıl derinlik katabileceğine bir bakalım. Bu ilk örnek çok basit, sadece bir sürü daire var. Burada bir şeyin boyutunu ayarlamak gibi basit bir işlemle nasıl derinlik katabileceğimizi görüyoruz.

Her birinin boyutu bir öncekinden daha küçük. Boyutlarındaki değişikliğin nasıl derinlik hissi verdiğini görün. Hangi daire size daha yakın görünüyor? Tabi ki en büyük olan daire.

5- Renkler bile derinlik katmamıza yardımcı olabilir. Bu genellikle büyük uzaklıklarda söz konusudur. Bir dış sahne için renk seçerken, önplandaki nesnelerin güçlü, enerjik renklere sahip olması gerekir. Daha uzaktaki nesnelerin ise daha az canlı renklere sahip olmalıdır. Örneğimizi inceleyelim;

Görüldüğü gibi yeşil ağaçlık alan daha uzak görünüyor ve bize yakın olan kayalıklar ve insanlar daha canlı renklere sahip.

6- Yazılarınızda ve resimlerdeki nesnelerinizde gölgelendirme efekti kullanın. Tasarımınızın daha profesyonel ve daha güzel görünmesini sağlayacaktır. Gölgelendirme kullanırken gölgeyi hafif saydam olarak yaparsanız daha iyi görüntü elde edebilirsiniz. Örneklerimizi inceleyelim;

%30’luk gölgelendirmek efekti kullanılmış bir yazı


%30’luk gölgelendirmek efekti kullanılmış bir yazı


Gölgelendirme kullanışmamış bir yazı

Aradaki farkı açıkça görebiliyoruz. Hafif gölgelendirme efekti kullanılmış nesne daha iyi görünmekte ve tasarıma derinlik vermektedir.

7- Yazı tiplerinizi sınırlayın ve daha iyi görünüm elde edin. Bir tasarımda çok fazla yazı tipi kullanmak en büyük hatalardan birisidir. Broşüründe 8 farklı yazı tipi kullanan birinden daha kötü görünen bir şey yoktur. Bu konuda bir sitede yayınlanmış olan birkaç resimi göstereceğim;

Gördüğünüz gibi, burada sadece iki adet yazı tipi kullanıldı. Süslü yazı tipi, üst kısım için ve basit yazı tipi de genel metin için kullandık. Temiz ve tutarlı görünüyor.


Burada da yazı tiplerinin kötü kullanımı söz konusu. Bu durumda, bir çok süslü yazı tipi kullandım ve sadece tasarımı tutarsız gösteriyor. Alt kısım, ana başlıkla uyuşmuyor bile.


Daha da kötüsü genel metinleriniz için çok süslü bir yazı tipi kullanmanızdır

Eğer süslü yazı tipiniz modern veya çağdaş görünüyorsa, o halde basit yazı tipiniz bir sans-serif yazı tipi olmalıdır. Eğer süslü yazı tipiniz eski moda görünüyorsa, o zaman ikincil yazı tipi olarak serif kullanın.

Eğer $koşul değişkeni <span style=”text-decoration: underline;”>1’e eşit  olursa</span> <em><strong>1. deger</strong></em> gösterilecek, <span style=”text-decoration: underline;”>aksi durumunda</span> <em><strong>2. deger</strong></em> gösterilecek
<hr />

<table>
<tr>
<td valign=”top”>Sözlü olarak;</td>
<td valign=”top”><strong><span style=”text-decoration: underline;”>$koşul</span></strong></td>
<td valign=”top”><abbr title=”?”><strong><span style=”text-decoration: underline;”>soru  işareti</span></strong></abbr></td>
<td valign=”top”><abbr title=”Sağlanan koşul doğru ise”><span style=”text-decoration: underline;”><strong>$değişken1</strong></span></abbr></td>
<td valign=”top”><abbr title=”:”><em><strong>iki nokta üst üste</strong></em></abbr></td>
<td valign=”top”><abbr title=”Sağlanan koşul doğru değil ise”><em><strong>$değişken2</strong></em></abbr></td>
<td valign=”top”><abbr title=”;”><em><strong>noktalı virgül</strong></em></abbr></td>
</tr>
<tr>
<td valign=”top”>Basit örnek olarak;</td>
<td valign=”top”>($kosul == 1)</td>
<td valign=”top”>?</td>
<td valign=”top”>Koşul 1e eşit</td>
<td valign=”top”>:</td>
<td valign=”top”>Koşul 1e eşit değil</td>
<td valign=”top”>;</td>
</tr>
</table>

<hr />Bu tür kodlamalarda değişkenleride kullanmak isterseniz noktalara ve  virgüllere dikkat etmelisiniz, hemen örnek veriyorum.

Bir Cevap Yazın