Tasarım en genel tanımıyla görsel unsurların
düzenlenmesi, bir araya getirilmesidir.

Arayüz tasarımı, görsel tasarımın genel ilke ve
elemanlarından faydalanarak, yeni medya platformlarının
etkileşim temelli ortamı için çözüm üretme amacı
taşımaktadır.

• Denge
• Vurgu
• Ritim:
• Hiyerarşi
• Bütünlük

Denge tasarımdaki tüm elemanların eşit bir
şekilde dağıtılmasıdır. Simetrik ve asimetrik olarak ikiye
ayrılır.

Temel olarak simetrik ve asimetrik olmak üzere
iki tür denge bulunmaktadır. Simetrik dengede daha statik
ya da durağan bir tasarım sumak için elemanlar
kompozisyonun iki yanında eşit olarak düzenlenir ve bir
ayna efekti sağlanır. Asimetrik dengede ise bunun tam
tersi uygulanır. Elemanlar tasarımın merkezi baz alınarak
yerleştirilmez ve görsel ağırlık merkezi değiştirilerek
dinamik ve farklı bir hareket sağlanmış olur.

Vurgu tasarımda hangi alanların öncelikli
olacağının kontrol edilmesidir.

• Dikkat çekilmek istenen elemanı diğer
bileşenlerden ayırmak etkili bir yöntemdir.
• İlgili unsuru kompozisyon içerisinde spesifik bir
yere konumlandırarak (örneğin sayfanın sol üst
kösesine, merkezine ya da diğer katmanlara göre
ön planda olacak şekilde yerleştirilmesi, vb.)
izleyicinin bakısı o bölgeleye çekilebilir.
• Şekillerin boyut ve oranları da üç boyutlu derinlik
yaratılmasında önemli bir rol oynamaktadır. Etkili
bir şekilde kullanıldığında ise istenen şekillerin ön
plana çıkmasını sağlamaktadır.
• Kullanılan elemanlar arasında kontrast
yaratılarak vurgu sağlanabilir. Açık-koyu ve
parlak-mat gibi renk ilişkileri ya da keskinlikyumuşaklık
gibi şekilsel ilişkiler kullanılarak
vurgulanmak istenen elemanlar ön plana
çıkarılabilir.
• Diyagonal veya paralel biçimlerle yapılan
yönlendirmelerle ya da oklar kullanılarak
izleyicinin dikkati kompozisyonda istenen
noktaya çekilebilir. Ayrıca tıpkı bilgilendirme
tasarımında kullanılan semalarda olduğu gibi
elemanlar arasında hiyerarşik bazı ilişkiler
kurulması da vurgu sağlamak için kullanılabilir.
• Tasarımda renk, boyut veya şekilsel farklılıklar
yaratılarak oluşturulan kontrast yoluyla istenen
ögeler vurgulanabilir. Örneğin, açık renkli
şekillerin arasına yerleştirilen koyu renkli bir
sekil tasarımın odak noktası hâline gelecektir.

Grafik tasarımda ritim, görsel unsurların
belirlenmiş¸ aralıklarla bir biri ardına dizilimidir. ritmin en
önemli iki tamamlayıcısı tekrar ve çeşitliliktir.

ritmin en önemli iki tamamlayıcısı tekrar ve
çeşitliliktir. Tekrarların sonucu olarak ortaya çıkan ahenk,
aynı zamanda kompozisyonda birliği de sağlamaktadır.
Çeşitlilik ise izleyicinin dikkatini tasarıma çekilmesini
sağlamaktadır. Tasarımda çeşitlilik kullanılan renk, boyut,
sekil ve boşluk gibi unsurlarla yaratılabilir.

Görsel hiyerarşi konsepti, en temel anlatımıyla en
önemli içeriğin en fazla, önemsiz olan içeriğin ise en az
görünür olmasıdır.

Bütünlük ilkesi tasarımda yer alan tüm unsurların
birbiriyle uyum içerisinde olmasıdır ve kompozisyonun
bütününün, içerisinde barındırdığı alt gruplardan ya da
tekil parçalardan daha önemli olması gerektiğini savunur.

• Yakınlık İlkesi
• Benzerlik İlkesi
• Devamlılık İlkesi
• Tamamlama İlkesi
• Simetri İlkesi

Diğerlerine nazaran daha yakın olan objeler birer
grup gibi görünürken, uzak olanlar ayrı ayrı algılanırlar.
Tasarımcılar ekrandaki kontrolleri ve metin alanlarını
birbirine daha yakın kullanarak veya çerçeveleyerek
gruplar ve diğer elemanlardan ayırırlar.

Benzerlik ilkesi göre gruplama birbirine benzer şekil,
renk, boyut, konum (yakınlık ilkesi), acı veya değer
gördüğümüzde gerçekleşir. Menü ve yönlendirmelerde
kullanılan benzer biçim renkler sayesinde kullanıcının
sisteme daha hızlı adapte olması sağlanabilir.

Gestalt prensibi görsel sistemimizde objelerin
bütünündeki eksiklikleri doldurma ve belirsizlikleri
gidermeyle ilgili olan eğilimlerimizi tanımlar. Görsel
algımız devam eder nitelikteki formları tamamlamaya ve
bütünü görmeye yatkındır.

Görsel algımız devam eder nitelikteki formları
tamamlamaya ve bütünü görmeye yatkındır. görsel
algımızın açık veya ayrı parçalar hâlinde olan şekilleri
kapalı ve birleşmiş hâlde algılamaya olan eğilimimiz ile
ilgilidir. Örneğin, birbiri ile bağlantısı olmayan yayları bir
çember olarak algılayabiliriz.

Simetri ilkesi kompleks görünümlerini
ayrıştırarak algılamaya olan yatkınlığımızla ilişkilidir.
Gördüğümüz objeleri otomatik olarak organize etme ve
basitleştirerek algılamak için onlara kendi merkezleri
etrafında simetri biçimler ithaf ederiz

Görsel algının temel ilkelerinden biri olan
şekil-zemin ilişkisi, objeleri çevreleri ile birlikte nasıl
algıladığımızla ilgilidir. Örneğin, büyük bir alanla
çevrilmiş olan bir obje olduğundan daha küçük
görünebilir

Devamlılık ilkesine örnek oluşturabilecek
örneklerden biri ünlü bilişim teknolojisi şirketi IBM
firmasının logosudur. Yatay olarak yerleştirilmiş
çizgilerden oluşan tasarımda, üç adet harf kolayca
anlaşılabilmektedir.

• Sayfa Düzeni
• Renk Kullanımı
• Sembol ve İkonlar
• Tipografi
• Bilgilendirme Tasarımı
• Animasyon Kullanımı

Sayfa düzeni, uygulandığı ortam fark etmeksizin
çeşitli bileşenlerin daha önce bahsedilen tasarım ilkeleri
doğrultusunda bir arada kullanılmasıdır

Izgara sistemi, grafik tasarımcıların navigasyon
ve içeriği kontrollü¨ bir şekilde yerleştirmek, görsel
iletişimi sağlamak ve ekran üzerindeki ilgi merkezini
belirlemek için kullandıkları temel bir yapıdır.

• Kullanıcıların sayfayı incelerken hızlı bir şekilde
hangi bilgilerin ilgilendikleri konu ile alakalı
olduğu anlayabilmelerini sağlar
• Kullanıcıların sayfayı incelerken hızlı bir şekilde
hangi bilgilerin ilgilendikleri konu ile alakasız
olduğu anlayabilmelerini sağlar.
• Kullanıcıların sadece ilgilendikleri konuya
odaklanmalarını sağlar

• Sunulmak istenen bilgi farklı bölümlere ayrılarak
ele alınmalıdır. Örneğin yoğun bilgi yığınlarının
var olduğu durumlarda, kapsamlı bölümler yine
kendi içerisinde alt bölümlere ayrılarak
yapılandırılmalıdır.
• Her bir bölüm ve alt bölümlerin belirgin bir
şekilde etiketlenmesi ve içeriğin bütününe
bakıldığında açıkça tanımlanabilmesi
gerekmektedir. Örneğin, sayfa içerisinde
kullanılan baslıklar önem sırasına göre birincil ya
da ikincil baslık olarak algılanabilmelidir. Başka
bir deyişle, okuyucu sayfa tasarımının yapısından
yola çıkarak bilgilendirici bir çıkarsama
yapabilmelidir.
• Oluşturulan tüm bu bölümlerin kendi içerisindeki
hiyerarşiyi inşa etmek için üst seviyedeki
bölümlerin alt seviyedekilere göre daha belirgin
bir şekilde sunulması gerekmektedir.

Arayüz tasarımında görsel hiyerarşiyi
oluşturulurken kullanıcıların okuma alışkanlıkları da
dikkate alınmalıdır. Örneğin, dünyada bizler dâhil pek çok
insan, kullandıkları dilin özelliklerinden dolayı herhangi
bir sayfayı soldan sağa ve yukarıdan aşağıya doğru
incelemektedir. Dolayısı ile gerçekleştirilen tasarımın
ilgili kültür ve dilin özelliklerini dikkate alır nitelikte
olması gerekmektedir.

• Tasarımda herhangi bir renk kullanıldığında,
bunu gören insanlar için ne anlama gelebileceği
düşünülmelidir. Çünkü renkler çeşitli yan
anlamlara da sahiptir.
• Renklerin insanlar üzerinde psikolojik etkileri
bulunmaktadır. Görelilik kuramı aynı zamanda renk
psikolojisi içinde geçerlidir. Renkler, izleyicide kimi
kişisel, kimiyse daha evrensel bazı spesifik
duygusal tepkileri uyandıran bir güce sahiptir. Örneğin, sıcak renkler insanları canlandırırken,
soğuk renkler onları rahatlatmaktadır.
• Arayüz tasarımında tercih edilen renklerin tutarlı
bir şekilde kullanıldığından emin olunması
gerekir. Kullanıcının özellikleri, sistem
gereksinimleri, yerine getirilen görevler ve
çevresel etmenler göz önünde bulundurulmalıdır.

• Rahat okunabilen metinler için fondaki renk ile
ön planda kullanılacak olan renk arasında yeterli
kontrast sağlamalıdır.
• Büyük alanlar için çok parlak renklerden
kaçınılmalıdır. Bunlar gözü yorar ve kullanıcıyı
sistemden uzaklaştırabilir.
• Çok fazla sayıda renk kullanmaktan kaçınılması
ve belirli bir sayı ile sınırlandırılması faydalı
olabilir. Çok sayıda renk kullanılması renkli ve
canlı bir tasarım yaratıldığını göstermez, aksine
kullanıcının kafasını karıştıran bir hâl alabilir.
• Renk, ekrandaki önemli bir alanı ya da herhangi
bir sema veya grafiğin kilit noktasını vurgulamak
için kullanılabilir. Ayrıca renklerden ekranı genel
olarak organize etmek için de faydalanılabilir.
Ekranda bulunan çeşitli bilgi kümeleri ya da
bölümler birbirinden farklı renkte alanlar
kullanılarak ayrıştırılabilir.

İkonlar çoğunlukla izleyicilerin etkileşime
geçebileceği obje ve eylemleri temsil etmek için kullanılan
resimsel imgelerdir.

• Kullanıcının kullanılan imaja aşina olması
faydalıdır. Tanıdık gelen bir imgenin
kullanılması öğrenme süresini azaltabilir.
• İkon veya sembollerin kolay anlaşılabilmesi için
görüntü¨ dili ve teknik açılardan net bir görüş
sağlaması gereklidir. Daha önce bahsedilen
anlaşılabilirdik ilkesi çerçevesinde ekran
çözünürlüğü ve renk seçimi gibi konuları dikkate
almak fayda sağlayacaktır.
• Sadelik genel tasarım ilkelerinden biri olduğu
gibi, sembol ve ikonların yaratılması sürecinde de
önem taşımaktadır.
• Arayüz tasarımı içerisinde kullanılan ikon ve
sembollerin tutarlı bir yapıda olması tasarımın
genel yapısını da etkileyebilir.

Tipografi metinlerin sayfa içerisindeki
yerleşiminde harflerin üst uzantısı ile alt uzantısı
arasındaki ölçü, yazı karakterlerinin boyutlandırılmasında
kullanılmaktadır.

İnfografik kelimesi bilgi (information) ve grafik
(graphic) kelimelerinin birleşiminden oluşmaktadır.
İnfografikler, bilgi ya da verilerin çizelge ve grafikleri gibi
görsel unsurlarla oluşturulan sunumudur.

Veri görselleştirme, tasarım ve bilimin ortak
alanıdır. İstatistiksel verilerin ve yoğun bilgi kümelerinin
çizelgeler, bilgi grafikleri ve tablolar kullanılarak oluşturulan
görsel sunumudur. Veri görselleştirmede öncelikli amaç
bilginin sade ve anlaşılır bir şekilde aktarılmasıdır.

İnfografiklerden farklı olarak, veri görselleştirmeler
çevrimiçi versiyonlarında kullanılan yazılım alt yapısı ile
birlikte kendini güncelleyebilen bir yapıdadır.

• Veriler nasıl organize edildi?
• Hangi ögeler birbiriyle ilişkili?
• Bu verileri nasıl inceleyebilirim?
• Verileri farklı bir biçimde görebilmek için
yeniden düzenleyebilir miyim?
• Yalnızca ihtiyacım olan veriyi nasıl görebilirim?
• Belirli veri değerleri nelerdir?

• Animasyonlar hareketi betimlemek için
kullanılabilir. Buna örnek olarak, bir eğitim
programı kapsamında hazırlanmış arayüzde
kasların çalışma ilkelerini göstermek için koşan
bir atın betimlenmesi verilebilir.
• Dinamik geri bildirimler sağlamak için
kullanılabilirler. Örneğin, bazı işletim sistemlerinde
birkaç dosya kopyaladığımız sırada dosyaların bir
klasörden diğerine doğru uçtuğunu gösteren
animasyonlar kullanmaktadırlar. Bu dinamik geri
bildirim, bize bir şeyler gerçekleştiğini doğrular
niteliktedir.
• Dikkat çekmek için uygulanabilirler. Örneğin,
Web sayfalarında gördüğümüz reklamlar
kullanıcıların dikkatini çekmek için hareketli bir
yapıdadır. Hatta çok fazla kullanıldıklarında
rahatsız edici bir hâl alabilmektedirler.
• Bilgisayar sisteminin çalıştığını göstermek için
kullanılabilirler.

• Kullanıcı ihtiyaçlarının belirlenmesi
• Sadelik
• Tutarlılık
• Anlaşılabilirlik
• Ulaşılabilirlik
• Uygulanabilirlik ve Uyumluluk
• Etkileşim (Interaction)
• Ekran Kontrolleri ve Yönlendirme (Navigasyon)

Kullanıcı ihtiyaçları belirlenirken hedef kitlenin
yaş, cinsiyet, eğitim düzeyi, bilgisayar/ bilişim tecrübesi,
fiziksel yetenekleri ya da engelleri gibi faktörler dikkate
alınmalıdır.

Arayüz tasarımında sadeliği sağlayabilmek için;
• Kademeli bir gösterim anlayışı benimsenerek,
elemanların ihtiyaç olana dek gizlenmesi,
• Sık kullanılan ve gerekli özelliklerin önce
sunulması,
• Daha sofistike ve daha az kullanılan
fonksiyonların gizlenmesi,
• Açık bir görsel hiyerarşinin sunulması,
• Önceden belirlenmiş, varsayılan ayarların
kullanılması,
• Tasarımda bütünlük ve tutarlılığın sağlanması,
• Gereksiz elemanların çıkarılması gibi çözümler
kullanılabilir.

Tutarlılık sayesinde kullanıcılar sisteme karşı
güvenli hissederler ve daha az hata yaparlar.

Arayüz tasarımında anlaşılabilirlik için;
• Kullanılan metaforlar ve benzeşimler gerçekçi ve
basit olmalıdır.
• Kullanılan metinler de bilgisayarın teknik
dilinden sıyrılmış ve anlaşılır olması
gerekmektedir.

Çevrim içi alışverişte kullanıcılar, gerçek
dünyadakinden farklı olarak, ürünleri seçer, ödeme
işlemlerine geçerek kredi kartı bilgilerini ve gönderim
adresini girerler. Çoğu çevrim içi alışveriş sitesinde
ürünler seçilirken alışveriş sepeti metaforu kullanılır.

Ulaşılabilirlik prensibi çerçevesinde geliştirilen
bir arayüz veya sistem farklı yeteneklere sahip olan
insanlar tarafından herhangi özel bir tasarım veya
değişiklik gerektirmeksizin kullanılabilmedir. Başlangıçta,
tasarımda ulaşılabilirlik terimi engelli insanlar için
geliştirilen sistemleri işaret etse de günümüzde tüm
kullanıcı kitlesini içine alan bir yapıdadır.

Tasarlanan arayüz, kullanıcının ihtiyaçları ile
bağdaşan, uyumlu bir yapıda olmalıdır. Arayüz
tasarımının geliştirilmesi sürecinde farklı ekran
çözünürlükleri, cihazlar ve kullanım ortamları göz önünde
bulundurulmalı ve geliştirilen arayüz konseptini farklı
cihazlarda uygulanabilmelidir.

Etkileşim tasarımı, kullanıcının olası
davranışlarını ve sistemin bu davranışları nasıl
düzenleyeceği ve karşılık vereceği ile ilgilidir. İşlevsel ve
etkileyici bir arayüze sahip olmak için zengin bir etkileşim
yaratılması önemlidir. Anlamlı, etkili ve verimli bir
etkileşim yaratmak, tıpkı bir dil oluşturmaya benzer.
Etkileşim süreci içerisindeki her iki tarafın da sembol ve
komutların ne anlama geldiği ve kullanılması durumunda
hangi eylemlerin meydana geleceğini bilmesi gerekir.

Arayüzde ekran kontrolleri ve yönlendirmenin
amacı kullanıcıların bulundukları aşamayı veya sayfayı
anlamalarını, bir sonraki aşamaya veya sayfaya
geçmelerini sağlamaktır.

1. Denge
2. Vurgu
3. Ritim
4. Hiyerarşi
5. Bütünlük

Denge, tasarımdaki tüm elemanlar eşit bir biçimde dağıtıldığında gerçekleşmektedir.

İki tür denge bulunmaktadır.

1. Simetrik denge
2. Asimetrik denge

Simetrik dengede daha statik ya da durağan bir tasarım sunmak için elemanlar kompozisyonun iki yanında eşit olarak düzenlenir ve bir ayna efekti sağlanır.

Asimetrik dengede elemanlar tasarımın merkezi baz alınarak yerleştirilmez ve görsel ağırlık merkezi değiştirilerek dinamik ve farklı bir hareket sağlanmış olur.

Vurgu, tasarımda hangi alanların öncelikli olacağının kontrol edilmesidir.

1. Dikkat çekilmek istenen elemanı diğer bileşenlerden ayırmak etkili bir yöntemdir. 
2. İlgili unsuru kompozisyon içerisinde spesifik bir yere konumlandırarak izleyicinin bakışı o bölgeye çekilebilir.
3. Şekillerin boyut ve oranları da üç boyutlu derinlik yaratılmasında önemli bir rol oynamaktadır.
4. Kullanılan elemanlar arasında kontrast yaratılarak vurgu sağlanabilir.
5. Diyagonal veya paralel biçimlerle yapılan yönlendirmelerle ya da oklar kullanılarak izleyicinin dikkati kompozisyonda istenen noktaya çekilebilir.
6. Tasarımda renk, boyut veya şekilsel farklılıklar yaratılarak oluşturulan kontrast yoluyla istenen ögeler vurgulanabilir.

1. İzole etme
2. Yerleştirme
3. Ölçeklendirme
4. Kontrast
5. İşaretçiler kullanma

Ritim, tekrar eden elemanlar tarafından yaratılan bir motiftir.

Grafik tasarımda ritim, görsel unsurların belirlenmiş aralıklarla bir biri ardına dizilimidir.

Kompozisyonda ritmin kurgulanmasında renk, doku, boşluk ve denge gibi pek çok faktörün payı bulunmaktadır. Ancak ritmin en önemli iki tamamlayıcısı vardır. Bunlar:

1. Tekrar: Tekrarların sonucu olarak çıkan ahenk, aynı zamanda kompozisyonda birliği de sağlamaktadır.
2. Çeşitlilik: Çeşitlilik, izleyicinin dikkatini tasarıma çekilmesini sağlamaktadır. Tasarımda çeşitlilik; kullanılan renk, boyut, şekil ve boşluk gibi unsurlarla yaratılabilir.

Görsel hiyerarşi konsepti en temel anlatımıyla, en önemli içeriğin en fazla, önemsiz olan içeriğin ise en az görünür olmasıdır.

Bütünlük ilkesi tasarımda yer alan tüm unsurların birbirleriyle uyum içerisinde olmasıdır ve kompozisyonun bütününün, içerisinde barındırdığı alt gruplardan ya da tekil parçalardan daha önemli olması gerektiğini savunur.

Bütünlük konsepti çeşitli, dinamik, canlı ve çekici bir yapıyı temsil etmektedir.

• Yakınlık
• Benzerlik
• Devamlılık
• Simetri
• Şekil-zemin ilişkisi
• Tamamlama

Yakınlık ilkesi, objeler arasındaki mesafenin onları nasıl bir bütün veya alt gruplar halinde algılamamızı etkilemesiyle ilgilidir.

Benzerlik ilkesi çerçevesinde gruplama, birbirine benzer şekil, renk, boyut, konum (yakınlık ilkesi), açı veya değer gördüğümüzde gerçekleşmektedir.

Devamlılık ilkesi ile bağlantılı olan tamamlama ilkesi, görsel algımızın açık veya ayrı parçalar halinde olan şekilleri kapalı veya birleşmiş halde algılamaya olan eğilimimiz ile ilgilidir.

Şekil-zemin ilişkisi ilkesi, zihnimizin görüş alanımızdakileri şekiller (ön plan) ve zemin (arka plan) olarak iki farklı kategoriye ayırarak ele alır.

Gelişen teknoloji ile birlikte insan bilgisayar etkileşimini incelemek için göz hareketlerini izleme sistemleri (eye tracking systems) kullanılmaktadır. Göz hareketleri verileri, web sitesi arayüz tasarımında insanların hangi alanlara dikkat ettiği, hangi bilgileri göz ardı ettikleri ve nelerden rahatsız oldukları konusunda bilgi verebilmektedir.

• Sayfa düzeni
• Renk kullanımı
• İkon ve sembol kullanımı
• Tipografi
• Bilgilendirme tasarımı
• Animasyon kullanımı

Ekran grafikleri uygun bir şekilde kullanıldığı takdirde, güçlü bir iletişim ve dikkat çekme yöntemi olarak kullanılabilir. Bu grafikler kullanıcının ilgisini ekranda toplayabilir, insan-bilgisayar etkileşimini destekleyebilir ve dil engelini aşmalarına yardımcı olabilir.

Sayfa düzeni, uygulandığı ortam fark etmeksizin çeşitli bileşenlerin  tasarım ilkeleri doğrultusunda bir arada kullanılmasıdır.

Sayfa düzeni denince akla ilk gelen kavram ızgara sistemidir. Izgara sistemi, grafik tasarımcıların navigasyon ve içeriği kontrollü bir şekilde yerleştirmek, görsel iletişimi sağlamak ve ekran üzerindeki ilgi merkezini belirlemek için kullandıkları temel bir yapıdır. Izgara temelli sayfa düzeni basılı medyadan dijital medya teknolojilerine etkili bir şekilde aktarılmış tekniklerden biridir.

Izgara sistemi ile biçimsel kontrastlar yaratılarak dinamik ve kendine özgü görüntülerin oluşturulması sağlanabilir.

Görsel ritim şekillerin, değerlerin, renklerin ve dokuların tekrarına dayanır. Şekillerin tekrarı ve aralarındaki boşluk sayfada bir desen veya ritim oluşturur.

Boşluk, ekranda diğer yazılım unsurlarından herhangi birini içermeyen bir alanı temsil etmektedir. Ayrıca sistemdeki diğer elemanların vurgulanması ve dikkat çekmesini sağlayabilir. Boşluk sayfa düzeni tasarımının daha özgün ve etkili olmasına imkan tanıyabilir.

Sayfa düzeni tasarımı, sayfadaki içeriğe, sıralamaya ve etkileşim noktalarına kullanıcının dikkatini çekmek için yapılan bir manipüle etme sanatıdır.

• Sunulmak istenen bilgi farklı bölümlere ayrılarak ele alınmalıdır.
• Her bir bölüm ve alt bölümlerin belirgin bir şekilde etiketlenmesi ve içeriğin bütününe bakıldığında açıkça tanımlanabilmesi gerekmektedir.
• Oluşturan tüm bu bölümlerin kendi içerisindeki hiyerarşiyi inşa etmek için üst seviyedeki bölümlerin alt seviyedekilere göre daha belirgin bir şekilde sunulması gerekmektedir.

Sayfa düzeni içerisinde görsel hiyerarşinin oluşturulması, kullanıcıların sayfayı incelerken hızlı bir şekilde hangi bilgilerin ilgilendikleri konu ile alakalı, hangisinin alakasız olduğunu ayırmalarına ve yalnızca ilgili olan kısma odaklanmalarına imkan sunar.

Tasarımda herhangi bir renk kullanıldığında, bunu gören insanlar için ne anlama gelebileceği düşünülmelidir, çünkü renkler çeşitli yan anlamlara da sahiptir. Bu yan anlamlar kısmen kültürel olabilir. Renkler, izleyicide kimi kişisel, kimiyse daha evrensel bazı spesifik duygusal tepkileri uyandıran bir güce sahiptir.

Rahat okunabilen metinler için fondaki renk ile ön planda kullanılacak olan renk arasında yeteli kontrast sağlamalıdır.

• Renk, ekrandaki önemli bir alanı ya da herhangi bir şema veya grafiğin kilit noktasını vurgulamak için kullanılabilir.
• Ekranı genel olarak organize etmek için renklerden faydalanılabilir.
• Ekranda bulunan çeşitli bilgi kümleri ya da bölümler birbirinden farklı renkte alanlar kullanılarak ayrıştırılabilir.

İkonlar çoğunlukla izleyicilerin etkileşime geçebileceği obje ve eylemleri temsil etmek için kullanılan resimsel imgelerdir.

• Benzeşim: Görüntü temsil ettiği şeyle aynı anlamı vermektedir.
• Sembolik: Soyut bir imajın kullanılmasıdır.
• Örnek/Model: Yansıtılan nesne ya da kavramın bir özelliği ya da örneği resimlenir.
• Rastlantısal: İmajın tamamıyla keyfi olarak düzenlenip, anlamının öğrenilmesi gerekmektedir.

• Kullanıcının kullanılan imaja aşina olması faydalıdır. Tanıdık gelen bir imgenin kullanılması öğrenme süresini azaltabilir.
• İkon veya sembollerin kolay anlaşılabilmesi için görüntü dili ve teknik açılardan net bir görüş sağlaması gereklidir.
• Sadelik genel tasarım ilkelerinden biri olduğu gibi, sembol ve ikonların yaratılması sürecinde de önem taşımaktadır.
  • Arayüz tasarımı içerisinde kullanılan ikon ve sembollerin tutarlı bir yapıda olması tasarımın genel yapısını da etkileyebilir.

Yazı tipi ya da yaygın kullanımı ile font, daktilo, şablon, tipo baskı bloğu veya bir kalem aracılığıyla oluşturulan el yazısını ortaya çıkarmak için kullanılan fiziksel bir araçtır.

Yazı karakteri, benzer tasarım anlayışı ile geliştirilmiş karakterlerin, harflerin, rakamların, sembol ve noktalama işaretlerinin bütününe verilen addır.

Yazı tipi seçimi yapılırken dikkat edilmesi gereken en önemli nokta, içeriklerin rahat okunabilir olmasıdır.

Punto (yaklaşık 0,376 milimetre), harf bloğunun boyutudur.

• Diyagramlar
• Şemalar
• Gerçek obje görünümleri

Bilgilendirme grafikleri, haritalar, tablolar ve grafikleri kapsayarak bilgiyi sözlü olarak aktarmaktansa görsel olarak iletişim kuran ögelerdir.

Rudolf Arnheim Görsel Düşünme adlı kitabında, insanların görsel tasarımı anlamada mantıksal bir yol olarak algısal ve bilişsel yönleri ayrı tutmaya eğilimli olduklarını tartışmıştır. Arnheim görsel algının, görsel düşünme olduğunu ve izleyicilerin bu görselleri yorumlarken karmaşık ancak oldukça hızlı bir sürece girdiklerini ileri sürmektedir.

Kökeni 1960'lara dayanan infografik kelimesi bilgi (information) ve grafik (graphic) kelimelerinin birleşiminden oluşmaktadır. İnfografikler, bilgi ya da verilerin çizelge ve grafikleri gibi görsel unsurlarla oluşturulan sunumudur.

Veri görselleştirme, tasarım ve bilimin ortak alanıdır. İstatistiksel verilerin ve yoğun bilgi kümelerinin çizelgeler, bilgi grafikleri ve tablolar kullanılarak oluşturulan görsel sunumudur. Veri görselleştirmede öncelikli amaç bilginin sade ve anlaşılır bir şekilde aktarılmasıdır. İnfografiklerden farklı olarak, veri görselleştirmeler çevrimiçi versiyonlarında kullanılan yazılım alt yapısı ile birlikte kendini güncelleyebilen bir yapıdadır.

• Veriler nasıl organize edildi?
• Hangi ögeler birbiriyle ilişkili?
• Bu verileri nasıl inceleyebilirim?
• Verileri farklı bir biçimde görebilmek için yeniden düzenleyebilir miyim?
• Yalnızca ihtiyacım olan veriyi nasıl görebilirim?
• Belirli veri değerleri nelerdir?

Animasyon ya da sözlük anlamıyla canlandırma, en basit haliyle herhangi bir görüntüyü hareketlendirmek anlamına gelir.

• Animasyonlar hareketi betimlemek için kullanılabilir.
• Dinamik geri bildirimler sağlamak için kullanılabilirler.
• Dikkat etmek için uygulanabilirler.
• Bilgisayar sisteminin çalıştığını göstermek için kullanılabilirler.

En iyi animasyon, kullanıcıların neler olup bittiğini anlamalarına dikkatlerini dağıtmadan yardımcı olandır.

1. Kullanıcı ihtiyaçlarının belirlenmesi
2. Sadelik
3. Tutarlılık
4. Anlaşılabilirlik
5. Ulaşılabilirlik
6. Uygulanabilirlik ve uyumluluk
7. Etkileşim (Interaction)
8. Ekran kontrolleri ve yönlendirme (Navigation)

Arayüz genel olarak menülerin, fotoğraf ve imajların, işaretçilerin ve ikonların içerikle bir arada sunulduğu bir tasarımdır.

• Yaş
• Cinsiyet
• Eğitim düzeyi
• Bilgisayar/bilişim tecrübesi
• Fiziksel yetenekleri ya da engelleri

Sadelik, kullanıcı arayüzünü mümkün olduğunca yalın haliyle korumanın önemini vurgulayan bir tasarım prensibidir.

• Kademeli bir gösterim anlayışı benimsenerek, elemanların ihtiyaç olana dek gizlenmesi,
• Sık kullanılan ve gerekli özelliklerin önce sunulması,
• Daha sofistike ve daha az kullanılan fonksiyonların gizlenmesi,
• Açık bir görsel hiyerarşinin sunulması,
• Önceden belirlenmiş, varsayılan ayarların kullanılması,
• Tasarımda bütünlük ve tutarlılığın sağlanması,
• Gereksiz elemanların çıkarılması gibi çözümler kullanılabilir.

Bir arayüz tasarımının ulaşılabilir olması için, geçmiş deneyimleri, eğitim durumu ya da fiziksel yetenekleri fark etmeksizin her kullanıcı tarafından anlaşılabiliyor olması gerekmektedir.

Etkileşim tasarımı, kullanıcının olası davranışlarını ve sistemin bu davranışları nasıl düzenleyeceği ve karşılık vereceği ile ilgilidir.

Etkileşim, iki veya daha fazla katılımcı arasındaki bilgi alışverişi olarak tanımlanabilir. Ayrıca etkileşim kavramını, iki veya daha fazla aktör arasında tekrarlanan dinlenme, düşünme ve konuşma süreçleri olarak da nitelenebilir.

İnsanlar veri oluşturmak ve uygulama içinde görevleri yerine getirmek için botun, kaydırma çubukları ve onay kutuları gibi kontroller kullanmaktadırlar. Bunlar gibi pek çok kullanıcı arayüzü elemanını işleme sokmak için ise pencere kontrolü, sekme görünümü kontrolü veya bölüm görünümü kontrolü gibi çeşitli kontrol birimleri devreye girmektedir.