flat tasarım prensipleri

windows 8 metro arayüzündeki basitliğine özenmiş güncel web sayfalara verilen ad olsa gerek. bu tasarımda bazı grafikerlerin hakkı yeniyor olabilir.

mesela gerçek büyüteç şeklinde arama ikonu çizebilen bir profesyonel ile paintten basit yuvarlak altında çapraz çizgi çizebilen bebe ile kıyaslanabilecek duruma getirdiler. bu flat design yüzünden.

Hasan Yalçından alıntı flat tasarım nedir?

Son dönemde neredeyse trendler üzeri bir hal alan Flat arayüz tasarımları hakkında bilgileri paylaşmanın zamanı geldi de geçiyor bile. Apple’ın bile dayanamayıp yeni işletim sistemine uyarladığı Flat UI nedir, prensipleri nelerdir göz atalım!..

Daha öncede sizlere söz ettiğim hatta her yıl başında paylaştığım tasarım trendlerini hatırlarsınız. 2013 için ön görülen maddeler, Responsive (Duyarlı) Web Tasarımı, Tipografik Tasarımlar, Büyük Görseller, HTML5, CSS3 & Paralaks Kaydırma Efektleri, Minimalizm & Sadelik, Skeuomorphism, Daha Büyük Butonlar şeklindeydi.

Ancak bu öngörüler arasından uzun yıllardır olmadığı şekilde, Flat UI tasarım trendi fırlayarak bir anda tüm dünyayı kapladı. Aslında Flat arayüz tasarımlarının temeli Microsoft’un yeni işletim sistemi Windows 8′in Metro UI adını verdiği arayüz tasarımlarına dayanıyor.

Ancak bugüne geldiğimizde bu stilin hem web hem de kullandığımız kimi cihazların vazgeçilmez arayüz özelliği haline geldiğini görüyoruz. Özellikle Apple’ın ios7 arayüzünde Flat’ı tercih etmesi, sayısız uygulama geliştiricinin de uygulama tasarımlarını değiştirerek bu trende uyum sağlaması Flat UI elementlerinin uzun süre hayatımızda kalacağına dair bir ipucu olabilir.

Bir paragrafta toparlamak gerekirse bu yeni trend için, gölge, eğim, kabartma, gradient renk geçişlerinden yoksundur, 3D elementler, gölgeli kabarıklıklar yoktur, skeuomorphic tasarım elementlerine zıttır, minimalist yaklaşım bu trendin eksenini oluşturur.

Basitlik

Flat tasarımın en önemli ayrıntılarından biri bastlik şüphesiz. Karmaşık anlaması zor öğeleri en basit haliyle sunarak algı sürelerinin azalması bu stilin ana yapı taşı.

fb
Facebook’taki ikonların değişimi bu sadelik anlayışı için oldukça iyi bir örnek sayılabilir.

Derinliğin Sonu

Flat arayüz tasarımlarında derinliğe sahip, 3 boyutlu, emboss efektine sahip, gradient renklendirme yapılmış hiç bir element kabul görmemekte. Tam aksine tamamen sadeleştirilmiş, üzerindeki detaylardan arındırılmış bir anlayış söz konusu.

skeu1
Flat tasarım, skeuomorphism yani objeleri gerçek dünyada göründükleri gibi grafikleştirmenin de sonunu getirmiş durumda.

Basitliğin Güzelliği

Aslında basit olan hemen herşey güzel ve işlevseldir. işte Flat tasarım eğilimi tam da bu noktada devreye giriyor. Derinlik ve boyutlardan arınmış grafik elemanlar, en basit hali ile dörtgen ve kareler basite indirgenmiş düz şekiller flat tasarımın vazgeçilmezleri.

fliccv
Tipografi

Tipografik estetik Flat tasarımlar için önemli bir başka unsur. Flat tasarımların ortak tercihleri; Serifsiz fontlar tercih edilir. Sistem fontları dışında kullanımı yaygındır. Büyük harf kullanımı revaçtadır.

fltftf
Flat Tasarım Renk Odaklıdır

Renkler Flat tasarımın en önemli unsurlarından biri, hatta Flat UI için kabul edilen renk paletleri oluşmakta. Özellikle FlatUIColors sitesi bu konudaki en iyi kaynaklardan biri. Flat tasarımlarda kullanılan renkler genelde canlı tonlardan seçilip, mat ve pastel versiyonlar tercih edilir.

Mobil Dünya ve Flat UI

Flat tasarım yeni nesil, özellikle de IOS 7′nin çıkışının da etkisi ile mobil cihazların vazgeçilmezi olma yolunda ilerliyor. Ancak bu işin öncelike yine Windows Mobile tarafından yapıldığını, diğerlerinin daha sonra ortaya çıktığını belirtmek gerek. Aslında önemli olan bu tip görsellere sahip işletim sistemlerinden etkilenen uygulama tasarımları. Mobil tarafta yeni bir yolda yürümeye başladığımız kesin.

mobilflat
Özet olarak Flat tasarımlar için eski tarzda her tür görselin yeni ve “düz” bir bakış açısı ile yenilemek denebilir. Bu her tür grafik unsur için geçerlidir. Basit dilimli bir bilgi grafiğinden, mobil bir uygulamaya, dev bir web sitesinden ufak bir mailing çalışmasına, hatta infografiklere dek uzanan geniş bir yelpazede Flat öğeler yer alabilir.

pieflat
Web arayüzleri konusunda da aslında tüm yukarıdaki ayrıntı ve detayların uygulanması ile bu tarzı yakalamak mümkün. Bu noktada arayüz elemanlarının nasıl yorumlandığına da dikkat etmek gerekiyor. Aslında internet üzerinde araştırma yaparsanız bir çok flat tasarım kaynak dosyasına ulaşmanız da mümkün.

flaw2
Flat tasarımlar yapabilmek için öncelikle sadelik ve basitlik olgusunu kafada oturtmak gerekiyor. Gereksiz tüm ayrıntılardan kurtulduğunuzu hissetiğiniz anda en iyi ve en sade tasarıma ulaşacaksınız..