Web Tasarımı ve Grafik Tasarımın yeni trendi Flat Tasarım nedir?

Web Tasarımı ve Grafik Tasarımın yeni trendi Flat Tasarım nedir? Nasıl yapılır? Başlıca özellikleri nedir?

Flat Tasarım Terimi

Bu çok tartışılan bir konu. Microsoft’un “otantik dijital” dediği (ki flat tasarımda windows 8 etkisi yadsınamaz) bu terime başkaları “minimal tasarım”, “dürüst tasarım” gibi isimler kullandı. Bazıları da “düz tasarım” dedi. Ama terimin ne anlama geldiğini boşverip ne işe yaradığına bakalım.

Yani ?

Kısaca söylersek flat tasarım “sade tasarım“dır. Bu kelime herzaman “basit” kelimesiyle karıştırılmaktadır. Tasarımcılık geçmişimizde gölgeleri az yaptığımızda, ağır gölgelendirme yada efektler kullanmadığımızda sıkça duymuşuzdur sade olmuş yerine “ basit olmuş” kelimesini. Hatta beyaz fon kullanıdığımızda “renksiz olmuş” gibi enteresan eleştirileri saymıyorum bile. Yıllarca sadeliğe direnen, sadeliği basitlik, boşluk, verilen paranın karşılığında işçilik alamamak olarak gören, olabildiğince abartılı efektler talep eden müşteri kitlesi nihayet azalmaya başladı. Bu arada tasarımda sadeliğin hayatımıza girmesinde katkısı büyük olan Steve Jobs’a teşekkürlerimi sunuyorum.

Sadelik Karmaşıklığın Doruğudur – Steve Jobs

Flat tasarım; gölge, kabartma, fotoğraf ve çerçeve efektleri (hatta minicik sıkışık yazılar) gibi göz yorucu ve kullanıcıyı oyalayıcı ögelerin ortadan kalkmış halidir diyebiliriz. Günümüzde insanların neredeyse hiçbirşeye zamanı kalmadığını düşünürsek web sitelerinde yada basılı ve görsel diğer materyallerde kimsenin oyalanacak zamanı bulunmamaktadır. Flat tasarımı zorunlu hale getiren ve populerleştiren de bu sanırım.

Herşey dümdüz ya da sade olacaksa tasarımı nasıl yapacağız ? O zaman herkes tasarımcı mı olur?

Sadelik sanıldığı kadar basit bir durum değildir. Sadeliği tasarlamak için tipografi, renk dili, kullanıcı psikolojisi, minimalist anlayışa sahip olmak gibi birçok bilgi ve tecrübeyi kapsayan özelliğe sahip olmak gerekiyor. Bunun yanısıra işin içine yazılım veya mobil özellikler de girecekse dikkate alınması gereken birçok konu bulunuyor. Sadeliği basitliğe götürmek değil şık hale getirmek flat tasarıma yönelen tasarımcınıların ince çizgisi olacaktır. Ama örnekler incelendikçe, iyi kötü yönlerini anlamaya çalıştıkça konuya da hakim olmak kolaylaşacaktır.

Flat tasarımda sadeliği sağlayan en önemli unsurlar fotoğrafların doğru seçimi, tipografi için doğru font seçimi ve bu fontların ince-kalın, büyük küçük formatlarda güzel kullanılması, sade geometrik nesneler, açık ve koyu fonlarda kullanılacak canlı-pastel renkler ve ilaveten de kullanabiliyorsanız sade ufak hareket animasyonlarıdır.

Aşağıda flat tasarım için gereken genel özellikleri örnekleriyle göstermye çalışacağım.

Fotoğraf Seçimi

Mümkün olduğunca kaliteli çekilmiş fotoğraflar kullanın ve bu fotoğrafların renklerinin sitenizde ve logonuzdaki genel renk tonlarınızla uyumlu olmasına çalışın. Gerekirse photoshop için insatagram efekti pluginleri indirin.

Bu siteden indirebilirsiniz: http://dbox.tumblr.com/post/5426249009/instagram-filters-as-photoshop-actions

Ya da sitenin genel renklerine uygun opasitesi düşürülmüş dolgular kullanın. Fotoğraflarınızda mümkün olduğunca yorucu çerçeveler, gölge efektleri kullanmayın.

Sade Nesneler

Çeşitli geometrik ve sade nesneler kullanmanız tasarımlarınıza hareket katacaktır. Özellikle web tasarımı ve mobil uygulamalarda bir miktar da basılı işlerde kullanılan ve tasarımları çok daha güzel gösteren vazgeçilmezimiz ikonları da unutmayalım.

Tipografi

Tipografi günümüz tasarımcılığında hızla yükselen bir trend. Ücretsiz ulaşabileceğimiz ve birbirinden güzel yazı fontlarının da artmasıyla web siteleri daha da güzelleşmeye başladı. Google fontları bu anlamda çok işimize yaradı. Buradan (https://www.google.com/fonts#Analytics:total) en populer fontları görebilirsiniz.

Renkler

Başta logo renkleri olmak üzere farklı renk tonları kullanabilirsiniz. Özellikle flat tasarımlarda kullanılar populer renkler mevcut. Bu tarz renkleri size hazır sunacak birçok site bulabilirsiniz. Örneğin:
http://www.flatuicolors.com
http://www.flatuicolorpicker.com
http://www.flatcolors.net

Animasyonlar

Flat tasarımlarınızın (web sitesi) durağanlığından şikayetçiyseniz ve ikonlar, nesneler ve genel yapısıyla tasarımınız dinamik değilse biraz hareket katabilirsiniz. Bunun için Wow.js ve Animate CSS gibi kodlar, kolay kullanımlarıyla çok işinize yarayacaktır.

Silüet Tanıtım Ajansı

Okuduğunuz konuyla ilgili destek, istek, öneri, şikayet veya öylesine iletişime geçebilirsiniz.

İLGİLİ DİĞER KONULAR

Web Sitesi Yapım Aşamaları

Web Sitesinin Avantajları

Web Tasarımda 10 Ölümcül Hata