Posts Tagged "tipografi"

Yeni Tipografi Hareketi

13 May 2010 tarihinde eklendi. Blog | 0 yorum

Bir süre önce okuduğum Emre Becer – Modern Sanat Ve Yeni Tipografi kitabını aranızda bilenler vardır mutlaka. Modern sanat akımlarının haricinde özellikle yeni tipografiye merak duyan herkesin okuması gereken eşsiz bir kaynak. Yeni Tipografi Hareketi’ni başlatan ve tipografiyi yaratıcı bir iletişim kanalı haline dönüştüren modernist öncülerden yola çıkarak günümüze dek süregelen yeni tipografi anlayışını anlatan bu kitabı bütün grafik tasarımcıların okumasını tavsiye ederim. Bildiğim kadarıyla, bu kitap aslında üniversitelerin Grafik bölümlerinde okutulan bir ders kitabı. Ama kesinlikle sıradan bir tarih kitabı ya da ders kitabı gibi sıkıcı değil. Ama okurken yeni tipografinin tarihini de öğreniyor, kendinize ders de çıkarabiliyor ve tasarımlara bakış açınızı genişletebiliyorsunuz.

Tipografi, web 2.0 ile birlikte web tasarımında da önem kazandı. Tipografik yapısı ile modern görünüme kavuşan web sitelerinde dahi ağırlıklı olarak kullandığımız yeni tipografinin, uzun bir süredir modern sanatın (görsel sanatlardan söz ediyorum) çok önemli bir parçası olduğunu dikkate aldığımızda, ilk olarak bu düşüncenin nasıl ortaya çıktığı ve nasıl geliştiğine değinen kitap, hemen ardından Yeni Tipografi Hareketi’ni anlatarak, tipografinin günümüzdeki son şeklini nasıl aldığını en iyi örnekleri ile gösteriyor. Ben de kitaptan alıntı yaparak düzenlediğim bir paragraf ile Yeni Tipografi Hareketi’nden kısaca bahsetmek istiyorum. İlgilenen tasarımcı arkadaşlar kitabı satın alarak, tipografi ile ilgili her şeyi çok iyi bir kalemden okuyabilirler. Açıkçası ben bayıldım ve bu makaleyi kesinlikle reklam olsun diye yazmıyorum. Söz konusu yazar ile hiç bir tanışıklığım veya ilgimin olmadığını belirteyim:)

Yeni Tipografi Hareketi

Almanya’da ortaya çıkan bu hareket, tipografideki modernist yaklaşımlar arasında önemli bir yere sahiptir. Yeni Tipografi düşüncesi ilk olarak El Lissitzky, Laszlo Moholy-Nagy ve Kurt Schwitters’ın 1923 – 1925 yılları arasında yayınladığı makalelerde ortaya çıktığında o zamana kadar yerleşmiş ve geleneksel bir yapı kazanmış olan bütün tipografik alışkanlıkları sorguluyordu. Özellikle Lissitzky tarafından kaleme alınan “Tipografinin Topografisi” adlı bildiride, özellikle basılı metinlerde işitsel algı yerine görsel algılamanın önemine değinilmiştir. Jan Tschichold 1925 yılında yazdığı “Tipografinin Esasları” adlı kitabında Yeni Tipografinin belirli bir amaç doğrultusunda biçimlendiğini, bu amacın da en kısa ve en yalın haliyle “iletişim” olduğundan bahsediyordu.

Yani kitapta da söz ettiği gibi, tipografinin asıl amacının “iletişim” olduğu. Şahsi yorumum olarak biraz daha genişletecek olursam, görsel iletişimde tipografinin amacı, algının verilmek istenen bilgiye odaklanmasını sağlayarak iletişimi kolaylaştırmaktır diyebilirim. Bu nedenle bir sayfa düzeninde yazı tipi büyüklükleri, renkleri, kenar boşlukları ve satır aralıkları gibi değerlerin doğru ayarlanması, aynı şekilde resimlerin de biçim ve konum olarak doğru yere doğru büyüklükte yerleşmesi ve kontrast açısından renklerin doğru ayarlanması tipografi temel prensipleridir.

Yukarda bahsettiklerim web tasarımında tipografi kullanımı için de aynen geçerli. Bu nedenle modern sanatta tipografi ile ilgili en doğru bilgiyi bu işin hocasından okumanızda fayda var. Evet, hoca kelimesini kullanıyorum çünkü kişisel web sitesinde de yazdığı üzere, Emre Becer halen Marmara Üniversitesi Güzel Sanatlar Fakültesi’nde Grafik Tasarım ve Tipografi derslerini yürütüyor. Ödülleri, kitapları, kariyeri ve özgeçmişi ile ilgili bir çok bilgiyi www.emrebecer.com adresinden öğrenebilirsiniz.

Devamını Oku

Kusursuz web tasarımının 6 yolu

9 May 2010 tarihinde eklendi. Blog | 1 yorum

İyi bir tasarımla kusursuz bir tasarım arasındaki çizgi çok ta kalın sayılmaz aslında. Ancak birbirinden ayıran çok önemli ayrıntılar vardır. İyi bir tasarım için nelere dikkat etmemiz gerektiğini daha önceki makalelerde de bahsettiğim üzere bir çoğunuz artık biliyor. Bir çok müşteri için iyi seviyede tasarladığınız web siteleri çoğu zaman yeterli olsa da, gelecekte portfolyonuza iyiden de öte kusursuz web tasarımları eklemek istiyorsanız bu makalede söyleyeceklerime kulak kabartın. Hatta tasarımda mükemmelleşmenin yollarını ana başlıklar halinde bir kenara not alıp, tasarımlarınızı bu yönde geliştirmeniz doğru bir çalışma şekli olabilir. O halde lafı fazla uzatmadan web tasarımlarınızı kusursuz yapmanın 6 yolunu sıralayalım:

1. Gradient kullanımına dikkat edin

2. Beyaz alan kullanmaktan çekinmeyin

3. Grid çalışmalar yapın

4. Tipografinizi geliştirin

5. Navigasyon menü tasarımına özen gösterin

6. Kullanışlı ve düzenli bir footer tasarımı yapın

Yeri gelmişken yukarıdaki maddeleri not alıp, monitörünüzün bir köşesine iliştirdiyseniz şimdi açıklamalarına geçebiliriz. Şayet açıklamaları olmadan maddeler hiç bir anlam ifade etmez. Onlar sadece size ne yapacağınızı hatırlatmak için gerekecektir.

1. Gradient kullanımına dikkat edin

Web sitelerinde gradient kullanımı o kadar önemli ki aynı siteyi, kötü gradient kullanımı ile amatör, iyi gradient kullanımı ile profesyonel gösterebiliriz. Bu nedenle gradient kullanımı konusunda çok dikkatli davranmalıyız ve günümüzün tercih edilen gradient stillerine göz atmalıyız. Mükemmel bir web sitesinde gradientteki renkler arasında uçurum olmamalı, aralarında ince (zarif) ve yumuşak bir geçiş oluşturulmalı. Bu görünüm, sitenin daha pürüzsüz ve temiz görünmesini ve etkili bir hitap şekline sahip olmasını sağlar.

Gradient kullanımında Bokeh efekti

Bilmeyenler için, Bokeh kavramı daha çok fotoğrafçılıkta kullanılan ve görüntüde oluşan bulanık yuvarlak bölümler için verilen bir isim. Son zamanlarda web tasarımında özellikle arka plan resminde Bokeh efekti ile ışık oyunları yaratılıp oldukça şık bir gradient elde ediliyor. Aşağıdaki örnekte de görebileceğiniz gibi gradientteki doğru renk geçişleri ve Bokeh efektinin kullanımıyla mükemmel bir tasarım çıkmış ortaya.

Gradient, gölge ve dokunun birlikte kullanımı

Tasarımda gradient, gölge ve dokuyu birlikte kullanarak gerçekçi bir etki yaratmanız mümkün. Mükemmel website tasarımları için, gradient haricinde gölge ve doku kullanımında da aynı özeni göstermeniz gerekiyor. Aşağıdaki örnek bunun en doğru örneklerinden. Resmin üzerine tıklayarak sitesinden ayrıntılara göz atabilirsiniz.

2. Beyaz alan kullanmaktan çekinmeyin

Her fırsatta belirtmeye özen gösterdiğim konulardan biri de sitedeki beyaz alan kullanımı. Daha önce yayınladığım bazı makalelerde de bahsetmiştim. Burada tekrar karşımıza çıkıyor. Öncelikle beyaz alanın tam sözlük anlamı olarak algılanmasının web tasarımdan yanlış bir kullanıma yol açabileceğini belirteyim. Web tasarımında bahsettiğimiz beyaz alan kullanımının, web elementleri arasındaki boşluğun doğru kullanılmasıyla tasarımı sıkıştırmamak ve rahat bir nefes aldırmak olduğunu söyleyebilirim. Sanırım bir çok tasarımcının en büyük sorunlarından biri de bu. Her alana “burası da boş kalmasın” mantığı ile bir element yerleştirmeye kalkıp, arayüzü tıka basa doldurmak kesinlikle yanlış bir düşünce. Bırakın boş kalsın. Tasarımda iyi bir kompozisyon yaratmak için gerekli olan anahtar kelime kesinlikle beyaz alandır. Bunun en doğru örneklerini de aşağıda görebilirsiniz.

3. Grid çalışmalar yapın

Grid’in tam olarak Türkçe karşılığı nedir bilmiyorum ama web tasarımda literatüre Grid kelimesi olarak çoktan geçti bile. Özellikle gazetelerde ve artık bloglarda da sıkça karşılaştığımız grid çalışmalar, belli eksenler ve ölçüler temel alınarak bloklar halinde yapılan tasarımlara deniyor. Yani tasarımda yer alacak Header, footer, navigasyon menü ve içerikte yer alacak her bölümün yerini ölçülü bir şekilde belirleyerek tasarımın daha düzgün bir şekilde oluşmasını sağlayarak sitenizi kusursuz bir hale getirebilirsiniz.Tasarımlarınızda bütün elementleri düzgün yerleştirmenin en doğru yolu Grid çalışmaktır. Bunu her tasarımınızda alışkanlık haline getirmeye çalışın.

Grid çalışmalar için The 960 Grid veya BluePrint gibi en popüler hazır CSS çatılarından da faydalanabilirsiniz.

4. Tipografinizi geliştirin

Tipografi, iyi tasarımcılar için bir saplantı haline gelmiş sanat dalıdır. Web sitenizin kalitesini bir basamak daha yükseltmek için mutlaka web tasarımında tipografi kullanımına dikkat etmeniz ve kendinizi bu konuda geliştirmeniz gerekiyor. Bir çok web tasarımcı, tipografiyi yazı tipi seçimi ve başlıkları daha büyük yazmaktan ibaret sanıyor. Bunlar tabiki de önemli noktalardır ancak tipografinin asıl amacı, hiyerarşik yapıya uygun bir yazı düzeni ile algıyı artırmak, odak noktalarını belirlemek ve okunaklılığı kolaylaştırmaktır. Tipografinizi geliştirmenizde işinize çok yarar bir kitap olan Emre Becer – Modern Sanat ve Yeni Tipografi kitabını şiddetle tavsiye ederim. Bu kitaptan tipografiyi öğrenip web tasarımına doğru bir şekilde uyarladığınız zaman ortaya kusursuz siteler çıkarabilirsiniz. Ayrıca web tasarımında tipografi için CSS bilgilerinizi de gözden geçirmenizde fayda var. Web tasarımında doğru tipografi kullanımı ile buradaki yazı dizisinin çok işinize yarayacağına eminim.

5. Navigasyon menü tasarımına özen gösterin

Sitenin ana menü tasarımı, website için çok önemlidir. Eğer site kullanıcıları aradıkları şeyi menüye bir bakışta bulamazlarsa, muhtemelen başka sitelere gideceklerdir. Bu nedenle navigasyon menü tasarımında sadeliğe, kullanış kolaylığına ve düzenli görünüme çok önem vermelisiniz. Menüde bir diğer dikkat etmeniz gereken nokta ise üstüne gelince alacağı görüntüyü (hover efekti) ihmal etmemenizdir. Bu efekt, menünün çok daha etkili kullanımını sağlar. Aşağıdaki sitede iyi tasarlanmış bir navigasyon menü örneği görebilirsiniz.

6. Kullanışlı ve düzenli bir footer tasarımı yapın

Daha önceleri çok ta önemsenmeyen Footer bölümü, özellikle de blogların yaygınlaşmasıyla önemli bir bölüm halini aldı. Ve dolayısıyla kusursuz bir web sitesi tasarlamanın önemli maddelerinden biri oluverdi. Bu nedenle artık Footer’ın sadece copyright cümlesinin yazıldığı bir bölüm olmadığını göz önünde bulundurarak, tasarımın geneline verdiğiniz önemin aynısını Footer bölümüne de vermeniz gerekiyor. Hem ayrıca Google’ın siteleri indekslerken Footer’da yer alan linklere çok önem vermesi de bu bölümün artık ne kadar önemli olduğunun bir göstergesi.

Tasarım yaparken bu maddelere dikkat ettiğinizde web sitelerinizi bir basamak daha öteye taşıyıp, “iyi”den “kusursuz”a yükseltebilirsiniz. Peki sizce kusursuz bir web tasarımı için başka hangi unsurlar önemlidir? Yorumlarınızı bekliyorum.

Devamını Oku

Tipografi tasarımlarınız için 40 ücretsiz font

8 May 2010 tarihinde eklendi. Blog | 0 yorum

Günümüzün tasarım anlayışında, tipografi kavramı bir süredir yerini almış durumda. Afiş, logo, dergi ve son olarak da web tasarımlarında tipografik tasarıma çok önem vermeye başladık. Bu tarzda çalışmak için ise tipografik tasarıma uygun yazı tiplerine ihtiyaç duyuyoruz çoğu zaman. Aslında Helvetica fontu bütün tipografi işimizi rahatlıkla karşılayabilen bir font olsa da bazen farklı fontlara ihtiyaç duyabiliriz elbette. Bu yazıda tipografik tasarım yaparken ihtiyaç duyabileceğiniz tam 40 adet font bulunuyor. Hepsini resimlerin üstüne tıklayarak ücretsiz indirebilirsiniz. Tasarımlarda yazı tipi seçiminin ne kadar önemli olduğunu hatırlatacak olursak bu fontların da arşivinizde mutlaka bulunması gerektiğini rahatlıkla söyleyebilirim. Ücretsiz ama aralarında oldukça profesyonel ve şık tasarlanmış fontlar bulunmakta.

MDRS-FD01

AvantGarde ALT

Exus Pilot

Knarf Art Font

Velocity

Amputa Bangiz Standard TTF

Facet Font

Solomon Font

Val Font

Just Old Fashion

Cube 02 Font

MOD Font

Sketchetik

Cube Font

Days Type Face

Form Conspiracy

Portal Free Font

OT Free Font

The Thunderbop Font Final

Bright Bold

Kilogram

Paranoid

Museo Sans

Quad Type Face

Layer Cake

Vintage

Goca Logo Type Beta

Ripe

Orial

File Free Font

Bola

Tiza

Chewedkandi Font Weknow

Potato

Circled Font

Nilland

Unite

Origram

Evolution True Type Font

Ovala Font

Devamını Oku

20 Ücretsiz Modern Yazı Tipi

26 Şub 2010 tarihinde eklendi. Blog | 1 yorum

Tasarımcılar olarak özellikle kurumsal çalışmalarda kusursuz yazı tiplerine ihtiyaç duyarız. Çünkü kurumsal tasarımları daha canlı hale getirmenin en kolay yollarından biri, tasarımlarımızda modern yazı tipleri kullanmaktır. Bana göre kurumsal tasarım çalışmalarının en zor yanlarından biri ise yazı tipi seçimidir. Tasarımını yaptığınız şirketin kurumsal kimliğini doğru yansıtıyor olması çok önemlidir. Ve bir çok tasarımcının bu noktada kararsız kalıp yanlış seçimler yaptığı olmuştur.

Bu kararsızlığa yol açan etken ise bütün fontları kategorilere ayırmadan bir arada kullanmaya çalışmaktır. Bu hatanın önüne geçebilmek için, tasarımcılar çalışmaya başlamadan önce “modern, teknolojik, eğlence” gibi kendi belirledikleri kategorilere göre yazı tiplerini gruplandırıp, daha sonra ihtiyacı olduğu kategoriden yazı tipini seçerek tasarımda kullanmalıdır.

Bu kaynakta kurumsal çalışmalarda kullanabileceğiniz ücretsiz modern yazı tiplerini özellikle header bölümlerinde, başlıklarda hatta logo tasarımlarında bile kullanabilirsiniz.

Decker

Fertigo

Harabara

Juice

Birdman

Daville

Camellia

Grouser

Installer

Photonica

Diavlobook

Mager

176mksdal

Geometry Soft

Days

Picoblackal

Dekers

Caviar Dreams

Sansation

Albertino

Devamını Oku

1000 Adet Photoshop Dersi

24 Şub 2010 tarihinde eklendi. Blog | 7 yorum

Tasarımla ilgilenip de Photoshop derslerini takip etmeyen kişi sayısı yok denecek kadar azdır herhalde. Bu noktada blogumda Photoshop derslerine de yer vermem gerekir diye düşünüyorum. CSS, Jquery ve WordPress yazılarından dolayı Photoshop’u ihmal ettiğimi itiraf etmem gerekiyor:) Ama o kadar günün acısını çok geniş bir kaynakla telafi edebileceğimi tahmin ediyorum.

Şaka değil, gerçekten de 1000 adet Photoshop dersi bulunuyor bu kaynakta. İkon tasarımından logo tasarımına, manipülasyondan dijital fotoğraf dersine, wordpress tema tasarımından tipografi çalışmalarına kadar Photoshop’la ilgili aradığınız her şeyi bulabileceğiniz es geçilmemesi gereken bir kaynak bu. Amatör ya da profesyonel tasarımcı olmanız farketmiyor, 1000 Photoshop dersinden mutlaka seviyenize uygun olanı çıkacaktır.

Fotoğrafı Avatar’a dönüştürme dersleri: 15 Adet

Adidas reklam tasarımı dersi

3 boyutlu likit patlama çalışması

3 boyutlu buzlu yazı efekti

Logo tasarımı ile ilgili ipuçları

Tipografik Afiş Tasarımı

Kış Olimpiyatları – Snowboard Afiş Tasarımı

Yüksek kaliteli ikon tasarım dersleri: 60 Adet

Özel seçilmiş logo tasarım dersleri: 31 adet

İkon tasarım dersleri: 20 Adet

HDR Resim Dersleri: 20 Adet

Logo tasarım dersleri: 55 adet

WordPress Tema Tasarım Dersleri: 17 adet

Kaliteli Yazı Efektleri: 15 Adet

Profesyonel Photoshop Dersleri: 10 Adet

İkon tasarım dersleri ve kaynakları: 46 adet

En İyi Photoshop Dersleri ve İpuçları: 10 Adet

İkon Tasarım Dersleri: 40 adet

Header Tasarım Dersleri: 101 adet

İkon Tasarım Dersleri: 48 adet

Apple tarzı Photoshop dersleri: 31 adet

Profesyonel Photoshop Dersleri: 20 adet

Su efekti dersleri ve Photoshop fırçaları: 40 adet

Detaylı WordPress Tema Dersleri: 37 adet

Güncel Photoshop Dersleri Derlemesi: 55 adet

En iyi logo tasarım dersleri: 30 adet

Elektronik Aygıt Tasarım ve İllustrasyon Dersleri: 60 adet

Başlangıç ve ileri seviyede yaratıcı photoshop dersleri: 33 adet

Efektli yazı tasarım dersleri: 5 adet

Birbirinden güzel logo tasarım dersleri: 30 adet

PSD’den HTML’e dönüşterme dersleri: 22 adet

Tipografi Tasarım Dersleri: 42 adet

İkon Tasarım Dersleri: 31 adet

Devamını Oku

Ücretsiz Tipografik Website Template’leri

17 Şub 2010 tarihinde eklendi. Blog | 1 yorum

Zaman darlığından dolayı, sıfırdan web site tasarlamak ve yazmak yerine hazır web siteleri çoğu zaman kurtarıcı kaynak olabiliyor. Üstüne bir de Web 2.0 anlayışı ile web sitelerinde önem verilen tipografi eklenince böyle bir arşiv web tasarımcılar için daha önemli oluyor. Smashing Magazine tarafından ücretsiz paylaşıma sunulan bu arşiv, CSS çatısı bakımından hazır site kullanmayı tercih etmeyenlerin bile işine yarayabilecek hazır CSS / XHtml çatılarını barındırıyor. Ayrıca tipografik hiyerarşileri ile özellikle web tasarımlarında tipografi tekniğini geliştirmek isteyenlerin incelemesi gereken arayüzler var.