Arayüz tasarımında boşluk nasıl kullanılır?
Basit örneklerle açıklama…

Wojciech Zieliński’nin (Okunuşu: Voyç’eh Jelinski) yazdığı dört bölümden oluşan yazı dizisinin ikincisini de Türkçeleştirmeye karar verdim. Gerçekten arayüz tasarımcıları için güzel bir kaynak hazırlamış. İlkini çevirip diğerlerini görmezden gelmek olmazdı. Yakın zamanda üçüncü ve dördüncü yazıların çevirisini de paylaşacağım. Umuyorum ki bu yazı da size ilham verecektir…
Thank you Wojciech for providing us valuable information about UI design.
Boşluk, hayatın vazgeçilmez bir parçasıdır. Notaları, aralarında boşluk olmadan dinlediğinizi hayal edin. Bu tam anlamıyla bir gürültü olurdu. İşte aynı şey fotoğraf, resim, heykel ve mimari eserler için de geçerli. Elbette tasarımcılar da bunu kullanıyor; boşluğu!
İnsanlığın boşluğa ihtiyacı var. — Ken Hiebert
Boşluğun tasarımınıza katacağı şeyler:
- Vurgu
- Hiyerarşi
- Okunabilirlik
- Planlanmış yapı
- Heyecan ve gerilim :)
Bir tasarım düzeni oluştururken nesnelerin nefes almasını sağlamanız gerekir. Bunu yapabilmek için ilişkili nesneler arasındaki boşluğu fazla açmadan beyaz alanlar (boşluklar) yaratmanız gerekiyor. Böylece kullanıcılarınız için odak noktaları oluşturur ve gözlerini nesneler arasında dolaşmaya yönlendirmiş olursunuz.
Herkes bir şeylere ‘bakar’, ancak çok az insan etkili bir şekilde ‘görür’. — Greg Berryman
Bir tasarımcı olarak sizin görmeniz gerekiyor. Bu yetenek, görsel dile hakim olmanızı sağlayacaktır.
Boşluk
Görsel tasarımlarda göz ardı edilen en önemli unsurlardan biri boşluktur. Eğer acemiyseniz, boşluğun her bir pikselini doldurmaya çalışıyorsunuzdur. Daha tecrübeli tasarımcılar size daha fazla boş alan bırakmanızı önerir. Kullanıcı açısından baktığımızda ise çok az insanın beyaz boşlukların fazlalığından şikayet ettiğini görürüz. Çünkü boşluğun olmaması görsel bir gürültüye sebep olur.
Şu örneğe bir bakalım:


Bu iki örnekte içerik tamamen aynı ve ikisinde de dikey yerleştirme yapılmış. Fakat aynı nesnelerin yalnızca konumlandırma farkıyla ortaya çıkardığı boşluğun; görsel hiyerarşi, zıtlık ve bakış açısını nasıl değiştirdiğine dikkat edin. Grafik tasarımında bunlar çok önemli şeylerdir. İçeriğin okunmasını ve taranmasını kolaylaştırır.
Küçük boşluk (microspace)
Küçük beyaz boşluk, birbirleriyle ilişkili olan nesnelerin ya da harfler, kelimeler, ikonlar gibi diğer küçük nesnelerin arasındaki boşluğu tanımlamak için kullanılan bir terimdir. Küçük nesneler arasındaki boşluk miktarını ayarlamak, onların daha dikkat çekici ve organize olmalarına yardımcı olurken görsel bir uyum hissi yaratır.

Büyük boşluk (macrospace)
Diğer yandan büyük beyaz boşluk, beyaz alanın daha büyük bölümlerine verilen isimdir. Bunlar sütun, paragraf, fotoğraf gibi arayüzün ana nesneleri arasındaki negatif boşluklardır.
Gözün, odak noktaları arasında kolayca dolaşmasını sağlar.

Görsellik
Kaliteyle yüksek derecede bağlantılı olan boşluğun, estetik yanı da vardır. Alışverişe çıktığınızı düşünün. Lüks markaları, perakende mağazalarla karşılaştırdığınızda çok daha fazla boş alana sahip olduklarını göreceksiniz.

Tasarım, görsel planın içeriğindeki benzerlik ve farklılıkları bulup ortaya çıkardığımız bir süreçtir.
Boşluğu daha fazla kavramla ilişkilendirebiliriz:
- Kapsamlılık
- Basitlik
- Lükslük
- Rahatlık
- Nadirlik
- Netlik
Artık Dribbble’de neden bu kadar çok moda atışının olduğunu biliyorsunuz (sadece şakaydı).
Biraz da müşterilerden bahsedelim
Şimdilik boşluğun önemli olduğunu muhtemelen biliyorsun. Gerçek dünyada boşluk, tasarımcılar ve müşteriler arasında sorunlara neden olabilir. Ne yazık ki birçok müşteri ve yönetici, boşlukları kayıp alan olarak görüyor. Bu alanların daha fazla içerik sunmak veya aynı anda daha fazla bilgi göstermek için kullanılabileceğini düşünüyorlar.
Buradaki en önemli şey o müşterinizden nefret etmemeyi öğrenmektir. İyi tasarımcı ile gerçekten iyi olanı ayıran tek şey, alçak gönüllülüktür. Egonuzu bir kenara bırakın ve müşterinin neden bu şekilde düşündüğünü anlamaya çalışın.
Genellikle müşteriler tüm bu bilgileri bilmez, bu noktada müşteriyi veya proje yöneticinizi eğitmek sizin işinizin bir parçasıdır. Bir toplantı düzenleyin ve düşünce sürecinizi kişiselleştirmeden açıklayın.
Eğer toplantı sonunda müşteriyi ikna edemediyseniz tasarımınızın karmaşık olan sürümüyle sizin önerdiğiniz sürümü bir A/B testine tabi tutmayı ikna edin. Tonlarca kullanıcı testi yaptım ve insanlar gerçekten de metin ve butonların oluşturduğu bir duvar gibi görünen ekranlardan hoşlanmıyor.
Boşluk hava gibidir ve tasarımın nefes alması gerekir.
4 bölümden oluşan bu yazı dizisinin diğer bölümlerini aşağıdaki bağlantılara tıklayarak okuyabilirsiniz:

