Her Tasarımcının Bilmesi Gereken 20 Tasarım Öğesi ve İlkesi

Yayınlanan: 2023-02-19

Tasarımın çok kontrollü olduğu bir zaman vardı. Fazla desenli. Fazla güvenli.

Ancak evrim kaçınılmazdır ve tasarımcılar biraz daha deney yapmaya başladılar.

Oradan tasarımlar daha cesur ve daha iyi hale geldi. Tasarımcılar, izleyicilerinin davranışlarının ardındaki bilimi daha derine inmeye başladılar ve bu da onların pazarın taleplerine göre esnek olmalarını sağladı.

[twitter_link]Bugün tasarım, kalıplardan ve trendlerden daha fazlası haline geldi. Bu bir yaşam tarzı haline geldi.[/twitter_link] Her insan tepkisine ve rutinine dikkatlice işlenmiş bir şey. Ve bu yaşam tarzının getirdiği inceliklerin altında, bu dünyayı daha yaratıcı ve yaşanılası güzel bir yer haline getiren 20 farklı tasarım ilkesi yatıyor.

Bu ilkelere ve bunları tasarımlarınızda kullanmak için ipuçlarına bir göz atalım.

çizgiler

Mavi gökyüzü olan bir köprünün tepesi.

Etrafınızdaki herhangi bir yere bakın ve çizgileri göreceksiniz. Bilgisayar ekranınızın kenarları. Klavyenizdeki her tuşun kenarları. O tuşların üzerindeki harfler bile çizgilerden oluşuyor, bazıları düz, bazıları eğri, bazıları eğimli.

Çizgiler tam olarak bu kadar önemli. Onlar olmasaydı, her şey birbiriyle sonsuza kadar karışır ve dünyayı tek bir leke haline getirirdi.

Çizgileri daha da şaşırtıcı kılan şey, her şeyin biçimini tanımlamalarının yanı sıra, eşdeğer tepkiler uyandıran duygu ve fikirlere de dönüşmeleridir. Örneğin düz bir dikey çizginin yanına dalgalı bir çizgi koyun ve bir tarafta düzen ve gücü, diğer tarafta kaos ve karışıklığı düşünmeye başlayacaksınız. Kitlenizi belirli harekete geçirici mesajlara yanıt vermeye teşvik ediyorsanız bu çok yararlı olabilir. Ruh halleri ve duyguları belirlendiği anda, harekete geçirici mesajınızda gezinmek daha kolaydır.

Çizgilerin web tasarımında oynadığı bir diğer rol de, izleyicinin gözlerini her sayfanın odak noktalarına yönlendirmesidir. Örneğin, diğer küçük metinlerden oluşan bir denizde marka adı altında güçlü yönlendirme çizgileri, bu adın öne çıkmasına yardımcı olacaktır.

Ölçek

Cüzdan, saat, pruva saati ve kulaklık gibi öğelerden oluşan bir koleksiyon.

Ölçek, tek bir tasarımda farklı öğeleri nasıl boyutlandıracağınızı tanımlar. Temelde mantığı bir parçaya getirir ya da ortadan kaldırır. Örneğin, bir köpeğin hemen yanına bir karınca çizecek olsaydınız, köpeği karıncadan çok daha büyük yapmanız mantıklı olurdu (tasarım, gerçeklikten uzaklaşmanızı gerektirmediği sürece).

Ölçek aynı zamanda drama yaratmanın en iyi yoludur. Yukarıda ima edildiği gibi, gerçekçilikten uzaklaşmanız ve bazı öğeleri diğerlerinden önemli ölçüde daha küçük veya daha büyük boyutlandırarak çarpıcı efektler yaratmanız gereken durumlar olacaktır.

Ölçeklendirme ayrıca hiyerarşiyi vurgulamanın harika bir yoludur. Örneğin film afişlerini ele alalım. Önemli rollere sahip aktörlerin resimleri, yardımcı oyunculardan daha uzun veya daha büyük oldukları için değil, karakterleri daha önemli olduğu için genellikle diğerlerinin üzerinde durur.

Şimdi, çok fazla resim içeren ve çok fazla metin içeren bir şey üzerinde çalıştığınızı varsayalım. Ölçeklendirme, bazı ayrıntıları diğerlerine göre vurgulamanın en iyi yolu olmaya devam ediyor. Örneğin istatistikler, izleyicilerin gözlerini doğrudan o veri parçasına çekmek için önemli ölçüde ölçeklendirilebilir.

Renk

renkli iplik

Rengin her şey üzerinde bu kadar etkili olması inanılmaz. Rengin yalnızca kişinin ruh hali ve duyguları üzerindeki değil, aynı zamanda tepkileri ve satın alma kararları üzerindeki etkileri hakkında çalışma üstüne çalışma yapılmıştır.

Markası için siyah ve beyazdan başka bir şey kullanmayan bir çevreci şirket görmeyi hayal edebiliyor musunuz? Veya parlak neon renkleri kullanarak profesyonel bir hava ve geleneksel değerler yaymak isteyen bir işletme mi? Bence bu, rengin tasarımda nasıl bir rol oynadığını gösteren yeterli bir açıklamadır.

Tutarlılık

Tuval üzerine suluboya kullanan bir kişi.

Coca-Cola'yı düşündüğünüzde, renkleri yeşil mi yoksa mavi mi hayal ediyorsunuz? Muhtemelen hayır - zihniniz otomatik olarak kırmızı renge atlar.

Tutarlılık bununla ilgili.

Bir marka için tasarım yapmak tamamen tutarlılıkla ilgilidir. Tamamen aynı rengin aynı tonlarını, tonlarını ve renk tonlarını ve aynı yazı tiplerini kullanmakla ilgilidir. Ofis raporları, reklam panoları, banner reklamlar – markayla ilişkili her şey her zaman tutarlı olmalıdır. Ne de olsa, Coca-Cola renk düzenini her yıl değiştirseydi, sizce şu anda sahip olduğu aynı marka hatırlanmasını sağlar mıydı? Bence değil.

Beyaz boşluk

Kartvizit yığınları
Frame Inc. Kartvizitler

Beyaz boşluk mutlaka beyaz olduğu anlamına gelmez, ancak hangi renk olursa olsun her zaman aynı şeyi ifade eder. Öğeleriniz arasındaki kullanılmayan boşluk, birçok tasarımcının çıldırdığı o negatif alan.

Bazılarına göre, kullanılmayan tüm alan büyük bir israf gibi görünüyor. Ancak stratejik olarak boş bırakarak bu alanı kendi avantajınıza kullanana kadar bekleyin. Kitlenizin aklını başından alacak yepyeni bir yaratıcılık düzeyi açabilirsiniz.

Bana inanmıyor musun? MC Escher'in Sky and Water'ına bakın, tam olarak ne demek istediğimi anlayacaksınız.

Simetri

Yıldızlı bir yama
Garrett Godsey'den Ares Yaması

Gözlerinizin doğal olarak simetrik olan her şeye çekildiğini biliyor muydunuz? Bu, Target ve Chanel gibi markaların logolarını inanılmaz derecede akılda kalıcı hale getirerek yararlandıkları konsepttir.

Simetri, herhangi bir tasarıma denge ve düzen duygusu getiren bir şeydir. Bazen o kadar bariz olmayabilir, ancak her büyük sanat eseri için göze hoş gelen simetri oluşturmanın benzersiz bir yolu vardır.

opaklık

Sıvı ve çilek ile berrak bir bardak

Bir tasarım öğesinin opaklığı, onun ne kadar 'içini görebildiğini' gösterir. Her şeyin ne kadar şeffaf olduğunu belirler. Daha düşük opaklığa sahip olan her şey temelde daha hafifken, daha yüksek opaklığa sahip öğeler göze daha katı gelir.

Opaklık, alttakilerin varlığını tamamen ortadan kaldırmadan farklı öğeleri birbiri üzerine yerleştirmenize yardımcı olabilir. Ayrıca bir görüntüye hareket hissi vermek için de kullanılır.

Doku

mavi ve beyaz bez

Doku olmadan herhangi bir tasarım boş ve sade görünebilir. Biraz doku ekleyin ve tasarım canlanarak ekrandan veya üzerine basıldığı yüzeyden fırlamaya hazır gibi görünmesini sağlayın.

Bu, her tasarım parçasının doku gerektirdiği anlamına gelmez. Temiz ve keskin olduklarında daha iyi görünen tasarım projeleri her zaman olacaktır. Bununla birlikte, biraz dokunun zarar vermeyeceği durumlar da olacaktır.

Yüzeye derinlik katan bir arka plan ekleyerek tasarımınızın dokusunu canlandırabilirsiniz. Bazı öğeleri kabartmayı da deneyebilirsiniz.

Denge

Izgara kağıdına kalem çizimleri
Eddie Lobanovskiy tarafından dokunun

Denge bazen simetri ile karıştırılabilir, ancak aslında ikisi farklı şeylerdir. İşler simetrik olduğunda, her öğe aynı kenar boşluğunda bitebilir veya bir sayfanın her iki tarafında aynı sayıda öğe olabilir. Bu genellikle bir denge hissi ile sonuçlansa da simetrik bir tasarım kullanmadan da bu hissi yakalayabilirsiniz.

Örneğin, biraz metin ve bir resim içeren bir hakkında sayfası tasarlamak istediğinizi varsayalım. Metin görselin aynısı olmasa da iki sütunlu düzende bir denge duygusu bulabilirsiniz.

Denge, bir tasarımın eksiksiz görünmesini sağlayan bir şeydir. Bir görüntü dengesiz olduğunda, yarı pişmiş veya daha da kötüsü ilhamsız görünebilir.

hiyerarşi

Biri kırmızı onay işareti ve biri kırmızı x olan iki sütun.
Melanie Taube tarafından Hiyerarşi

Hiyerarşi, hangi öğelerin diğer her şeyden daha önemli olduğunu gösterir. Bu, hiyerarşinin sonundaki öğelerin (deyim yerindeyse alt besleyiciler) onsuz yapabileceğiniz şeyler olduğu anlamına gelmez. Sonuçta, hiyerarşinin diğer ucundaki unsurlar olmadan, hedeflediğiniz etki miktarını elde edemezsiniz.

Hiyerarşi, ölçekleme dışında pek çok farklı şekilde ifade edilebilir. Besin zincirinin tepesindekiler için daha parlak renkler kullanabilirsiniz, aşağı doğru inildikçe renk daha açık hale gelir.

Zıtlık

Bir gün batımına karşı palmiye ağacı

Kontrast, karşıtların kuralıdır. Temel olarak ışığı karanlıktan, büyükten küçüğe ayırır. Her zaman tasarımlarından bir veya iki öğe çıkarmayı hedefleyen tasarımcılar için kontrast genellikle kullandıkları yaklaşımlardan biridir.

Ancak kontrast, sadece estetikten çok daha derine iner. Kontrast okunabilirliği de etkiler. Metin ve arka plan için hemen hemen aynı olan iki renk kullanın ve muhtemelen metnin ne dediğini okumaya çalışırken gözlerinizi çizeceksiniz. Yüksek kontrastlı iki renk kullanarak gözleriniz görmesi gerekeni hemen görecektir.

çerçeveleme

Bir kamera çizimi
En iyi kamera yanınızdakidir Sean McCabe

Bir çerçevenin içine koyduğunuz resimlerin çevresine nasıl sınır koyduğunu gördünüz mü? Çerçeveleme tam olarak bunun için var. Temel olarak size resmin bir parçası olması ve olmaması gerekenleri gösterir.

Kutu ana hatları, kenar boşlukları - bunların hepsi çerçeveleme biçimleridir. Ayrıca, metinle dolu bir sayfanın ortasındaki tek bir alıntı gibi belirli öğeleri diğerlerine göre vurgulamanıza olanak tanır.

Ayrıca yaratıcı olabilir ve çerçeveniz için normal çizgiler ve kenar boşlukları dışında başka şeyler de kullanabilirsiniz. Örneğin, plaj temalı bir poster, metni etkili bir şekilde çerçevelemek için metnin etrafına dizilmiş kabukları kullanabilir.

Kafes

Boş bir defterde açık kalem

Bir şeyleri boş bir alanda hizalamaya çalışmak zor olabilir, bu nedenle ızgaralar tasarımda çok önemlidir.

Izgaralar, tasarımcıların öğeleri hizalamasına ve düzenlemesine yardımcı olur. Bunun mükemmel bir örneği, bir dergi sayfasındaki veya bir gazetedeki köşe yazılarıdır. Tüm bu metnin bir kılavuzun rehberliği olmadan rastgele yerleştirildiğini hayal edebiliyor musunuz? Anlam vermeye çalışmak bir felaket olurdu.

Öte yandan, biraz daha az katı bir tasarıma gidiyorsanız, ızgarayı kırmak anında bir kaos duygusu yaratmanın harika bir yoludur. Gözlerimiz doğal olarak bir tasarımın düzenini ve ızgarasını arama eğilimindedir, bu nedenle bu yapıdan çıkmak bir düzensizlik duygusu yaratmaya yardımcı olacaktır.

kendiliğindenlik

Ellerinde boya olan kişi

Tabi tabi. Dengeye ihtiyacımız var. Simetriye ihtiyacımız var. Izgarayı takip edin. Çerçevelemek için çizgiler kullanın. Ancak tüm bunlar, her şeyin kılavuza göre yapılması gerektiği anlamına gelmez. Bazen harika bir tasarım yaratmak için biraz çılgınlık da gerekir.

Sütunlar ve satırlar arasında zaten net bir ayrımın olması, mevcut çerçeveleri takip etmeden aniden ortaya bir alıntı yapamayacağınız anlamına gelmez. Bu çizginin öne çıkmasının en iyi yolu buysa, öyle olsun.

Tasarlarken, "kurallarınıza" ara verin ve beklenmedik bir şey olan biraz kendiliğindenliğe yer bulun. Bu tam da tasarımınızın ihtiyaç duyduğu şey olabilir.

Yön

Lastiklerin etrafında daireler olan bisiklet çizimi.
Allan Peters'tan Spiral Artcrank Tasarımı

Buna görsel veya grafik ipuçları da denilebilir. Harekete geçirici mesaj düğmenizi işaret eden birinin resmini yerleştirin ve hemen hemen her okuyucunun gözleri hemen o düğmeye gidecektir.

Elbette gözler de bir sayfaya bakarken belirli kalıpları takip eder. Araştırmalar, örneğin, gözlerin izlediği en yaygın kalıpların E, F veya Z şekli olduğunu gösteriyor. Bu nedenle, en önemli içeriği sayfanın sol üst köşesine yerleştirmek en iyisidir, çünkü gözlerin doğal içgüdüsü önce sol üst köşeden sağ üst köşeye hareket etmek olacaktır.

Tüzük

Evet, yaratıcılık genellikle spontane olsa da, uymanız gereken pek çok tasarım kuralı vardır. Ama yine de, bu kuralları sık sık çiğnemek, sizi şaşırtıcı derecede güzel parçalar yaratmaya da iter.

Peki, kurallara ne zaman uyulacağını ve ne zaman çiğneneceğini nasıl anlarsınız?

İlk olarak, tam olarak neyi kırdığınızı bilmeniz için temel bilgiler konusunda bilgili olmalısınız. Ardından, kuralları çiğnemenin, varmaya çalıştığınız noktaya karşılık geldiğinden emin olun.

Hareket

Bisikletli adam hızlı gidiyor

Basılı tasarımda hareket yaratmak için sihre ihtiyacınız yok. Bir görüntünün hareket ettiği izlenimini vermenizi sağlayacak, kullanabileceğiniz pek çok efekt vardır.

Örneğin, bisiklete binen bir çocuğun görüntüsünde, yanından geçtiği her şeyin yanından hızla geçtiğini göstermek için etrafındaki görüntünün geri kalanını bulanıklaştırabilirsiniz. Dalga efektlerinin yanı sıra hareket çizgilerini de kullanabilirsiniz. Yukarıda Vladimir Mirzoyan tarafından tasarlanan bu logoda olduğu gibi, optik hareket yanılsaması vermek için opaklığı da kullanabilirsiniz.

Derinlik

Yerden bir ağacın tepesine bakmak

Elbette, düz tasarımlar son birkaç yıldır çok revaçta. Yine de bazı tasarımlarınıza derinlik katmanın daha iyi uyduğunu kabul etmelisiniz. Sonuçta, fiziksel olarak iki boyutlu bir şeyin aslında bir sayfadan fırlıyormuş gibi görünmesi ne kadar şaşırtıcı?

Tasarımlarınızda derinlik yaratmak için kullanabileceğiniz çeşitli teknikler vardır, örneğin:

  • gölgeler
  • örtüşen
  • Perspektifle oynama (3B efektiyle sonuçlanır)

Tasarımınız biraz can alabilir gibi görünüyorsa, bu yaklaşımlardan herhangi birini deneyin ve yüzeyinden yükselmeden önce görüntüyü görün.

tipografi

Kağıt üzerine kaligrafi

Tasarımınızın tüm görüntülerine, dokularına, arka planlarına ve diğer öğelerine sahip olabilirsiniz, ancak tipografiniz biraz çalışma gerektiriyorsa, tüm tasarımınız tehlikeye girer. Tipografi, yazı tipi stilleri ve yazı tipi boyutlarından daha fazlasıdır. Ayrıca ölçeklendirme, boşluk bırakma, renk ve diğer birçok temel tasarım konseptiyle de ilgisi vardır.

Tipografi pek çok alanı kapsadığından, tipografinizi nasıl daha iyi hale getireceğinize dair bu kitapları okursanız muhtemelen daha aydınlanmış olursunuz.

Kompozisyon

"Yüzüm suyun üstünde" yazan bir illüstrasyon
Dalgalar, Romain Rdb

Kompozisyon, tek başına duran bir unsur olmak yerine, aslında daha önce tartıştığımız bazı unsurların bir kombinasyonudur. Ölçek, hiyerarşi, derinlik - tüm bunlar ve çok daha fazlası, bir tasarımın genel kompozisyonuna katkıda bulunur.

Kompozisyon, en temel anlamıyla, tasarımınızın her bir öğesinin genel düzenlemesini kapsar. Tartıştığımız tüm unsurları hayal edin - birlikte karıştırıldığında sonuç işe yarıyor mu, yaramıyor mu? Kompozisyonu böyle ölçersiniz.

20 farklı öğe, bir tasarımı yapmanın veya bozmanın 20 farklı yolu. Çalışırken her zaman yanınızda bu öğelerin bir listesini bulundurun ve bir sonraki tasarım projenizi tamamlamanın getirdiği zorlukların üstesinden gelmeye çalışırken bu listenin rehberiniz olmasına izin verin.