Şşşt! CRAP Tasarım İlkeleri Hakkında Bu İçeriden Gelen Sırrı Paylaşmayın

CRAP tasarım ilkelerini kullanmak, etkili bir görsel tasarım yaratmanın harika bir yoludur.

“WHAAAT?!” dediniz, değil mi? Daha önce CRAP'ı hiç duymamış olsaydınız, bu kesinlikle sizin için bir sürprizdi. Bilgisayarla ilgili birçok kitap yazan harika bir Amerikalı yazar olan Robin Patricia Williams, The Non-Designer's InDesign Book adlı kitabında bir dizi grafik tasarım ilkesini tanımladı. Ona CRAP dedi.

(Ayrıca burada kendisiyle yapılan kısa bir röportajı da okuyabilirsiniz ).

Peki, CRAP nedir? Bildiğimiz değil tabii ki!

Etkili, göz alıcı tasarımlar yaratmak için tutarlı olmalıyız. Tutarlılık, her zaman ihtiyaç duyulan temel ve esasların uygulanmasıyla birlikte gelir. Bu temel bilgiler, herhangi bir tasarımcının sürekli olarak göz önünde bulundurması gereken en temel unsurlardır.

Bir grafik tasarımcı olarak işiniz, izleyiciyi web sitesinden çıkamayacak şekilde büyüleyen bir şey üretmektir. İzleyicilerin sizin sürükleyici grafik tasarımınızla koltuklarına yapışması gerekiyor ve bunun için CRAP geliyor.

CRAP, Kontrast, Tekrar, Hizalama ve Yakınlık anlamına gelen bir kısaltmadır.

1. Zıtlık

Kontrast, “bir sanat eserinde farklı unsurların (renk, ton veya duygu gibi) yan yana gelmesi” olarak tanımlanır. Kontrast, öğeleri öne çıkaran şeydir. İçeri girmeden önce, göz önünde bulundurmanız gereken bir ipucu var. Bir karşıtlık özelliğini çok fazla kullanırsanız, yalnızca karşıtlığı artırmazsınız, azaltırsınız. Niye ya? Çünkü kontrast, birkaç unsurun öne çıkmasını istediğinizde ne anlama geldiği anlamına gelir. Her şey öne çıkarsa, hiçbir şey öne çıkmaz! Boktan tasarım ilkelerinde önemli bir unsur olarak, onu nasıl kullanacağınızı iyi bilmelisiniz. Öyleyse, başlayalım!

Renk

Kontrast oluşturmak için renklerdeki farkı kullanabilirsiniz. World Wide Web Konsorsiyumu (W3C), metin ve arka planı arasında gereken minimum karşıtlık konusunda yönergeler oluşturmuştur. Metin ve arka plan söz konusu olduğunda yüksek kontrasta sahip olmak şart olsa da, farklı unsurlardan bahsettiğimizde bu doğru değil. Farklı öğeler arasında yüksek kontrast olması, kullanıcıların gözlerini yorabilir. Optimum kontrastın kullanılıp kullanılmadığını görmek için tasarımınızın gri tonlamalı versiyonuna bakabilirsiniz.

Genel bir kural olarak, göz yormayan yüksek kontrast oluşturmayan tamamlayıcı renklerin tonlarını kullanmak iyi bir uygulama olabilir.

Boyut

Öğelerin boyutlarındaki farklılıklar, özellikle metin söz konusu olduğunda, bir kontrast kaynağı olabilir. Bir öğenin boyutunu, onu çevreleyen diğerlerinden önemli ölçüde daha büyük tutmak, onu göz alıcı hale getirecektir. Harekete geçirici mesaj (CTA) düğmeleri de bu daha büyük boyuttan yararlanabilir. İzleyicileriniz onları daha fazla fark edecek ve size CRO'nuz konusunda yardımcı olacaklar. Ayrıca, CRO stratejilerinizle ilgili daha fazla yardıma ihtiyacınız varsa bu kılavuza bakın.

Şekil

Farklı şekillere sahip olmak, aradığınız kontrastı oluşturabilir. İnfografiklerde kullanılan şekillerdeki kontrastı etkili bir şekilde görebilirsiniz. Birbirine benzemeyen şekillerin yan yana kullanılması, okuyucuların zihinlerini meşgul etmeye yardımcı olabilir. Dörtgen şekillere yuvarlak köşeler eklemek veya kare elemanları yuvarlak, dairesel elemanlarla birlikte kullanmak da şekil kontrastına örnek olabilir.

Yazı tipi

Yazı tiplerini farklı gruplara ayırabiliriz. Serif, Sans-serif, komut dosyası, tek aralıklı ve görüntüleme, temel daktilo yazısı sınıflandırmalarıdır. Farklı font grupları kullanmak, anlamlandırılmasını istediğimiz metin için kontrast oluşturabilir. Ayrıca, farklı yazı tipi ağırlıkları (kalın veya normal), yazı tipi stilleri (italik, opak veya normal) ve yazı tipi süslemeleri (altı çizili, üstü çizili vb.) kullanmak oyununuzu bir sonraki seviyeye taşıyabilir.

2. Tekrarlama

İnsanlar olarak, zihinlerimiz beğeni kalıplarına programlanmıştır; Onları her yerde arıyoruz. Desenleri ne oluşturur? Tekrarlama! Ayrıca, bir şeylerin tekrarıyla karşılaştığımızda bir kimlik duygusu yaratırız. Ana temalarının tekrarlanmadığı bir müzik parçası düşünün. Kaybolmuş hissedeceksin.

Aynı şey tasarımda da oluyor. Tasarımımızı tutarlı kılmak ve ona bir tür kimlik kazandırmak için renkleri, şekilleri, dokuları, boyutları ve diğer özellikleri tekrarlamamız gerekiyor. Ayrıca şirketler, marka bilinirliği oluşturmak için tasarımda tekrarı kullanır. Farklı platformlarına ve kanallarına tutarlılık getirmek için önceden tanımlanmış bir dizi renk ve yazı tipini tekrarlarlar.

Tasarımda tekrar, tasarımın dört CRAP ilkesindeki bir diğer önemli ilkedir. Kullanıcının kendini güvende hissetmesi gerekir, kaybolması değil. Web sitenizin UX'ini optimize etmeye yardımcı olur.

3. hizalama

CRAP tasarım ilkelerinde bir diğer önemli faktör olan hizalama, tasarımdaki bir elemanın konumunu belirler. Bir tasarıma uyum ve düzen duygusu veren şeydir. Öğeler açısından, bunları kenarlarına veya merkezlerine göre hizalayabilirsiniz. Bununla birlikte, metinler sola, sağa, ortaya hizalanabilir veya basitçe iki yana yaslanabilir. Kullanılan metin diline bağlı olarak, LTR veya RTL olmak üzere sol ve sağ hizalamalar en popüler olanlardır. Kısa metin aralıkları için merkez hizalamayı kullanabiliriz (ancak daha uzun metinlerde okunması zordur). Yaslama, satır uzunluğu uzun, yazı tipi boyutu küçük ve kelimeler daha kısa olduğunda iyi bir seçimdir (uzun kelimelerden oluşan dar satırlarda kullanmak okunabilirliği azaltır).

Her tasarım, yatay hizalama kılavuzları olarak işlev gören bazı dikey çizgilere sahip olmalıdır. Sayfanın her yerinde yüzen metin, yalnızca görüntüleyeninizin kafasını karıştırır. İzleyicileriniz, sayfanın her bölümünün birbiriyle olan ilişkisini kolayca anlayabilmelidir.

4. yakınlık

Son olarak, yakınlık, CRAP tasarımında hayati bir rol oynayan başka bir ilkedir. Tasarımda yakınlık, birbiriyle ilişkili ve birbiriyle yakından ilişkili öğeleri yerleştirmemiz gerektiğini belirtir. Mantıklı, değil mi? Gezinti çubuğunda okuduğunuz makale ile ilgili bir bağlantı aramak istemezsiniz, değil mi? Ayrıca, öğeleri sayfa boyunca eşit aralıklarla yerleştirmek tasarımın takip edilmesini zorlaştırır. İzleyicinizin istenen bilgiyi bulmasını kolaylaştırmak için ilgili öğeleri mümkün olduğunca gruplandırın.

3 İkinci Kural

"Aşık olmak sadece 3 saniye sürer."

Bu nedenle, CRAP tasarımınızın kusursuz olup olmadığını görmek için gidebileceğiniz son test, 3 saniye içinde etkili olup olmadığını kontrol etmektir. Bunu, zihninizi temizleyerek ve uzağa bakarak, sonra ona geri dönerek kendiniz yapabilirsiniz. Ayrıca 3 saniye sonra bir arkadaşınıza veya bir akrabanıza görüşlerini sorabilirsiniz. Bir şeyin bizi cezbetip çekmediğine ve devam etmek isteyip istemediğimize sadece 3 saniye içinde karar veriyoruz.

İlişki

Bu ilkeleri ayrı ayrı kullanmamalıyız. Tekrarlama ve hizalama, kontrast oluşturmak için bir metin parçasının şeklini veya konumunu değiştirmenize olanak tanıyan "normal" durumu sağlamak için birlikte çalışır. Ayrıca, tekrar ve yakınlık, madde işaretli listeler gibi etkili formatlar üretmek için birlikte çalışır - madde işaretinin tekrarı, noktaların yakınlığına vurgu yapar.

Çözüm

Oscar Wilde, en ünlü kitabı Dorian Gray'in Portresi'nin önsözünde, "Sanatçı güzel şeylerin yaratıcısıdır. Sanatı ortaya çıkarmak ve sanatçıyı gizlemek sanatın amacıdır.”

Son olarak, amaç, bir belge oluşturmak için harcadığınız çabanın kaybolması, görünmez olması, okuyucunuzun veya izleyicinizin iletmeye çalıştığınız fikirlere sınırsız bir şekilde erişmesine izin vermektir - hem doğrudan metninizde hem de her zaman çok ince bir şekilde, aracılığıyla. tasarım bileşenleri seçiminiz. Bu bağlamda, çok az insan tasarım kalitesine dikkat çekeceğinden (hatta fark edeceğinden) nankör bir iştir - ancak onlar mesajı fark edip ona göre hareket edeceklerdir. Bütün mesele bu değil mi?