İçindekiler
Görsel tasarımın temellerini öğrenmek için eksiksiz bir rehber.
Milyon dolarlık soru: İyi tasarımın sırrı nedir?
Bu konuda felsefe yapabiliriz, ancak genel olarak konuşursak, iyi tasarımın meşhur 'sırrı' görsel öğelerinizi tuvalinizle ve birbirleriyle ilişkili olarak düzenleme şeklinizde yatar. Temel olarak, az önce düzen tasarımını tanımladık. Düşündüğünüzde, baktığınız her yerdir.
Örneğin bir derginin düzenini ele alalım. Tasarımları klasik bir ızgara sistemini izler (ızgaralar hakkında her şeyi bir dakika içinde öğreneceğiz). Her şey genellikle sola, sağa ve alta hizalanır. Özellikle sütunlar, sayfayı yalnızca görsel olarak çekici değil, aynı zamanda okunması kolay ve otoriter kılan belirgin bir hizalamaya sahiptir. Büyük başlıklar izleyicinin dikkatini çekerdikkat çekerken, alt başlık görsel bir bilgi hiyerarşisi oluşturmak için boyutta bir kontrast olarak gelir.
Linda Gaom, Behance
Tüm bu nitelikler sayfa tasarımını temiz, yapılandırılmış ve okunması kolay hale getirir ve bir sonraki bölümde bahsedeceğimiz ipuçlarıyla uyumludur. Ancak önce, mizanpaj tasarımının kendisi hakkında daha fazla bilgi edinelim.
Yerleşim Planı Tasarımı Nedir?
Mizanpaj tasarımı, okuyucunun dikkatini çekmek ve belirli bir mesajı görsel olarak çekici bir şekilde iletmek için grafik öğelerin düzenlenmesiyle ilgilidir.Yani burada logo tasarımından değil, gazete, dergi, poster gibi basılı materyallerin ve bunların dijital muadillerinin tasarımından ve web, uygulama veya UX/UI tasarımından bahsediyoruz.
'Düzen' kelimesi bize pek çok ipucu verir. Bir sayfada önceden belirlenmiş öğelerin düzenlenmesi anlamına gelir.
Bir düzen etkili olduğunda iyi görünür ve izleyicinin tasarımın iletmeye çalıştığı mesajı anlamasına rehberlik eder. Bu nedenle düzeni anlamak, ilgi çekici, etkili, kullanıcı dostu ve hoş kompozisyonlar oluşturmanın anahtarıdır.
Bir mizanpaj mesajını izleyiciye iyi iletmiyorsa, başka bir deyişle "iyi okunmuyorsa", tasarım ne kadar modaya uygun görünürse görünsün etkisiz olacaktır. Mizanpaj tasarımı alanında içerik, trendlerin ve hilelerin önüne geçer.
Yerleşim Tasarımının Amacı
Bir mesajı hızlı iletmek için
Düzen tasarımı, maksimum etkililik ve etki için göz hareketinin düzgün bir akışını sağlamak üzere grafik varlıklar arasındaki ilişkiyi kurar.
Denge oluşturmak için
Düzen tasarımı ilkelerini kullanmak, tasarım projelerinizde sıkıcı olmadan denge ve simetri duygusu yaratmanın en basit yoludur.
Ayrıca bakınız: MAPPA'nın Hikayesi: Efsanevi Japon Animasyon StüdyosuBütünlük oluşturmak için
Düzen, tasarımınızın birçok unsurunu kolayca sindirilebilir, uyumlu ve mantıklı bir şekilde düzenlemenize yardımcı olur.
Güzellik yaratmak için
Denge ve yapı doğal olarak güzellik yaratır. Düzen tasarımınız doğru yapılırsa, izleyici için otomatik olarak görsel olarak çekici hale gelecektir. İzleyicilerin bir mesajı anlamak için ne kadar az çaba harcaması gerekirse, tasarımınız o kadar çekici görünecektir.
Frank Philippin'in "Eskiden Tasarım Öğrencisiydim: O Zaman - Şimdi" adlı kitabı için yaptığı tasarım. Kaynak: DesignBoom
Düzen Tasarımının Unsurları
Metin
Bu sadece metin gövdesini veya paragrafları değil, aynı zamanda başlıkları, alt başlıkları, üstbilgileri ve altbilgileri de içerir. Tipografi, renk ve boyut seçiminiz, düzeninizin hedef kitlenize nasıl aktarılacağı konusunda farklı etkiler yaratacaktır.
Resim
En yaygın görsel türleri fotoğraflar, illüstrasyonlar veya infografiklerdir.
Şekiller
Şekiller çok köşeli olan geometrik olabilir veya doğal dünyayı taklit eden organik olabilirler. Ayrıca soyut da olabilirler. Soyut şekiller geçtiğimiz yıl çok moda oldu, çünkü web tasarımcılarının bunları karmaşık ve geniş kompozisyonlara dahil ettiklerini gördük.
Şekiller bir görüntünün yerini alabilir veya bir sayfaya grafik öğeler eklemek, metni vurgulamak veya diğer görsel öğeler arasındaki boşluğu belirlemek için kullanılabilir.
Beyaz alan
Her düzen tasarımında, öğelerinizin nefes almasını ve kendi başlarına öne çıkmasını sağlayacak belirli bir miktar beyaz alan olacaktır.
Yerleşim Planı Tasarımının Altın İlkeleri
Mizanpaj tasarımı ilkelerinin, tasarımın temel ilkelerinin çoğunu takip ettiğini fark edeceksiniz. Renkleri belirli bir şekilde kullanmak, tipografi, tekrarlama, kontrast, hiyerarşi ve denge gibi.
Prensip #1. Izgaraları Kullanın
Izgaralar, tasarımcıların metin ve görseller gibi çeşitli tasarım öğelerini tutarlı ve takip etmesi kolay görünecek şekilde konumlandırmasına yardımcı olur.
Bir düzen duygusu sağlarlar, öğelerin birbirini bastırmasını önlerler ve en önemlisi, ızgaralar hizalamanızı da düzeltir. Çalışmanızı daha temiz ve daha profesyonel hissettirir.
Kaynak: hgmlegal.com
Izgaraların anatomisi
Sadece dikey ve yatay çizgiler olduğunu düşünebilirsiniz, ancak bir ızgara birkaç parçadan oluşur. Aslında birçok parçadan. İşte temel bir ızgarada bilmeniz gereken en önemli terminoloji:
- Biçim Yani basılı bir şey tasarlıyorsanız format sayfadır ve bir web tasarımcısıysanız format web sayfası veya tarayıcı penceresidir.
- Kenar Boşlukları format ve tasarım arasındaki kasıtlı boş alanlardır.
- Akış Hatları düzeninizi paralel bölümlere ayıran yatay çizgilerdir. Akış çizgileri tasarımınızın okunabilirliğine yardımcı olur ve okuyucuyu içeriği doğru şekilde takip etmesi için yönlendirir.
- Modüller herhangi bir ızgaranın yatay çizgileri ve dikey akış çizgileri tarafından oluşturulan bloklardır. Eğer düşünürseniz, bunlar herhangi bir ızgaranın yapı taşlarıdır. Tüm dikey modülleriniz sütunlarınızı oluştururken, tüm yatay ızgaralarınız satırlarınızı oluşturur.
- Bölgeler dikey ya da yatay olarak birbirine bağlı modül gruplarıdır. Bunları nasıl düzenleyeceğinize dair herhangi bir kural yoktur.
Kaynak: Radversity
Izgara türleri
Düzen ızgaraları ilk olarak kağıt üzerinde el yazısını düzenlemek için kullanılmıştır.
Fransız sanatçı Villard De'nin kenar boşluklu basılı sayfa düzenleri üretmek için ızgara sistemini altın oranla birleştirdiği 13. yüzyılın başlarına kadar uzanırlar. Basılı kitap ve dergi düzenlerinin çoğunun kanıtladığı gibi, bu ızgara sistemini bugün de görebilirsiniz. Yayıncılar, editörler ve tasarımcılar standart ızgaraları yalnızca iyi göründükleri için değil, aynı zamanda okuyucularbelirli tasarım öğelerinin belirli bir yerde olmasını bekler.
Ayrıca bakınız: Vectornator'da Hatalar Nasıl BildirilirIzgaralar iki şekilde tasarlanabilir: simetrik veya asimetrik. Simetrik ızgaralar dikey ve yatay bölgelerin birbirine eşit olduğu ve sütunların aynı genişliğe sahip olduğu bir merkez çizgisini takip eder.
Bir asimetrik ızgara adından da anlaşılacağı gibi, kenar boşlukları ve sütunların hepsi aynı değildir.
Bu sınıflandırmaya göre, dünya çapında kullanılan ve güvenebileceğiniz beş ana düzen ızgarası türü vardır:
El yazması ızgaraları Belgeler için en yaygın ızgara türüdür. Üstbilgi, altbilgi ve kenar boşluklarını ayırırlar ve temel olarak metninize sınırlar sağlayan formatın (veya sayfanın) içinde bir dikdörtgen oluştururlar. Dergiler, gazeteler ve kitaplar için temel oluştururlar. Bu yüzden muhtemelen en aşina olduğunuz düzen budur.
Kaynak: UXplanet
Kaynak: Radversity
Sütun ızgaraları Tipik bir dergi düzeni, metni okunması kolay bölümlere ayırmak için sütun ızgaralarını kullanır. Ancak web siteleri için de çok popülerdirler. İki ila altı ızgaradan herhangi birini kullanabilirsiniz. Daha fazlası mümkündür, ancak yaygın değildir. Sütun ızgaraları ile ilgili çok önemli bir şey, sütunlar veya oluklar arasındaki boşluğun her birinden eşit mesafede olmasıdır.Diğer.
Örneğin gazeteler tarafından simetrik sütun ızgaraları kullanılırken, web tasarımında asimetrik sütun ızgaraları tercih edilir.
Kaynak: UX Planet
Kaynak: Radversity
Modüler ızgaralar sütun ızgarasına benzer, ancak yatay akış çizgilerini de hesaba katarlar. Bu tür bir ızgara, düzeninizdeki çeşitli öğeleri düzenlemeniz gerektiğinde ve sütun ızgaraları yeterli olmadığında gereklidir.
Modüler ızgaralar eşit boyutta modüllere sahiptir, bu da mekansal bölgelerinizi farklı şekillerde görselleştirmeyi çok kolaylaştırır.
Kaynak: UX Planet
Kaynak: Radversity
Temel ızgaralar Taban çizgisi, yazarken metnin durduğu çizgidir ve satır başı, iki taban çizgisi arasındaki boşluktur. Başlığınızın veya alt başlıklarınızın ne kadar büyük olması gerektiğini mi merak ediyorsunuz?
Taban çizgisi ızgaraları, metninize akıcı bir ritim kazandırmaya yardımcı olmak için burada.
Kaynak: UX Planet
Kaynak: Fragaria
Hiyerarşik ızgaralar Bununla birlikte, tasarım öğelerini önem sırasına göre düzenlerken çok kullanışlıdırlar. Hiyerarşik ızgaralar modüler ızgaralara dayanabilir veya kendi ızgaranızı bile oluşturabilirsiniz. Web siteleri bu ızgarayı çok kullanır, özellikle dijital dergiler ve gazeteler, sütun ızgaralarından ziyade hiyerarşik ızgaralara daha fazla güvenme eğilimindedir.Dijital.
Kaynak: UX Plane
İlke #2. Negatif Alan Kullanın
Genellikle boşluğun, sessizliğin ya da renksizliğin kötü bir şey olduğunu düşünürüz. Ancak bunların zıtlığın nasıl sağlam bir temeli olduğunu düşünmeyiz.
Beyaz boşluk olarak da adlandırılan negatif boşluk, tasarımınızda herhangi bir gerçek öğe bulunmayan alandır. Boş bırakılan alandır. Sadece varlıklarınızı çevrelemekle kalmaz, aynı zamanda aralarında gerekli bağları da oluşturur. Bu nedenle, negatif boşluk haklı bir tasarım öğesidir ve düzen tasarımınızın ne kadar etkili olduğu üzerinde büyük bir etkiye sahiptir.
İyi ve kötü negatif alan
Negatif alan, tasarımınızdaki çeşitli alanları ayırmanıza yardımcı olurken düzeninizin nefes almasını sağlar. Görsel hiyerarşi ve görsel dengeye yardımcı olur; kullanıcının ana unsurlara odaklanmasını sağlar; dikkat dağınıklığını azaltır ve son olarak tasarımınıza stil ve zarafet katar.
Deneyimsiz tasarımcılar, metni ölçeklendirerek veya bir logoyu ya da görüntüyü şişirerek tuvallerini mümkün olduğunca doldurma eğiliminde olabilirler. Ancak öğelerinize yer açmak, izleyicinin belirli bilgi ipuçlarını daha hızlı ve daha rahat bir şekilde algılamasını sağlar.
Her şey izleyicinizin dikkatini çekmek için bağırırsa, hiçbir şey duyulmaz.- Aaron Walter, 'Duygu için Tasarım'
Negatif alanınızı belirlemenin kolay bir yolu modüler bir ızgara kullanmaktır. Bunu tasarımınızın üzerine yerleştirerek hangi modüllerin boş kalabileceğini ve hangilerinin doldurulması gerektiğini kolayca görselleştirebilirsiniz.
Tasarımcı: Brunswicker, Kaynak: Codesignmag.com
Prensip #3. Tek Bir Odak Noktası Seçin
Hiç bir müşteriniz sizden logoyu büyütmenizi istedi mi? Ve sonra başlığı daha da büyütmenizi?
Her şeyi vurgulayamazsınız. Bu, iyi tasarımın amacını ortadan kaldırır. Tıpkı zaman gibi, odak da görecelidir. Bir öğenin öne çıkması için diğerinin arka plan görevi görmesi gerekir. Tasarımınızın görsel bir hiyerarşi sergilemesi için bazı öğelerin diğerlerine baskın olması gerekir.
Bir tasarımdaki odak noktası, görsel ağırlığı en fazla olan unsurdur. Düzeninizdeki diğer her şeyden çok, gözü ilk çeken unsurdur.Bir odak noktası, izleyicilerinize tasarımınızdaki görüntüleme yolculuklarının nerede başladığını duyuracaktır. Yani anlattığınız hikayenin başlangıcıdır.
Bu genellikle büyük bir görsel veya büyük bir tipografi kaynağı kullanılarak sağlanabilir. Aşağıdaki odak noktasının ne kadar etkili olduğuna dikkat edin
Bloomberg Businessweek için Braulio Amado tarafından tasarlanmıştır, Kaynak: Bu güzel
Ancak bir odak noktası izleyicilerinizin dikkatini çekerken, bir sonraki kural ona rehberlik etmeye yardımcı olacaktır.
İlke #4. Yakınlığı ve Akışı Düşünün
Yakınlık ilkesi basittir: Birbiriyle ilişkili unsurların birlikte yerleştirildiğinden emin olun.
Yakınlık, görsel varlıkların birbirine bağlı olduğunu ve düzeninizi organize etmeye yardımcı olan tek bir görsel birim haline geldiğini gösterir.Bu nedenle, yalnızca birbiriyle ilişkisi olan tasarım varlıklarını kümeleyin ve hedef kitlenizi tüketmeleri gereken ilgili içerik parçasına yönlendirmek için tasarımınızdaki bilgi ceplerini kullanın. Buna akış ilkesi de denir.
Kaynak: Satori Graphics
İyi akışa sahip bir tasarım, izleyicinin gözünü düzen boyunca bir öğeden diğerine kolaylıkla yönlendirecektir. Odak noktalarınız gözü çekecek ve dinlenme yeri haline gelecek, diğer öğeler ise yön verecektir.
Bunu anlamanın basit bir yolu, web sitemizi örnek almaktır. Grafikler metinden net bir şekilde ayrılmıştır ve harekete geçirici mesajlar da öyle, böylece izleyicinin dikkati bir bilgi kümesinden diğerine geçmektedir.
Prensip #5. Kontrast Kullanın
Tasarımınızda yeterli kontrast olduğundan emin olun.
Kontrast, tasarımınızı düzenlemeye yardımcı olur ve çok ihtiyaç duyulan bir hiyerarşi oluşturarak neyin önemli olduğuna vurgu yapar.Bunun da ötesinde, kontrastın iyi kullanımı tasarımınıza görsel ilgi de katar. Kabul edelim, her şeyin aynı boyutta, şekilde veya renkte olduğu bir düzen sıkıcı görünecektir. Kontrast her şeyi renklendirir.
İlk aklınıza gelen sıcak ve soğuk, koyu ve açık, mavi ve turuncu gibi renk kontrastları olabilir. Ancak renk son derece önemli bir kontrast ilkesi olsa da, yazı, hizalama ve boyut kontrastları da vardır. Ve unutmayın, kontrast da görecelidir. Yalnızca diğer unsurlarla yan yana geldiğinde bir anlam taşır.
İşte bu kuralı akıllıca ve güzel bir şekilde kullanan bazı düzen örnekleri. Tipografi, renk ve hatta öğeler arasındaki boyut kontrastına dikkat edin.
Kaynak: IAG Uzlaşma Eylem Planı
Prensip #6. Tekrar, Kalıp, Ritim
Tekrarı düşündüğümüzde, aynı unsuru tekrar tekrar düşünürüz.
Ancak tasarımda durum farklıdır. Kesinlikle o kadar sıkıcı değildir. Doğru kullanıldığında, tekrar aslında tasarımınızı güçlendirebilir.
Çeşitli alanların birbirine bağlı ve aynı kompozisyonun bir parçası olduğunu hissettirmek için düzeniniz boyunca bir motif belirlemeye ve yeniden kullanmaya çalışın. Bu, tasarımınızın bir temaya sahip olmasına yardımcı olacaktır. Öğeleri tekrarlayarak, yalnızca hedef kitlenizin beklentilerine göre sunum yapmakla kalmaz, aynı zamanda kullanıcı deneyimini de geliştirirsiniz. Tutarlı olmak, kullanıcıların kendilerini daha rahat hissetmelerini sağlar.
Bunu şekilleri veya sembolleri tekrarlayarak yapabilirsiniz. Hatta bir renk şeması, bir yazı karakteri ve genel olarak aynı stil.
Geniş bir aileye sahip bir yazı karakteri kullanmak iyi bir alışkanlıktır. Farklı desen, çizgi ağırlığı/tarzı ve renk sayısını sınırlayın ve baştan sona tekrarlayın. Ayrıca, resim ve grafiklerin stilini aynı tutmaya çalışın. Örneğin, aynı sanatçının illüstrasyonlarını kullanın.
Kaynak: Thepentool.co
İşte tasarımınızı düzenlemenize ve daha temiz, daha profesyonel ve dengeli bir düzen elde etmenize yardımcı olacak altı ilke.
Ancak yolculuğunuz burada bitmiyor. Grafik tasarım kesin bir bilim değildir ve ipuçları ve ilkelerle sınırlandırılmamalıdır. Yaratıcılığın her alanında olduğu gibi, kesin bir kural yoktur. Bu ipuçlarından ince yollarla ayrılmak, tasarımlarınıza derinlik ve çeşitlilik katacaktır.
Yine de, bunlar harika bir başlangıç noktasıdır ve bunları denemenizi öneririz. Ve nasıl çalıştıklarını bize bildirin!
Başlamak için Vectornator'ı indirin
Tasarımlarınızı bir üst seviyeye taşıyın.
Dosyayı indirin
