Bir ekran ikiye bölünür.

Bölünmüş ekran tekniği, film endüstrisinde uzun zamandır bilinmektedir ve 20. yüzyılın başlarındaki sessiz film günlerine kadar uzanan eski örneklerle günümüzde hala film ve televizyonda popüler bir cihazdır.

001

Tam ekran öğeleri iki veya daha fazla dikey bölüme ayrıldığında bölünmüş ekran düzeni kullanılır. “Dünyaya Scott Pilgrim” filminden bir sahne

Ancak, bu web tasarım endüstrisi için nispeten yeni bir tekniktir. Bölünmüş ekranlar sadece 2016 ortalarında popüler oldu ve şimdi bu tasarım modelini kullanan daha fazla web sitemiz var. Bu tasarım modelinin bu kadar popüler olmasının birkaç nedeni var:

  • Güzel bir estetik kaliteye sahiptir. Doğru bir şekilde yürütüldüğünde, kullanıcılara harika bir görüntüleme deneyimi sunabilir.
  • Duyarlı çerçeveler için iyi bir seçim. Bölünmüş ekran tasarımı, küçük ekranlar da dahil olmak üzere çeşitli ekranlar için uyarlanabilir. Mobil ekranlar gibi daha küçük ekranlar söz konusu olduğunda, paneller istiflenebilir.
  • Navigasyonu yönlendirmeye yardımcı olur. Basit tasarım tekniklerini kullanarak, kullanıcının dikkatini ekranın belirli bir bölümüne çekebilir veya tıklamaya teşvik edebilirsiniz.

Bölünmüş Ekran En İyi Çalıştığında

İki ekranı tanıtmak için bölünmüş ekran özellikle iyidir. Örneğin, bir site iki tamamen ters varyasyon sunuyorsa. Bu yaklaşım, tasarımcıların her iki şeye de önem vermesini ve kullanıcının aralarında hızlı bir şekilde seçim yapmasına izin vermesini sağlar.

002

Bir ekran, Dropbox Kılavuzlarında iki mesaj

Bölünmüş Ekranı Önlemek gerektiğinde

Bölünmüş ekran tasarımları içerik büyüdükçe genişlememektedir, bu nedenle bunları içerik ağırlıklı düzenlere uygulamanız önerilmez. Ekranları basit tutmak önemlidir, çünkü karmaşık bölünmüş ekranlar, UI'nin aşırı yüklü bilgiyi oluşturmasını sağlar. Bu nedenle, bölünmüş ekran düzeni, minimalist web sitesi tasarımları için mükemmel bir uyum olacaktır.

Bölünmüş Ekranın Sizin İçin İyi Olması Nasıl Karar Verilir?

Web siteniz için bölünmüş bir ekran tekniği düşünüyorsanız, kendinize bir kaç soru sormanızı öneriyorum:

  • İçeriğiniz için uygun mu?
  • Düzeni çalışmak için yeterli negatif alan olacak mı?
  • Kullanıcılarınız düzeni değerlendirecek mi, yoksa kafasını karıştıracak mı?
  • Kullanıcılarınızın dikkatini ikiye bölmek için tamam mı?

İçeriğin kral ve bölünmüş ekran olduğunu akılda tutmanız gereken en önemli şey, mesajınızı insanlara iletmenin basit bir yolu olmalıdır.

Bölünmüş Ekranlar İçin Tasarım Teknikleri

1. Çift Canlı Renk ve Dramatik Tipografi

Düz ve Materyal Tasarımı sayesinde, canlı renkler ve dramatik tipografi şu anda büyük trendlerdir. Canlı renkler görsel olarak uyarıcıdır ve dramatik tipografi metin içeriğini geliştirir. Sadece ikisini birleştirin ve görsel olarak ilginç bir tasarım yaratabilirsiniz. Baesman bunu ustaca yaptı. Her iki öğeye de aynı derecede önem verirken, aynı zamanda kullanıcının aralarında hızla seçim yapmasına izin veriyorlardı.

003

Parlak renkler ve ilginç tipografi çiftleri ilgi ekleyebilir

2. CTA Düğmesine Kullanıcı Dikkatini Çizin

Basit bir grafik trendinden çok daha fazlası, ekranı iki ayrı bölüme ayırmak, kullanıcıyı sitenizde yönlendirmek için orijinal bir yol sağlar. Harekete geçirici mesajlar için daha büyük bir odak noktası oluşturmak istediğinizde mükemmel bir seçenektir. Aşağıdaki örnekte, negatif alanın, iki farklı seçeneğe eşit ağırlık vermek için dikey bir ayrım oluşturduğunu görebilirsiniz.

004

Dikey bölme, iki farklı CTA’ya,

3. “Ekranlar” Arasındaki Görsel Akışı Oluşturun

Bölünmüş ekran tek bir nesneyi temsil ettiğinde, içerik kapları arasında bir bağlantı kurmak önemlidir. Bunu yapmanın bir yolu, bir renk kullanmaktır. İki ekran arasında görsel akış oluşturmak için ayrı bir renk kopyalayın. Bu, çok fazla kontrasta sahip bir marka rengi veya rengi ile özellikle iyi çalışır. Renk kullanmak, iki içerik arasında daha güçlü bir bağlantı kurmak mümkün.

Güçlü bir bağlantı oluşturmanın bir diğer olası yolu, ekranlar arasında metin kopyalama gibi tek bir öğeyi katmanlaştırmaktır:

005

Çakışan metin iki ekrana bağlanır

Son olarak, bu amaç için renkli bir kaplama kullanabilirsiniz:

006

Ekranın sol bölümünü düşünün

4. Harekete Geçmek İçin Kullanıcıları Teşvik Etmek İçin Animasyon Kullanın

İnce animasyon ve etkileşimli efektler kullanıcıları tıklamaya teşvik eder. “İçin kullanılan tasarıma bakın” Çehov yaşıyor Aşağıdaki site. Tasarım karakterinizi bulmak için tıklamanız için yalvarır.

007

Sonuç

Bir ziyaretçinin web sitenizle ilgili bir karar vermesi yaklaşık üç saniye sürer. Sonuç olarak, hemen çıkma oranlarını azaltmak istiyorsanız, düzenlerinizin her zaman ziyaretçi dostu olması gerekir. Bölünmüş ekran tekniği size bu konuda yardımcı olabilir. Bölünmüş ekran tasarımları, ilgi çekici bir tasarım oluşturmak için eğlenceli, işlevsel ve duyarlı bir yoldur.