Web Siteleri ve Mobil Uygulamalar İçin Boş Durum Sayfaları Nasıl Tasarlanır

Boş durum sayfaları, kullanıcı deneyiminde önemli bir rolü olan daha az bilinen tasarım öğeleridir. En basit haliyle, boş durumlar kullanıcı ilk önce içerik bulunmayan bir sayfayı ziyaret ettiğinde görülen sayfa düzenleri.

Bu, mobil uygulamaları, sosyal ağları veya hatta boş blog kategorilerini içerebilir. Amaç, boş bir sayfa sunmaktır. benziyor boş olmayan bir sayfa. Ziyaretçiler gerekir İçeriğin eksikliğini, yaklaşan bir içerik aracı olarak kabul eder..

Boş sayfaların nasıl çalıştığını ve neden bu kadar önemli olduklarını ele almak istiyorum. Arayüz tasarımcıları bu noktaları göz önünde bulundurmalı ve gerektiğinde bunları boş durumlara uygulamaya çalışmalıdır. Fakat başlamak için, boş bir durumun nasıl çalıştığını ve arayüze nasıl değer sağladığını inceleyelim..

Boş Durumların Değeri

Büyük bir boş devlet tasarımının güzelliği basitliktedir. Boş sayfaları açıkla sayfada ne olmalı Bir zamanlar biraz içerik var. Boş bir gelen kutusu gibi pasif olabilir veya kullanıcıyı boş bir Twitter yayını gibi aktif olarak bekliyor olabilir.

Boş sayfalar sıkıcı, sıkıcı ve hatta kafa karıştırıcıdır. Boş devletler rehberlik kullanıcıların neye baktıklarını anlamalarına yardımcı olmak için. Boş bir sayfa olmasına rağmen, ekstra içerik yardımcı oluyor.

Boş devletler de bir anlam ifade ediyor “tazelik” mevcut veriye sahip olmayan yeni hesaplarla.

Redditor Bambo_Ocha tarafından yapılan bu test, boş durum tasarımları için 20 farklı uygulamayı kontrol etti. CTA düğmeleri, örnek veriler ve hatta kısa öğretici adımlar ile çeşitli tasarım stilleri oluştu.

Bir kullanıcı tabanında gelişen uygulamalar, boş durumları tasarlamalıdır. kullanıcı aktivitesini teşvik et. Bu aktivite, içerik yayınlamak, arkadaş eklemek, fotoğraf yüklemek veya uygulamanın ne için yapılmış olduğu olabilir. Tookapic'in aşağıdaki ekranı harika bir örnek..

Ancak, boş durum sayfalarının hiçbir işlem yapılmadığında bile değeri vardır. Bu tasarımlar öncelikle bilgi vermek için yapılmıştır..

Statik bilgi kadar değerlidir ve boş bir duruma sahip olmak doğal olarak kötü değildir. Örneğin, bu sayfa tasarımı, bir izleme uygulaması kontrol panelinden geçerli bir ölçüm göstermiyor. Kullanıcı bazı ölçümler eklemek isteyebilir, ancak kısa göstergeyi boş bırakmak kötü değildir.

Benzer statik tasarımlar, boş blog arşivleri veya boş mesaj klasörleri için harika olabilir. Gösterilecek mesaj olmaması tamamen kabul edilebilir. Ancak, sayfa bağlamsız ya da tamamen boş olmamalıdır.

Hayati Sayfa Elemanları

Boş durum sayfasındaki en önemli öğe bağlam. Bu, grafik, metin veya her ikisi şeklinde gelebilir. Kullanıcılara sayfanın neden boş olduğunu ve ne tür verilerin orada olabileceğini (e-postalar, tweet'ler, arkadaş profilleri vb.) Bildirmek istersiniz..

Metin, web üzerindeki birincil iletişim aracı olsa da, grafiklerin ve simgelerin değerini göz ardı edemezsiniz..

DigitalOcean, noktalarını net olarak gösteren boş durum grafikleri olan mükemmel bir gösterge panosuna sahiptir. Şirketleri yaratıcı markalaşma ve temiz tipografi kullanıyor, bu nedenle boş durum sayfalarının çok açıklayıcı olması şaşırtıcı değil..

Boş devlet tasarımının bir diğer önemli yönü de eylemi çağır düğmesi. Bu genellikle, köprüler de iyi çalışsa da, bir düğme gibi tasarlanmıştır..

Amaç, kullanıcıların harekete geçmelerine ve boş durumlarını gidermelerine yardımcı olmaktır. Bunun, siteye veri eklemek veya işlem yapmak gerekip gerekmediğini, CTA'lar kullanıcıları boş durumu temizlemek için gereken bir sonraki adıma yönlendirir.

Dropbox iki CTA butonu ile harika bir tasarıma sahiptir. Bir Dropbox kullanıcısı klasörü yoksa, sayfaya yeni bir klasör oluşturabilir veya örnek bir klasör ekleyebilir.

Kullanıcı Etkinliğini Teşvik Etmek

Harekete geçirme düğmeleri aktif öğelerdir ancak sayfa kopyasının açıkladığını unutmayın kullanıcı ne yapıyor. Hiç kimse sadece nedenini bilmeden düğmeleri tıklıyor.

Etkinliği teşvik etmenin en iyi yolu boş durum sayfanıza harika bir kopya yazmaktır. Kullanıcıları, tüm uygulama boyunca kullanıcı faaliyetlerini teşvik eden bir içerik akışı boyunca yönlendirin.

ModSpot'un bu boş durumu, kaliteli tasarım ve teşvik edici içerik için mükemmel bir örnek..

Simgeler, kullanıcının siteye ne eklemesi gerektiğini göstermek için kullanılır. Bir düğme düğme kullanıcılarının bazı metinleri teşvik edici davranışlarıyla birlikte tıklamaları gerektiğini gösterir. Bu beklediğiniz tüm unsurları ile parlak bir boş devlet tasarım.

Benzer şekilde, Gumroad boş hali, farklı potansiyel eylemleri hedef alan iki seçenek sunar. Kullanıcılar satışa başlamak için dijital bir ürün veya fiziksel bir ürün ekleyebilir.

Sayfadaki diğer bağlantılar, rehberlere ve iletişim bilgilerinize yardımcı olacaktır. Her şey inanılmaz derecede düzenli ve birbirlerine güzel bir şekilde bağlı.

Web ve Mobil Uygulamalar

Tüm ortamlar için boş durum sayfaları benzer tasarım trendlerini takip etmelidir. Ancak, bir akıllı telefona kıyasla masaüstünde kullanıcı deneyimi ile ilgili bazı küçük farklılıklar vardır..

Daha büyük ekranlarda web siteleri daha fazla yer açmak Ekstra düğmeler için. Web sayfalarında da olabilir daha büyük gezinme elemanları bu da insanları başka yerlere siteye çekebilir.

Bu, Nusii'nin teklif sayfasında yaptığı gibi benzer bir tarzda çözülebilir. Teklif bulunmadığında, kullanıcı kendisine yönlendirilir. “teklif ekle” üst gezinme çubuğundaki düğme.

Mobil uygulamalarda benzer sorunlar olabilir ancak ekranlar çok daha küçük. Bu yapar kullanıcıları hemen eyleme çekmek için çok daha kolay.

Mobil uygulamaları daha az seçenekle daha basit tutmanın en iyi yolu olduğunu biliyorum. Hareketi teşvik etmek ve çok özel bir kullanıcı akışına işaret etmek için görselleri göz şekeri olarak kullanın.

Boş Durum Tasarım Örnekleri

Belki de boş durum tasarımını öğrenmenin en iyi yolu, bazı örnekleri incelemektir. Mükemmel web galerisi emptystat.es, boş durum sayfalarını çeşitli web sitelerinden mobil uygulamalara yönlendirir..

Boş durum tasarımını en iyi gösteren dikkatinizi hak eden bazı örnekleri elle seçtim. Başka önerileriniz varsa bize bildirmekten çekinmeyin.

DigitalOcean Yüzen IP'ler