2020 için 13 web tasarım trendi

Yayınlanan: 2020-02-06

Bu yıl o kadar çok web tasarım trendi var ki, tam olarak neyin trend olduğunu ve tasarım dünyasında neyin ortak bir konu olduğunu bilmek zor. Flywheel'in kendi endüstri lideri ve Sanat Direktörü Nicholas Petersen, güncel grafik tasarım trendlerine ayak uydurmanın şart olduğunu düşünüyor. "Tasarım topluluğunda meydana gelen trendlerin farkında olmak, tasarımcı olarak kendi becerilerinizi gerçekten geliştirmek için yardımcı olur."

Bu makalede, en iyi 13 web tasarım trendinin neler olduğunu, neden bunlara dikkat etmeniz gerektiğini ve sektördeki diğer önde gelen tasarımcıların düşündürücü tavsiyelerini ele alacağım.

İşte 2020 için en iyi 13 web tasarım trendi:

  1. soyut resim
  2. geometrik tasarım
  3. minimalizm
  4. 3 boyutlu
  5. Ulaşılabilirlik
  6. Tercih ayarı
  7. Sürükleyici deneyimler
  8. karanlık mod
  9. Canlı renk şemaları
  10. izometrik tasarım
  11. Özel tipografi
  12. Basitleştirilmiş illüstrasyon
  13. Grafiklerle fotoğraf çekmek


soyut resim

Soyut illüstrasyon, sanat ve tasarım arasındaki mükemmel dengedir. Bu büyüyen bir trend çünkü parlak renkler ve soyut şekiller, çizgiler ve görüntüler, diğerlerinden farklı bir tasarım yaratıyor.

Solda mavi bir soyut sanat eseri içeren Dropbox'ın giriş sayfasının ekran görüntüsü.
Dropbox'ın giriş sayfasının , soyut illüstrasyon içeren ekran görüntüsü
İçinde tasarım olan bir dinozorun bulunduğu soyut illüstrasyonun ekran görüntüsü.
Behance'den ekran görüntüsü

geometrik tasarım

Geometrik web tasarımı, bu yıl ortaya çıkan bir başka trend. Geometrik tasarım, düz geometrik şekillere sahiptir ve çok basit görünse de, arkasında çok fazla düşünce ve kasıtlılık vardır. Daireler ve kareler gibi basit geometrik şekilleri alıp bir hikayeye dönüştürmek için belirli bir tür web tasarımcısı gerekir.

Sayfada dikey olarak dizilen pembe kurdeleli ve üstte metin bulunan bir web sitesinin ekran görüntüsü.
RALLY'nin ana sayfasının ekran görüntüsü
Manyetik renklere ve geometrik şekillere sahip yarı saydam el ilanlarının ekran görüntüsü.
Adobe'den görüntü

minimalizm

Geometrik tasarımı seviyorsanız, bu trendi seveceksiniz: Minimalizm. Minimalist tasarım, doğrudan doğruya ve temiz tasarımdır. Gürültülü ve parlak renklerle dolu kalabalık bir dünyada, minimalist web siteleri web tasarımında bir işaret haline geldi.

Minimalist web sitesi tasarımı, ziyaretçilerin sitelerde gezinmesi için kusursuz bir kullanıcı deneyimi yarattığı için popülaritesini de artırıyor.

Sayfanın ortasında odak noktası olarak bir bisiklet bulunan beyaz bir ana sayfanın ekran görüntüsü.
Motus'un web sitesinin ekran görüntüsü

Georgia'dan bir tasarımcı olan Zac Moore, minimalist grafik tasarımın, grafik tasarımcıların geleceğini görebilecekleri bir trend olduğuna inanıyor. “Tasarım son birkaç yıldır minimalist bir yol izledi; temiz bir kullanıcı deneyimine ve dağınıklığın olmamasına doğru daha hızlı ilerliyor. Bence minimal yaklaşımı yeni benimseyen tasarımcılar bunu zaten popüler olan trendi takip etmek için yapıyorlar ve zaman geçtikçe daha popüler hale gelecek.”

Beyaz metinle tamamen yeşil olan bir ana sayfanın ekran görüntüsü ve odak noktası sayfanın sol tarafında bir tekerlek.
Mixd'in web sitesinin ekran görüntüsü

3 boyutlu

3D grafik tasarım da en iyi tasarım trendi haline geldi. Birçok grafik tasarımcı, bu vahşi, benzersiz 3D efekti oluşturmak için farklı tipografi, görüntüler ve soyut şekiller katmanlamaya başladı. Bu, canlı renklerle birleştiğinde, canlanmış gibi hissettiren ilginç bir tasarım yaratır.

Sayfanın ortasında "Reklam Öğesi Türleri" bulunan bir sayfanın ekran görüntüsü. Yazı tipinin kendisi bir halı gibi bulanık veya kabarık görünüyor
Adobe Create'ten Yaratıcı Türlerin ekran görüntüsü
Çoğunlukla mor olan bir web sitesinin ekran görüntüsü. Etrafında başka animasyon parçaları olan animasyonlu bir canavar var.
Toggl'un web sitesinin ekran görüntüsü

Ulaşılabilirlik

Erişilebilirlik, birçok web tasarımcısının son zamanlarda yaptığı bir konuşmadır, ancak bunu tasarımın her yönüne dahil etmek ve düşünmek her zamankinden daha önemli.

Calibrate Media'dan David, erişilebilirliğin web tasarımının önemli bir parçası haline geldiğini kuvvetle hissediyor. “Büyük şirketler için hızla bir standart haline geliyor. Her yaş grubundan ve geçmişinden daha fazla insan interneti günlük yaşam için kullandığından, erişim ihtiyaçlarını karşılamak önemlidir. İsrail gibi bazı ülkelerde artık yasanın bir parçası.

Erişilebilirliğe ek olarak, GDPR uyumluluğu da günümüzün dijital ortamında bir başka zorunluluktur. “Yasal nedenlerin yanı sıra, giderek daha fazla kullanıcı internette gezinirken gizlilik hakları konusunda endişeleniyor. İyi tasarlanmış ve iyi yazılmış bir çerez bildirimi uygulamak (aynı zamanda GDPR standartlarını uygulamak) web sitenizin ziyaretçilerinde bir güven ve güvenlik duygusu oluşturacaktır.”

Herkesin erişebildiği bir web sitesinin ekran görüntüsü.
Wesley Mission , kullanımı kolay bir siteye, alternatif resim metnine ve hatta sitenin ne kadar erişilebilir olduğuna dair geri bildirim gönderebileceğiniz bir erişilebilirlik sekmesine sahiptir.

Kullanıcılar için tercih ayarları

Bu gün ve çağda tercih ayarı, artık kullanıcının yazılım tercihlerine (hareketi en aza indirmek gibi!) web üzerinden erişmenin mümkün olduğu anlamına geliyor. Bir kullanıcının Mac'lerinde sistem tercihlerinde hareket istemediğini varsayalım. Bir web tasarımcısı bu ayarı alıp deneyimi tamamen ayarlayabilir. Birkaç çözüm, vurgulu bir paralaks efektini veya yakınlaştırma efektini kaldırmak olabilir. Bu şekilde müşteri, kendileri için en iyi deneyimi kontrol eder ve web tasarımcılarının tüm kullanıcılar için ellerinden gelen en iyi deneyimi oluşturmasına olanak tanır.

Bu eğilim önemlidir çünkü kullanıcıyı ilk sıraya koyan web deneyimleri oluşturmaya yardımcı olur. Flywheel Kıdemli Ürün Tasarımcısı Tyson Reeder, "Bir kullanıcı için hareket tetikleniyorsa ve bilgisayarlarını 'hareketi azaltacak' şekilde ayarladıysa, onlar için daha tercih edilebilir bir deneyim yaratmak için bundan faydalanabiliriz" diyor. Apple bu konuda harika bir iş çıkarıyor.

Apple'ın tasarımının kullanıcının Sistem Tercihlerine göre nasıl değiştiğini gösteren bir video.

Erişilebilirlik ve bunu web tasarımınıza uygulama hakkında daha fazla bilgi edinmek için burayı tıklayın.


Sürükleyici deneyimler

Sürükleyici deneyim ve grafik tasarım, birçoğunun geldiğini gördüğü başka bir trend. İnsanların bir marka, şirket veya ürünle ilgili deneyimlerine giderek daha fazla değer verdiği bir dünyada, web tasarımcılarının bu sürükleyici deneyimleri geliştirmek için artırılmış gerçeklik (AR olarak da bilinen) kullanması şaşırtıcı değil.

Kwitelle'den Christel, bir mil öteden sürükleyici grafik tasarımın geldiğini gören yaratıcılardan biriydi, "Bunu havada hissedebilirsiniz."

Web tasarımcıları tasarımlarını sürükleyici bir deneyim olarak düşünüyorlar, bu ister bir WordPress sitesi tasarlamak, ister bir marka için yeni bir animasyonlu logo oluşturmak veya bunların arasında herhangi bir şey yapmak olsun.

Örneğin Apple, daha fazla bilgi arayan veya satın almaya hazır kullanıcılar için sürükleyici deneyimler yaratarak yeni ürünleriyle bir açıklama yapıyor.

MacBook Pro açılışının ekran görüntüsü
Kaydırdıkça biraz daha açılan bir MacBook Pro'nun ekran görüntüsü
Sayfayı kaydırmaya devam ettikçe tamamen açılan bir MacBook Pro ekran görüntüsü.
Apple'ın web sitesinden alınan ekran görüntüleri

karanlık mod

Karanlık mod burada ve birçok web tasarımcısı bu trendi seviyor (ve söylemeye cüret ediyorum, biraz takıntılı). Karanlık mod, bir tasarımın ana kısmı karanlık, çoğu zaman siyah olduğunda ve metin, resimler ve diğer özellikler beyaz veya başka bir renk patlaması olduğunda gerçekleşir. Bu, doğru yapıldığında şık ve sofistike bir görünüm yaratır, ancak dengelenmesi gereken ince bir çizgidir.

Karanlık modu kullanan bir web sitesinin ekran görüntüsü. Kullanılan ana renkler arka plan için siyah, metin ve diğer öğeler için turuncu ve beyaz kullanılmıştır.
Anamol Maharjan Dribbble'dan görüntü

Andrew Cacho, karanlık mod trendini tamamen benimsedi. “Bu, büyük teknoloji donanım şirketlerinin yerel işletim sistemlerinde belirlediği trendleri takip ederken web sitelerinde alan yaratma ihtiyacı arasındaki gerilimi dengelemekle ilgili. Canlılık, kişilik sıçramaları yapmak için geri geliyor!”

Diğer tasarımcılar, mobil işletim sistemi arayüzlerinin bu eğilimi zaten benimsediği konusunda hemfikir. Proxima'dan Matt Staub, "Karanlık modun mobil işletim sistemi arayüzlerini ele geçirmesiyle, tasarlanan deneyimler de buna uyacak. Ancak modaya uygun, canlı renkler karanlığı delip geçecek.”

Spotify sayfasının karanlık modda, albüm ve sanatçı resmi renkli ve metin beyaz olan bir ekran görüntüsü.
CloudApp'ten görüntü

Canlı renk şemaları

Modaya uygun, canlı renklerden bahsetmişken, canlı renk şemalarından bahsedelim. Web tasarımcıları, tasarımlarına basit, ancak renkli ve sıcak bir his veren koyu tonlarla birlikte oldukça doygun renkler kullanarak cesur renkleri benimsiyor. Neonlar ve floresanlar gibi farklı canlı renk kombinasyonları, tasarımın gürültü arasında öne çıkmasına yardımcı oluyor.

Ana renk olarak pembe olan bir sayfanın ekran görüntüsü.
Cowboy.com'dan ekran görüntüsü
Mavi, neon pembe, elektrik mavisi, sarı, beyaz ve siyah gibi farklı canlı renklere sahip bir sayfanın ekran görüntüsü.
Meow Wolf'un web sitesinin ekran görüntüsü

izometrik çizim

Fotoğraf çekerken, bir kamerayla farklı bakış açılarının ve açıların farklı bir görünüm, his ve duygu yaratabileceğini anlamak kolaydır. İzometrik çizimler tasarlamak benzer bir kavramdır çünkü bu tasarımlar konunuza daha fazla bakış açısı sağlar. Bir tasarımcı olarak, bir tasarımın üstünü, kenarını veya herhangi bir açısını görmek için izometrik çizimler kullanabilirsiniz.

İzometrik tasarımın bir ekran görüntüsü. Tasarım, yan açıdan küçük binalardır.
Psych X86'nın web sitesinin ekran görüntüsü

İzometrik teknik aynı zamanda daha az karmaşıklık ile daha küçük ayrıntıları göstermenize olanak tanır. Bir alanı 3B olarak gösterebilme özelliği, daha önce kullanılamayan alanı açar. Süper darmadağın ve zorlanmış görünmeden eşyaları koymak için daha fazla alan var.

İzometrik tasarımın bir ekran görüntüsü. Uzak bir açıdan küçük bir şehir.
Chronicled'den ekran görüntüsü
Bir dizüstü bilgisayar, grafikler ve çizimler içeren web tasarımı işi Flywheel'in E-Kitabının ekran görüntüsü.
Web tasarımı işi raporunun ekran görüntüsü. Burayı okuyun.

Özel tipografi

Web tasarımcıları daha yenilikçi tasarımlar oluşturmak için tipografi göstermenin yeni yollarını araştırıyor. Metni dönüştürmek için farklı yaratıcı öğelerin kombinasyonu, çoğu kişinin geldiğini gördüğü bir trend.

Şirket içi grafik tasarımcımız Rese, tasarımlarına özel tipografi eklemeyi çok seviyor. "Özel bir tür oluşturmak güzel çünkü bu, tasarımınızdaki, genellikle yazı tipi kitaplığınızda bulunanlarla sınırlı olan bir şeyi kişiselleştirmenin ve yönetmenin bir yolu."

Siyah beyaz özel tipografi. Metin, benzersiz yazı tipiyle "Süper Uç" diyor.
Volan tasarımlı özel tipografi örneği

Özel tipografi, grafik tasarımdaki en eski trendlerden biri olsa da, gelişmeye devam eden bir şey. “Güzel el yapımı pencere tabelalarından Dribbble'da bulabileceğiniz hasta grafiklere gitti”.

Bazıları basit harflerle, diğerleri el yazısı, benzersiz harflerle özel tipografi örneği.
Allan Peters Dribbble'dan görüntü

Özel tipografi ile uğraşmaya başlamaya hazır mısınız? Rese harika tavsiyeler veriyor. “Benim gibiyseniz ve özel yazı tipini biraz göz korkutucu bulduysanız, pratik yapmak ve ilham almak için eski tipe gidin. Sadece pratik yapmanın ve eski senaryoya bakmanın bana çok yardımcı olduğunu buldum. Garaj satışlarına ve vintage mağazalarına gidin, fotoğraf çekin ve gördüğünüzü yeniden yaratmaya çalışın!”


Basitleştirilmiş çizimler

Basitleştirilmiş çizimler, iki kutupsal zıt tasarımın dengesidir. Genellikle farklı yaşam alanlarından bir dizi insanın, sahneyi sabitleyen renkli bir renk bloğu ile teknoloji ile etkileşime girdiği bir SVG illüstrasyonu olan genel bir yaklaşıma sahipsiniz. Öte yandan, çok daha soyut ve uygulamada yorumlayıcı olan, çok gevşek elle çizilmiş bir çizim gibi görünen bir şeye sahipsiniz.

Mailchimp'in ana sayfasının sarı arka planda basit siyah bir çizim içeren ekran görüntüsü
Mailchimp'in ana sayfasının ekran görüntüsü

Flywheel'in kendi bünyesindeki grafik tasarımcısı Bryan North, bunun bu yıl bir tasarım trendi olduğuna inanıyor: “iyi yapıldığında çok insani/çok ulaşılabilir bir duygu uyandırıyor”.

Çoğu tasarım trendinde, bir şirket, marka veya belirli bir grafik tasarımcı olup olmadığına bakılmaksızın orijinalin nereden geldiğini belirlemek zordur. Ancak Bryan, Mailchimp'in 2019'daki yeniden tasarımının bu trendde büyük bir rol oynadığına inanıyor. "Şu anda Mailchimp'in estetiğini takip eden birkaç marka var gibi görünüyor."

Daha basit siyah çizimler içeren Mailchimp'in ana sayfasının ekran görüntüsü.
Mailchimp'in ana sayfasının ekran görüntüsü

“Bu trendle ilgili sevdiğim şey, (genellikle kendilerini her şeyden önce grafik tasarımcı olarak gören) birçok insanın, aksi takdirde muhtemelen gözünü korkutacak olan illüstrasyonlarla cesaretlerini test etmesidir. Bu girişimden doğan birçok harika illüstrasyon var ve bazıları gerçekten kötü.”


Grafiklerle fotoğraf çekmek

Fotoğraf + grafik = cennette yapılan bir eşleşme.

Bu biraz abartılı olabilir, ancak hem tasarımcılar hem de fotoğrafçılar bu trendi benimsiyor ve kendi çalışmalarını sergilemek için kullanıyor. Fotoğraf çekmek ve onları animasyon ve grafikler ekleyerek yeni bir düzeye çıkarmak, Flywheel'de bile benimsediğimiz bir trend.

Flywheel'in kurum içi fotoğrafçısı Kimberly, fotoğraflarını grafiklerle yeni bir boyuta taşıma fikrine bayılıyor. “Son sonucun olabilecek en iyi olmasını sağlamak için ekibimizdeki tasarımcılarla işbirliği yapmak heyecan verici. Tasarım kullanarak görüntüyü geliştirmekle karıştırılan biraz ekstra planlama, sonuçta daha da kasıtlı bir nihai ürün anlamına gelir.”

Blogumuzdaki bir makalenin ekran görüntüsü, arkasında grafikler ve eskizlerle oturan bir Flywheeler'ı gösteriyor.
Blogumuzdaki bir makalenin ekran görüntüsü, Düzen

İster blogumuz ister raporlarımız için olsun, eklenen animasyon ve grafiklerle görüntüleri dönüştürmeyi seviyoruz. Bu tasarım göz alıcıdır ve bir noktada tasarım çalışmanıza dahil edilmelidir.

"Web tasarımcılarının %80'i çoğu projede para yatırmak istiyor" yazan bir grafik içeren bir grafik kaplama ile oturan ve yazan bir kişinin görüntüsü
Web tasarımı işi raporundan görüntü

Çözüm

Tasarım trendlerinin ne olduğunu ve bunları işinize nasıl uygulayabileceğinizi bilmek önemli olmakla birlikte, bir stil veya desenin popüler olması, probleminiz için doğru çözüm olacağı anlamına gelmediğini de unutmamak gerekir.

“Bir tasarımcının işi sorunları çözmektir. Keşfedin, keşfedin, gözlemleyin ve diğer tasarımcıların neler yaptığını öğrenin ve ardından probleminiz için en iyi çözümün gerçekte ne olduğuna karar verin. Bu kalıplardan biri olabilir veya tamamen sizin tasarım sürecinize özgü bir şey olabilir.” -Nicholas Petersen, Volan Sanat Yönetmeni

“ Asla modası geçmeyecek bir trend, özgünlüktür. Ne kadar çok yaratırsanız, sizin için neyin işe yaradığını o kadar çok bulacak ve bunda gerçekten çok iyi olacaksınız. Sonunda, yaptığınız orijinal bir şey yeni trendler belirleyecek! ”

Web tasarım raporu işi

1.000 önde gelen serbest çalışana, ajansa ve yaratıcıya web siteleri oluşturmanın, müşteri hizmetlerini yapılandırmanın ve zamanında ödeme almanın (tam!) en iyi yollarını sorduk. Oradan sayıları topladık, içgörüleri inceledik ve tahmin etmeyi bırakıp işinizi büyütmeye başlayabilmeniz için güzel bir rapor hazırladık!

Bu aydan itibaren web tasarım işinizi yepyeni bir düzeye taşıyın. Sizinki gibi diğer tasarım işletmelerinden bilgi alın ve hizmetleriniz için rekabetçi bir şekilde ücret almaya başlayın!