Web Tasarımında Asimetrik Denge
İlk fikrini kapattığımda simetrik tasarım desenleri Burada Web Tasarımcısı Deposu Asimetrik tasarım kavramını kazma niyetim yoktu.
Bununla birlikte, onu düşündüğüm kadarıyla, konuyu, simetrik tasarım kalıpları etrafında dönen fikirlerin bazılarına zıt olarak kaplamayı zorladım.
Asimetrik tasarımda ayna görüntüsü oluşturmayan elemanlar içeren tasarımlar buluyoruz. Çoğu zaman, bu asimetrik tasarımlar aslında dengelidir, ancak tam olarak aynı yarıya değil.
Pek çok içeriğin kendisini mükemmel bir simetriye ödünç vermediği düşünüldüğünde, bu tarz bir tasarım aslında gelmek için çok daha kolay.
Bu tasarım yaklaşımını işe yarayacak ve belki de kendi tasarım çalışmanızı etkileyebilecek bazı fikirler keşfedecek çeşitli siteleri düşünelim.
Asimetri kullanımına giriş
Bully Eğlence
Asimetrik tasarıma bir giriş olarak bu dramatik tasarım oldukça güzel bir başlangıç noktası sağlar. Bu tasarımın mükemmel bir simetri oluşturmak için yeniden yapılandırılmasının bir nedeni yokken, neredeyse hiç işe yaramıyordu. Büyük, zengin resimli tasarımlar, ana sayfanın metnini güzelce dengelemektedir. Boyutları son derece görünür olmasını sağlar ve tasarımın ana görsel itici gücüdür. Tek bir büyük eleman ile daha yoğun paketlenmiş alternatif arasındaki bu doğal denge çok yaygın bir yaklaşımdır.
Jorge Rigabert
Bu düzen oldukça standart bir web düzeni sunuyor. Anahtar içeriğin bulunduğu küçük bir yan sütun, site içeriği için çok daha büyük bir sütunla eşleştirildi. Bu, tasarımcılar tarafından günlük olarak kullanılan bir çift standart düzenden biridir. Bu durumda tasarım sürecinin çoğunun yarı otomatik olarak gerçekleştiğine inanıyorum. Bu durumda, içerik sütununu asimetrik olarak dengeleyen kenar çubuğunu düşünün. Kenar çubuğunun daha koyu bir rengi vardır, bu da daha hafif içerik kanalını dengelemeye yardımcı olur. Koyu arka plan olmadan kenar çubuğu muhtemelen kaybolur ve neredeyse aynı şekilde göze çarpmaz.
Metni dengelemek için resimler
Web tasarımında asimetrik bir tasarım öğesi olarak ortaya çıkan oldukça standart bir diğer yaklaşım, metinlerin resimlerle eşleştirilmesidir. Aşağıdaki örneklerde göreceğiniz gibi, her birinin büyük bir resmi vardır. Bu görüntü bir metin bloğuyla bir şekilde eşleştirilmiştir. Bu kombinasyon son derece yaygındır.
Hile oldukça açık, sadece bir şekilde birbirini tamamlayan iki tamamlayın. Bu iki unsurun genellikle gözler için bir döngü oluşturacağı düşünülürse, bir şekilde birlikte çalışmaları önemlidir. En belirgin yaklaşım, resmin tam anlamıyla resmetmek veya metnin ne hakkında konuştuğunu göstermektir. Yaygın olarak kullanılan bir diğer taktik ise, imgenin metinde sunulan fikri genişletmesidir.
Göz önünde bulundurulması gereken bazı örnekler.
Pasta Tatlı Kek
Bu tasarım kesinlikle çok dengeli, ancak bunu başarmak için çeşitli asimetrik elemanlardan faydalanıyor. Metin ile birlikte bir pastanın büyük resmine dikkat edin. Görüntü oldukça açıktır, ancak temel olarak önemlidir. Bu durumda pasta sadece bize bunun bir pasta dükkanı olduğunu değil, ne tür bir stil sunabileceğini de bildirir. Bunu, onunla ilişkili açıklayıcı metinle birleştirin ve oldukça net bir satış aşamasına sahip olun. Bu site sarılı inanılmaz lezzetli tasarım bile söz değil.
Daha fazla Soda
Bu örnek ayrıca, bir metin bloğuyla birlikte geniş bir görüntüye dayanan asimetrik tasarım öğelerini de kullanır. Bu durumda, bağlantı neredeyse açık değildir. Açık bir satış elemanı bulunmamaktadır. Bunun yerine görüntü daha dekoratif hale gelir ve site için genel bir tarz duygusu oluşturur. Benim düşünceme göre, biraz daha az işlevsel, ama sitenin ne kadar etkili olduğunu tam olarak bilmeden söylemek gerçekten zor. Böyle bir görüntünün, neyin peşinde olduklarını görmek için biraz daha fazla kazmaya başlamanızın tek bir hedefine sahip olduğu görülecektir. Bir çeşit teaser, eğer istersen.
Uyarlamalı Web Tasarımı
Muhtemelen daha önce de düşündüğünüz gibi, bu desen, mavi renk kadar yaygındır. Hemen hemen her sitenin bir noktada çalışmak için böyle bir görsel araç koymasıyla sonuçlanacağını tahmin etmeye cesaret edebilirdim. Bu ortak yer doğası, tartışmaya değer bir konu haline getirdiğini düşünüyorum. Çoğu zaman, düşünmeden üstüme ve yere yaptığım şeyleri yeniden düşünmekten en fazla ilham ve yeni fikirler buluyorum.
Bu basit site bir kitap tanıtıyor. Ve tabi ki, üzerine oturduğunuz ana unsur kitabın büyük bir görüntüsüdür. Bunu büyük metin bloğuyla birleştirin ve tüm kritik öğeleri içeren dengeli bir alana sahip olursunuz. En önemlisi, göz alıcı bir harekete geçirici mesaj ile bitti. Bu alanın sürekliliği basit ve dikkat çekicidir. Gözler kolayca akabilir ve kritik bilgileri tüketir. Kafa karıştırıcı, karmaşık veya zeki veya zor değil. Yaklaşım basit ve açıktır.
Ön plan ve arka plan öğeleri
Asimetrik tasarıma yeni bir yaklaşım, ön plandakileri asimetrik olarak dengeleyen arka plan elemanlarını kullanmaktır. Bu tür bir yaklaşım, arka planın içeriğin bir parçası olarak daha işlevsel bir rol oynadığı ve yine de sitenin zemininin bir parçası olduğu ilginç bir dinamik oluşturur. Çoğu zaman bu, derinlik yanılsamasını yaratan basit örtüşmelerle yapılır. Göz önünde bulundurulması gereken bazı örnekler.
Peter McLeavey Galerisi
Bu galerinin web siteleri, bu fikrin mükemmel bir kanıtıdır. Burada arka plan elemanı birçok role hizmet ediyor. İlk olarak, bu bölümün noktasına, ön planda geniş gri daire ile asimetrik bir denge oluşturur. Bu görsel kombinasyon, gözlerin ileri geri sıçramasına neden olan iki alan oluşturur. Bu, bence, iyi bir şey.
Soldaki öge, ana markayı ve sitenin içeriğine olan bağlantıları içerir. Arka plan öğesi, sitenin içeriğini size bildirir. Bir galeri sitesine bakıyorsunuz ve bu, siteye iniş birkaç saniye içinde bolca ortaya çıkıyor. Bu tür bilgilendirici bir öğeyi seviyorum çünkü arka plandaki tasarım ve genel stilde önemli bir rol oynayabilir. Özellikle sitenin sunduğu ürün bağlamında mükemmel şekilde yankılandığında. Böyle basit bir yaklaşım, ama çok etkili.
Aleksandar Grkinic
Bu basit benim hakkımda sayfa aynı zamanda bir arka plan öğesinin asimetrik olarak bir önalanı dengelediği bu basit fikri de içine alır. Bu durumda olsa da, arka plan tamamen açık değildir. Ve bunu gerçekten çok seviyorum. Derinlik yanılsaması tamamen oradadır ve herhangi bir örtüşme olmaksızın arka planın gerçekte ne olduğuna karar vermek gerçekten zordur. Zıplayan kişinin arka planda olmadığını iddia edebiliriz. Ne olursa olsun asimetrik denge açıktır. Ve farklı unsurların güzel kombinasyonu olmadan sayfa mevcut olmayacaktı. Tasarım, birçok yönden salt asimetrik denge kavramına dayanmaktadır. Çoğu zaman, son derece basit tasarımların bu gibi güzel kontrastlarla olağanüstü görünebileceği görünüyor.
Robert Dabi
Bu durumda, arka plan tasarımda ilginç bir rol oynar, ancak şimdiye kadar gördüğümüz asimetrik elemanları üretmez. Benim düşünceme göre, büyük görsel açıkça tasarımın ön plan öğesidir. Yine de sevdiğim şey, bu çizginin, görüntünün altındaki gölge kadar basit bir şeyle nasıl ılımlı bir şekilde bulanıklaştığıdır. Bu etkili bir şekilde arka plan ile birleştirir ve güzel bir dinamik oluşturur. Açıkçası, büyük görüntü, yanındaki kopyayla asimetrik olarak dengelenmiştir. Sitenin sayfalarına adım atın ve arkaplanın görsellerle çok ilginç şekillerde değiştiğini ve güzelleştiğini göreceksiniz. Taze, temiz ve süper pürüzsüz hissi veren çarpıcı bir tasarım. Bana bir portföy sitesi için iyi bir sunum gibi görünüyor.
On daha tasarımlar
Aşağıda, asimetrik elemanlardan yararlanan on ek tasarım sağladım. Daha önce de belirttiğim gibi, bu kategoriye çok sayıda web sitesi yerleştirebiliyordum. Bu nedenle, bu makalenin amacına uygun olarak, yaklaşımı biraz atipik ve yaratıcı şekillerde kullanmayı düşündüğüm tasarımları dikkatlice seçtim. Bu konunun ışığında her bir tasarımı düşünün ve umarım bir sonraki tasarımınıza ilham vermek için yeni fikirler kazanırsınız.
Greenluv
Andersson Wise
tahmin
13 Eşler
Raffles Kurumu
Urban Svensson
atlıkarınca
Purlize
Brewery sınırlarındaki Otobüsler
Humaan
Sonuç
Denge, tasarım sürecinin önemli bir parçasıdır ve asimetrik elemanların kullanımı eşit derecede temeldir. Ben her zaman onu yaptığım iş üzerinde bir etkisi olan yeni bir şekilde anladığımı düşündüğümden, tasarımın temellerine geri kazmayı seviyorum. Bir şeye yaklaşmanın ve kalıplarımızın kırılmasının sayısız yolu vardır, çoğu zaman işimize duyduğumuz tutkuyu yeniden canlandıran yeni ve yeni tasarımlara yol açabilir.
En sevdiğiniz asimetrik web sitesi tasarımları nelerdir? Kim asimetri ile farklı bir şey yapıyor? Yorumlarda bize bildirin!