Harika bir ilk izlenim mi yapmak istiyorsunuz? Web sitenizin başlığında başlar. Bir kullanıcının gördüğü görüntü, iyi veya kötü bir izlenim bırakacak ve söz konusu kullanıcının tıklayıp tıklamadığını veya siteyi tamamen terk edip etmeyeceğini belirleyecektir.

Tek bir görüntü için uzun bir emirdir.

Kullanıcıları çekecek ve onları tasarım etrafında hareket ettirecek bir kahraman görüntüsü oluşturmanın temel unsuru kontrasttır. (Cidden! Her şey tasarım teorisine geri döner.) Boyut, renk ve ölçek bakımından zıt unsurlara sahip bir kafa, görsel ilginin doğru bir karışımını sunar ve kullanıcılara tasarımla nasıl etkileşimde bulunacaklarını anlatır. Mükemmel bir kahraman görüntüsü oluşturmanın yolundaki karşıtlığı en üst düzeye çıkarmak için birkaç yol burada.

Stratejik Olarak Mahsul

Kahraman görüntüsünün cihazlardaki “ilk” ekranı doldurması gerekmez. O tuzağa yakalanma.

Resimdeki içeriğe göre çarpma için görüntüyü kırpın. Kullanıcılar için sayfada önemli olan diğer unsurları göz önünde bulundurun ve bunlar için de yer ayırın. Bu çerçeveye bağlı olarak, bu, kahraman görüntüsünün tarayıcı penceresinden daha büyük veya daha küçük olduğu anlamına gelebilir (sadece argüman için daha standart çözünürlükleri düşünelim).

Fikre bakmadan önce, bir anlığına düşünün.

  • Sığ bir görüntü diğer içeriğin önizlemesine yardımcı olur.
  • Alışılmadık derecede derin bir görüntü, kullanıcıları daha fazla gezinmeye teşvik edecektir.
  • Alışılmadık herhangi bir şekil dikkat çekecektir.
uyarlanabilir

Animasyonu Düşün

Kahraman başlığına hareketli görüntüler eklemek için tam bir sinematografik deneyim yaratmak zorunda değilsiniz. Hareketin en küçük dokunuşları, gözü almak için yeterli kontrast yaratır.

Bar Z Şaraphanesi için görüntüye uçan uçak gibi ince hareketler, ezici unsurları ezici olmadan sağlar. Popüler hale gelen daha gösterişli video başlıklarının bazılarına basit bir alternatif. Kontrast unsuru iki katlıdır: Tasarım, kullanıcıların maruz kaldığı diğerlerinin çoğunun ve ince hareketin keyifli ve oldukça beklenmedik olması bakımından farklıdır.

Öte yandan, bir kahraman görüntüsü için tüm animasyon veya video ile gidebilirsiniz. Hareket özellikle ilgi çekici olabilir ve popüler bir seçenektir. Tipografi ve harekete geçirici mesajlar gibi efektler eklemek söz konusu olduğunda hareketsiz görüntüyü aynı şekilde kullanın.

Bar-z

Kalın Tipografiyi Düşün

Kahraman görüntüde tipografi kullanıcı vay gerekir. Cesur, etkili ve akılda kalıcı olmalı.

Bunu hem yazı karakteri seçimi hem de ekrandaki kelimelerle oluşturabilirsiniz. (Burada “Merhaba” diyen Arial başlık yok)

Yazı stili ve mesajlaşma kombinasyonu, kullanıcı üzerinde doğrudan etkiye ve temyize sahip olmalıdır. İnsanların balıklardan daha az ilgi duyduklarını duydunuz; güzel yazı ve dil ile onları yakalamak için sizin işiniz.

Kalın yazı tipine gelince, kontrastın temel unsurları renk ve boyuttur.

  • Türün arka plandan göze çarpan bir renk olması gerekir. Okunabilirliğe gelince ışık ya da karanlıkta ışık en iyi seçeneklerdir.
  • Bold, normdan gelen bir göstergedir. Etki için kahraman üstbilgisinde fazla veya küçük boyutlu tipografi düşünün.
  • Anlam ile kelimeleri seçin. Mesajınızın anahtarı olmadıkça, başlıkta paragrafa ihtiyacınız yoktur. Kullanıcıları daha fazla bilgi edinmeye teşvik eden birkaç anahtar kelime seçin. (Sözcüklerin sayısı, büyük veya küçük harflerin ne kadar olabileceğini etkileyecektir.)
minik-dev

Dikkatle Renk Seç

Bir kahraman görüntüsü hiç bir görüntü olmayabilir. Bir renk bloğu veya serin bir doku olabilir.

Niyetini tam olarak anlatan bir renk seçin. Kalın bir renk kahraman başlığı kullanıcıları etkileyebilir, ancak yanlış renk bir kapanma olabilir.

Parlak, modaya uygun seçenekler iyi bir alternatiftir. Bu seçenek hakkında güzel olan şey, sadece arka plan rengini değiştirerek zaman zaman karıştırabilirsiniz. Büyük bir renk arka planı, marka kimliğini güçlendirmeye de yardımcı olabilir (özellikle güçlü bir renk ilişkisine sahipse) ve tasarımın basit yapısı nedeniyle kendini okunabilirliğe borçludur.

Renk, başka bir görüntü veya video ile kullanıldığında da önemli bir husustur. Renkli tipografiden renkli kullanıcı arayüzü elemanlarına, görüntüdeki renk seçeneklerinin tasarımın geri kalanıyla eşleştiğinden emin olmak önemlidir. Bunların çoğu renk teorisine ve renk tekerleğinin anlaşılmasına geri döner, böylece görüntü ve renk seçimleri tasarımda birlikte çalışır.

Ama ya kahraman imajı ve marka renkleri birbirine uymuyorsa? Birlikte kahraman imajındaki parçaların nasıl kullanılacağı hakkında yaratıcı düşünün. Fotoğrafta bir renk bindirme deneyin; görüntü veya metin için siyah beyaz düşünün. Yüksek renkli elemanları, gerçek görüntülerden uzak tutmak için beyaz veya siyah olan bir gezinme çubuğuna taşıyın. Görüntü ve zorunlu renkler iyi çalmadığında, en iyi seçenek rengi ortadan kaldırmak veya ayırmaktır.

deskpass

Işık ve Karanlık Uzayları Düşün

Bir görüntüdeki koyu ve açık alanlar için hesap yapmak, bir kahraman görüntüsünde kontrast oluşturmak için öğeler eklerken en zor görev olabilir. Özellikle yanıt veren formatlar ve kesme noktaları ile, görüntüdeki metin veya düğmelerin yerleşimi değişebilir ve her zaman mükemmel bir konum bulamazsınız.

Bir tasarımcı ne yapmalı?

  • Başka bir fotoğraf seçin;
  • Farklı tipte bir aile, boyut veya renk seçmeyi;
  • bir renk yerleşimi eklemek;
  • en iyisini yap.

Yukarıdakilerin her biri uygulanabilir bir seçenektir. En iyi seçenek projeye göre değişebilir.

Topluluk A.Ş. Kahraman görüntü kaydırıcısındaki çözüm - açık ve karanlık alanlar arasında bol miktarda varyasyon - siyah bir biçimde beyaz yazıyla bir logo kaplaması içermekti. Görüntülerden uzaklaşmaz ve bu fikri duymaktan çok daha az zorlayıcıdır. Merkezdeki logo, marka ve görsel kimlik oluşturulmasına da yardımcı oluyor.

toplum

Harekete Geçirici Bir Aramayı Dahil Et

CTA'yı unutma!

Kullanıcıların harika kahraman resmine baktıktan sonra ne yapmasını istersiniz? Anlat onlara.

Harekete geçirici mesaj, bir form doldurmak, daha fazla içerik için kaydırmak veya başka bir sayfaya bağlantı tıklatmak olsun, açık olmalıdır. Görüntü arka planına kolayca görülebilmesi için yeterli tanım ve kontrast içermelidir. (Kimse görmezse bir CTA'nın amacı nedir?)

Renk ve boyut burada özellikle önemlidir. Düğmenin rengi (ortak bir CTA istemi) görüntünün geri kalanından öne çıkmalıdır. Kullanıcılara ne yapmaları gerektiğini söyleyen kelimeler, istisnai olarak okunabilir, basit ve anlaşılır olmalıdır.

mavi-geyik

Sonuç

Kontrast, herhangi bir iyi tasarım için anahtar tekniklerden biridir. Öğeler arasında ayrım oluşturur ve kullanıcıları istenen eyleme yönlendirmeye yardımcı olur.

Bir kahraman görüntüsünü tasarlarken yeterince kontrast oluşturmak için özel dikkat gösterin, böylece kullanıcılar sayfada tam olarak hangi işlemlerin yapılacağını bilirler. Metriklerinize göz atın ve bu dönüşümler gerçekleşmiyorsa, tasarımdaki kontrast miktarını yeniden düşünün. Bunu daha da arttırmak için zaman olabilir.