Arayüz tasarımında kompozisyon, bir kullanıcı arayüzündeki metin, görsel ve diğer öğelerin sayfa üzerinde düzenlenme biçimini ifade eder. Kompozisyon iyi yapıldığında, tasarım hem estetik olarak hoş görünür hem de işlevsel olarak etkili olur. Tasarımcılar bu kavramı bazen düzen, yerleşim veya tasarım yapısı olarak da adlandırır.

Tasarımcılar, kompozisyonu geliştirirken temel tasarım prensiplerini uygular. Bunlar arasında zıtlık, denge, beyaz alan (boşluk), hiyerarşi, tekrarlama ve ritim gibi unsurlar yer alır. Bu ilkeler doğru şekilde kullanıldığında, kullanıcı deneyimi daha dengeli, anlaşılır ve görsel olarak uyumlu hale gelir.

Arayüz tasarımında kompozisyonun amacı, kullanıcı yolculuğunu yönlendirmektir. Tasarımı oluştururken, kullanıcıların hangi öğeleri ilk fark etmesini istediğinizi ve hangilerinin daha az dikkat çekmesi gerektiğini düşünün. Bu dengeyi kurmak için ölçek ve görsel hiyerarşi en önemli araçlarınızdır.

Öğeleri, kullanıcıyı en kritik noktalara — örneğin bir CTA (eylem çağrısı) düğmesine — doğal biçimde yönlendirecek şekilde konumlandırın. Böylece kullanıcı, tasarımı sezgisel olarak takip eder ve hedeflenen eyleme kolayca ulaşır.

Tasarım formatları

Tasarım formatları, içeriğin farklı ortamlarda nasıl sunulacağını ve organize edileceğini belirleyen önemli bir unsurdur. Basılı materyallerden dijital arayüzlere kadar, her format bilgi akışını ve kullanıcı deneyimini farklı şekilde etkiler. Bu nedenle, tasarımcıların farklı formatların özelliklerini anlaması; içeriği en etkili, ilgi çekici ve erişilebilir biçimde sunmalarına yardımcı olur.

Her formatın kendine özgü avantajlarını ve sınırlamalarını anlayarak, tasarım projeniz için en uygun formatı seçebilirsiniz. Ayrıca, her formatta içeriği nasıl yapılandıracağınızı, okunabilirlik, görsel etki ve kullanıcı etkileşimi gibi unsurları en üst düzeye çıkarmanın yöntemlerini de öğrenebilirsiniz.

Biçim

Bir tasarımın biçimi, onun genel görünümünü ve kompozisyonunu tanımlar — yani tasarımın yerleşeceği mekânsal sınırları belirler. Biçimi, bir sanatçının tuvali gibi düşünebilirsiniz.

Kullanıcı deneyimi (UX) tasarımcıları genellikle biçimi, tasarımın yapılacağı cihaza göre belirler: telefon, tablet, masaüstü bilgisayar, televizyon vb. Cihazın yönü değiştiğinde (örneğin dikeyden yataya geçildiğinde), tasarımın alanı ve yerleşim kuralları da buna bağlı olarak değişir.

Grafik tasarımcılar için format çok daha çeşitlidir; proje türüne göre şekil alır. Bu bir ambalaj tasarımı, reklam afişi, banner, kitap kapağı veya illüstrasyon olabilir. Her format, tasarımcının ifade biçimini, öğelerin yerleşimini ve izleyiciyle kurduğu iletişimi farklı şekilde etkiler.

1.Dikdörtgen format

Dikdörtgen format, tasarım dünyasında aynı zamanda “quadro” olarak da bilinir. Quadro kelimesi İtalyanca’da “resim” veya “tablo” anlamına gelir.

Bu format, web ve mobil ürün tasarımlarında en yaygın kullanılan biçimdir. Oluşturulması, çerçevelenmesi ve sergilenmesi kolay olduğu için hem dijital hem de basılı ortamlarda tercih edilir. Ayrıca, televizyonlar, telefonlar ve bilgisayar ekranları gibi birçok insan yapımı nesne de dikdörtgen formdadır.

Tarih boyunca insanlar kendilerini ifade ederken dikdörtgen yüzeyleri kullanmıştır — kağıt, tuval veya duvar gibi. Bu nedenle dikdörtgen format, hem alışılmış bir görsel düzen sunar hem de izleyicinin gözünü doğal bir şekilde yönlendirerek estetik ve işlevsel dengeyi korur.

2.Manzara formatı (Yatay format)

Bir dikdörtgenin genişliği yüksekliğinden fazlaysa, buna yatay format denir. İnsan gözleri yatay düzlemde hizalı olduğundan ve dünyayı yatay bir perspektiften algıladığımızdan, bu format bize doğal ve rahat gelir. Ayrıca, televizyonlar, bilgisayar monitörleri ve sinema ekranları gibi birçok cihazın uzun yıllardır yatay biçimde tasarlanması, bu formata alışmamızı sağlamıştır.

Çoğu dijital ürün tasarımı, özellikle masaüstü ve dizüstü bilgisayarlar için geliştirilen arayüzler, yatay formatı varsayılan başlangıç noktası olarak kullanır.
Buna karşılık, mobil cihazlarda yatay format genellikle ikinci plandadır. Çünkü kullanıcılar, içerikle etkileşim kurarken telefonlarını çevirmek istemezler. Bu nedenle mobil tasarımlarda dikey format (portre modu), kullanım kolaylığı ve alışkanlık açısından daha yaygındır.

3.Portre formatı (Dikey format)

Bir dikdörtgenin yüksekliği genişliğinden büyükse, bu biçime portre formatı denir. Bu format, gözün doğal hareketini yukarıdan aşağıya doğru yönlendirir ve dikey bir kompozisyon hissi yaratır. Portre formatı genellikle dergiler, posterler, broşürler gibi basılı materyallerde ve mobil cihazlarda kullanılır.

İnsanlar, içerik izlerken bile telefonlarını çoğunlukla dikey konumda tutarlar. Hatta yatay formatta daha iyi görüntülenecek içeriklerde (örneğin geniş ekran videolarda) bile telefonlarını çevirmek istemeyebilirler. Bu nedenle, mobil tasarımlar oluştururken bu kullanıcı alışkanlığını dikkate almak oldukça önemlidir.

Profesyonel İpucu:
Bir tasarımda yön, konunun algılanış biçimini doğrudan etkiler. Dikey unsurları vurgulamak veya uzunluk hissi yaratmak istiyorsanız, portre formatını tercih edin.

4.Kare formatı

Tahmin edileceği gibi, kare format, eşit yükseklik ve genişliğe sahiptir. Karenin dört simetri ekseni bulunur: dikey, yatay ve iki köşegen. Bu nedenle, izleyicinin bakışı eksenler boyunca değil, genellikle dairesel bir şekilde hareket eder. Kompozisyonun merkezindeki nesne, her yönden eşit alanla çevrelendiği için kare format dengeli ve simetrik bir görünüm sunar.

💡 İpucu:
Bir tasarımda merkezdeki unsura dikkat çekmek istiyorsanız, kare format mükemmel bir tercihtir. Bu format, odak noktasını doğal olarak merkeze taşır ve güçlü bir görsel denge sağlar.

5.Daire formatı

Daire, bütünlüğün evrensel bir simgesidir. Sonsuz sayıda simetri eksenine sahip olması, uyum ve denge duygusu yaratır. Bu dairesel format, tasarımın merkezindeki unsuru çevresinden ayırarak kendi içinde bütün bir kompozisyon oluşturur.

Daire biçimi, izleyicinin dikkatini merkeze çeker ve odak noktasını doğal olarak vurgular. Aynı zamanda, sınırlarının yumuşak ve kesintisiz olması nedeniyle, izleyicide sakinlik ve istikrar hissi uyandırır. Bu nedenle dairesel kompozisyonlar; logolar, ikonlar, profil fotoğrafları ve vurgu gerektiren grafik öğeler için idealdir.

6.Oval formatı

Sanatçılar, portre oluştururken uzun süredir oval formatı tercih ediyor. Bunun nedeni oldukça basittir: Oval biçim, insan yüzünün ve büstün hatlarını doğal biçimde tamamlar ve yumuşak bir çerçeve sunar.

Benzer şekilde, web tasarımcıları da oval formatı sıkça kullanır. Özellikle düğmeler, ikonlar veya dekoratif öğelerde, oval şekiller gözü eliptik bir yol boyunca yönlendirerek daha akıcı ve zarif bir kompozisyon oluşturur. Bu format, hem estetik hem de dikkat çekici bir görsel denge sağlar.

7.Yatay eleman

Masaüstü ekranlarda yatay formatların en yaygın biçim olması nedeniyle, yatay öğelerin kullanıcı arayüzlerinde baskın olması şaşırtıcı değildir. Yatay düzen, geniş ekran alanından en verimli şekilde yararlanmayı sağlar ve gözün doğal hareket yönüne uyum gösterir.

Bu nedenle görseller, logolar ve navigasyon çubukları genellikle yatay olarak düzenlenir; bu biçim, arayüzün dengesini ve okunabilirliğini artırır. Ayrıca bazı öğeler — örneğin metin giriş alanları veya arama çubukları — işlevsel olarak da yatay biçimde tasarlanmak zorundadır. Böylece kullanıcılar, içerikle daha doğal ve akıcı bir şekilde etkileşim kurabilirler.

8.Dikey eleman

Dikey öğeler, kullanıcı arayüzü tasarımında alanı verimli kullanmanın harika bir yoludur. Özellikle mobil tasarımlarda yaygın olarak tercih edilirler; bunun nedeni hem dikey ekran oranlarının daha uygun olması hem de kullanıcıların telefonlarını genellikle dikey modda kullanmayı tercih etmesidir.

Ayrıca dikey düzenler, kaydırma davranışına da daha uygundur. Kullanıcılar için yukarı ve aşağı kaydırmak, sola veya sağa kaydırmaktan çok daha doğal ve sezgisel bir harekettir. Bu nedenle, dikey öğeler yalnızca alan tasarrufu sağlamakla kalmaz, aynı zamanda daha akıcı ve kullanıcı dostu bir etkileşim sunar.

9.Yatay Düzen

Masaüstü ekranlar uzun yıllardır yatay düzenlerden faydalanmaktadır. Ancak akıllı telefonların ekran boyutları ve işlevselliği arttıkça, yatay düzen mobil cihazlar için de giderek daha önemli hale gelmiştir.

Bazı kullanıcılar, ne yaparlarsa yapsınlar telefonlarını dikey modda kullanmayı tercih etse de, birçok kullanıcı belirli görevlerde — örneğin video izleme, oyun oynama veya tablo görüntüleme gibi durumlarda — cihazlarını yatay moda çevirir.

Bu nedenle, tasarım yaparken mobil cihazlar için yatay düzenin nasıl görüneceğini düşünmek önemlidir. Arayüzü bu moda uygun şekilde optimize etmek, kullanıcıların deneyimini iyileştirir ve onlara daha geniş, rahat ve etkileşimli bir görünüm sunar.

10.Dikey düzen

Akıllı telefonlar için varsayılan yönlendirmedir ve çoğu insanın telefonlarını tutuş şeklidir. Bu nedenle birçok uygulama bu yönlendirmeye sadık kalır.

Dikey düzenler kullanabileceğiniz yatay alan miktarı sınırlıysa neredeyse sınırsız bir dikey derinlik alanı sunar. Ancak her kullanıcının sonsuza kadar kaydırmayacağını unutmayın.