2016 WEB TASARIM TRENDLERİ

2015’in sonlarına doğru yaklaşırken, önümüzdeki yılın web tasarım trendleri’de netleşmeye başladı. 2015 yılı; responsive (esnek), one page (tek sayfa), parallax (kaydırmalı), full page (tam ekran) ve flat (düz) tasarım trendlerinin yılıydı. Tasarımda tipografi kullanımı da bu yıl önemli oranda artış gösterdi.  Bu trendleri 2016 yılında da sıkça görmeye devam edeceğiz..  Ek olarak evrimlerine de şahit olacağız. Örneğin bu yıl flat tasarımda derinlik ve boyut kazandıran hafif gölgeler, ton geçişleri görmeye başladık. Böylelikle Flat 2.0’ın doğuşuna şahitlik ettik. Peki önümüzdeki yıl tasarım trendlerinde hangi gelişmeler olacak? İşte ön görülerim;

 

Flat 2.0 kullanımı artacak

Artık flat stilinin aşırı sadeleğinden bunalan tasarımcılar, projelerinde flat 2.0 kullanımını arttıracak. Biraz daha gölgeli ve renk geçişli tasarımlar görmeye başlayacağız. Böylelikle eski ve terkedilmiş realizm akımının bazı stilleri, onu tahtından eden tasarım akımı sayesinde tekrar dirilecek. Yılın ilk yarısında hafif kabartma ve hareket kazandıran css animasyonları ile flat bir kere daha evrilecek. Belki de 3.0 versiyonuna tanık olacağız.

flat-2.0

 

Daha çok katman

Bu yıl parallax kaydırmalı sitelerde patlama yaşandı. Genellikle de iki katman kullanımı yaygın. Fakat çok daha fazla sayıda katman kullanılarak yapılan kaydırmalı siteler azınlıkta kaldı. 2016’da bu tarz projelerin daha da artacağını umut ediyorum. İşte en beğendiklerimden biri;

parallax
parallax web site

 

 

Hikayeciliğin yükselişi

Son birkaç yıldır web arayüz tasarımı sadece “iş görsün” mantığıyla yapılmıyor. Artık reklamcılığın, marka-ürün bilinirliğinin ve etkileşimin de önemli bir parçası. Son teknikler sayesinde 2016’da, görsel kurgular kullanılarak oluşturulan ve hikayesini etkileyci bir biçimde sunan web sitelerde de hatırı sayılır bir artış göreceğiz.

hikayecilik

 

Tipografi yine yedek klübesinde

Özetle tipografi için harfleri görsel bir sanata dönüştürme tekniği diyebiliriz. Tasarımlardaki ağırlığının gözle görülür biçimde artmasına rağmen hala ” başlık resimlerinin yerine geçmek gibi ” bütünüyle fethedemeyeceği kaleler var. Artan sadelik yaklaşımına rağmen başlıklarda resim-imaj kullanımı, bir süre daha yaygın biçimde tercih edilmeye devam edecek.

tipografi

 

Sadeliğin altın yılı

Yavaş ve emin adımlarla realizmi tahtından eden ve geçtiğimiz yıllar boyunca kendini kabullendiren sadelik akımı “daha da sade” olmaya yöneliyor. Örneğin dikey ve yatay liste menülerin yerini hamburger menüler alacak. Bu menüleri daha çok tasarımların mobil formlarında görmeye alışkınız fakat artık masaüstü ve dizüstü bilgisayarlarımızın ekran çözünürlüklerine uygun formlarında da  göreceğiz.

sadelik

 

 

Kart Düzenleri ile daha organize içerik

Pinterest’in öncülüğünü yaptığı, bu organize yerleşim stilini özelllikle haber, magazin hatta blog  ara yüzlerinde daha çok göreceğiz.  Gönderi kapak resmi, başlığı, tarihi bazen de  bir cümlelik özet yazı içeren kartlar sayesinde kısıtlı alanlarda daha iyi değerlendirebilmek ayrıca da görsel zenginliği arttırabilmek mümkün. Örnek olarak kendi bloğumdaki kart düzenini gösterebilirim.

kart düzeni
web tasarımda kart düzeni

 

Daha Animatif Siteler

Sadeleşen tasarımlarımızı hareketlendirmek için çeşitli animasyonlar kullanıyoruz. CSS3 ile sayesinde java ya da flash’a gerek kalmadan çeşitli efektler oluşturabiliyoruz.  Eğer yazmayı bilmiyorsanız hazır kodlarına buradan ulaşabilirsiniz;
https://daneden.github.io/animate.css/
Geçen yıl özellikle kayma ve yerleşim efektleri öne çıkmıştı. 2016’da ek olarak çeşitli yaratıcı hover efektlerinin kullanımı artacak. Bunlardan biri de 3D hover efekt olacak.

İşte örnek bir 3d hover efekt uygulaması;
http://codepen.io/sebastianekstrom/pen/jDmKo

 

Video Slaytlar

Sanırım web tasarımlarda yeterince imaj slayt kullandık. Artık hareketli görüntülere geçme zamanı.  Yabancı sitelerde video slayt örnekleri bir hayli çoğaldı Türkiye’de ise yeni yeni başladı diyebiliriz.  Belki şuna evrilebilir; ileride aralıksız kart düzenine uygun, sırayla birkaç saniye oynayan video slaytlar görebiliriz. .Video slayt için, arayüzünü tasarladığım bir  web tasarım firmasının kurumsal web sitesini örnek gösteriyorum;

video-slayt

Serdar SEZER

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir