Bu yazıda, sizinle bazı arabirim öğelerinin kısa tanımlarını ve infografiğini paylaşıyoruz. “E biz zaten bunları biliyoruz, günlük hayatta ne işimize yarayacak ki” diyebilirsiniz. Ama durun, önce bir dinleyin! Çünkü bu doküman, müşterilerinizle ya da kendi iç iletişiminizde taksonomiyi kolaylıkla tanımlamanıza olanak sağlayacak.
Bu yazıda, sizinle bazı arabirim öğelerinin kısa tanımlarını ve infografiğini paylaşıyoruz. “E biz zaten bunları biliyoruz, günlük hayatta ne işimize yarayacak ki” diyebilirsiniz. Ama durun, önce bir dinleyin! Çünkü bu doküman, müşterilerinizle ya da kendi iç iletişiminizde, arabirim tasarım süreciyle ilgili en çok problem yaşadığınız alanlardan birini, yani taksonomiyi kolaylıkla tanımlamanıza olanak sağlayacak.
Mesela müşteriniz, “Şurada lorem ipsum yazıyor, yanlış olmuş galiba. O kısmı düzeltebilir miyiz?” gibi bir cümle kurduğunda, hem zamanınızı hem de sabrınızı optimumda tutmak istiyorsanız, aşağıdaki infografik ve tanımları gönül rahatlığıyla kullanabilirsiniz.
Arabirim Öğeleri:
Bu içerik ücretsiz!
Okumaya devam etmek ve SHERPA Blog okuru olmak için aşağıdakilerden birini seç. Her hafta yenileri eklenen yüzlerce içeriğe ücretsiz ve sınırsız eriş.
Ziyaret etmek istediği sitenin adresini girmenin yanı sıra, kullanıcıya tarayıcıya bağlı olarak ekstra navigasyon öğeleri sunan alandır.
2. Breadcrumbs
Site içerisindeki hiyerarşik yapıya bağlı olarak, kullanıcının bulunduğu sayfa ile ana sayfa arasındaki adımlar arasında gezinmesini sağlar. Breadcrumbs, adını Hansel ve Gretel’in evlerini bulmak amacıyla bıraktıkları ekmek kırıntılarından alır.
3. Ana Navigasyon
Kullanıcının sitedeki ana başlıklar arasında gezinmesini sağlayan temel navigasyon alanıdır. Ana navigasyon içindeki menü başlıkları, birer açılır menü olarak alt başlıklar şeklinde sunulabilir.
4. Arama
Arama alanı, kullanıcıların site içerisindeki içerikleri aramasını sağlayan giriş alanıdır. Kullanıcı arama alanına aramak istediği sözcüğü yazarak ya da yazım sırasında sunulan önerilerden birine tıklayarak site içerisinde arama yapabilir.
5. Lorem Ipsum Metni
Gerçek metin gibi görünen fakat okunamayan, taslak çalışmalarda kullanılan geçici (yer tutucu) metindir. Metnin nerede bulunacağını ve ne kadar alan kaplayacağını gösterir.
6. Carousel
Kullanıcının, öne çıkarılan içeriklere kolayca ulaşmasını sağlayan ve bunu teşvik eden, büyük görseller, ilgi çekici metinler ve buton içeren ve bu öğeleri dönüşümlü olarak görüntüleyebilen alandır.
7. İkon Destekli Butonlar
Butonlarda yer alan ikonlar, kullanıcının aksiyonu sitenin dilinden bağımsız olarak algılayabilmesine yardımcı olur.
8. Grafik Butonlar
Butonları birer grafik öğe olarak ele almak, butonun işlevi konusunda ipucu vererek kullanıcıya yardımcı olabilir.
9.Açılır Menüler
Kullanıcının birden çok seçeneği görüntüleyerek bu seçenekler içerisinden seçim yapmasını sağlayan ve içeriği kullanıcının isteğine bağlı olarak görüntülenen öğelerdir.
10. Aşama Göstergeleri
Kullanıcının anketler gibi birden fazla aşamadan oluşan bir deneyim süresince hangi aşamada bulunduğu konusunda bilgi almasını sağlar.
11. Tooltip (İpucu)
Kullanıcının ihtiyaç duyabilleceği bilgilerin arabirimde fazla yer kaplamadan ve kullanıcı ihtiyaç duyduğu anda görüntülenmesini sağlayan görsel öğelerdir.
12. Tab
Birden çok içeriğin, arabirimde aynı alanda kullanıcının isteğine bağlı olarak görüntülenmesini sağlayan öğelerdir.
13.Checkbox (Seçim Kutusu)
Kullacının çoklu seçim yapmasını sağlayan öğelerdir.
14.Radio Button (Opsiyon Butonu)
Kullanıcının aynı anda görüntülenebilen birden çok tercihten sadece birini seçmesini sağlayan seçim kutularıdır.
15. Dinamik Bildirimler
Kullanıcının bir butona tıkladığında karşılaşacağı içerik konusunda önceden bilgi almasını sağlayan ve içeriği deneyim süresince dinamik olarak güncellenebilen öğelerdir.
16.Mesajlar
Kullanıcınının yapmakta olduğu işlem konusunda bilgi almasını sağlayan, çoğu durumda ekranda kısa bir süre görüntülenen ya da kullanıcının gizlemesine izin veren bilgi amaçlı elementlerdir. Bilgi içeriğini renk ve ikonlarla beraber sunmak, kullanıcının mesajı ayrıştırabilmesini kolaylaştırır.
17.Açılır Takvim
Kullanıcıların tarih bilgisini, herhangi bir yazım formatına uyma zorunluluğu olmadan girmesini sağlayan ve kullanıcının isteğine bağlı olarak görüntülenen öğelerdir.
18. Video Oynatıcı
Kullanıcıya sunulan video içeriğinin başlatılması, durdurulması, ileri ya da geri sarılması, sesin açılıp kapatılabilmesi ve videonun ekranı kaplayacak şekilde görüntülenebilmesi gibi etkileşimler sunan öğelerdir.
19.Duruma Bağlı Gösterimler
Kullanıcının, butonlar başta olmak üzere tüm öğelerin etkileşim potansiyellerini algılamasını sağlayan durum gösterimidir. Öğeler standart durumda, aktif ve pasif durumlarda olabileceği gibi, kullanıcının deneyimine bağlı olarak imleçle üzerine gelme, odaklanma, seçili olma gibi durumlarda da farklı şekilde görüntülenebilir.
20.Görsel Hiyerarşi
Farklı işlevlerdeki öğelerin birbirinden farklı boyut ve stillerde görüntülenmesi, kullanıcının öğeleri ayrıştırabilmesini ve öğelerle etkileşim kurmasını kolaylaştırır.
21.Alt Navigasyon
Kullanıcının isteğine bağlı olarak görüntülenen ve birincil önceliği bulunmayan etkileşim öğelerini kapsayan navigasyon alanıdır.
22.Akordeon
Genişletilerek ve daraltılarak, içeriğin arabirimde kapladığı alanın verimli kullanılmasını sağlayan öğelerdir.
23.Bilgi Grafiği
Kapsamlı bilgilerin kullanıcı tarafından kolayca algılanmasını sağlayan görsel öğelerdir. Uzun metinlerle aktarılabilecek bilgiyi arabirimde daha az yer kaplayarak anlatmaya yararlar.
24.Modal
Kullanıcının deneyimine bağlı olarak görüntülenen ve kullanıcıdan etkileşim bekleyen öğelerdir.
25.Tablo
Bilginin organize edilerek ve sınıflandırılarak aktarılabilmesini sağlayan öğelerdir.
26.Anket
Kullanıcı kitlesinden belirli bir konudaki seçimlerine dair bilgi toplamak amacıyla görüntülenen ve birden çok seçenek barındıran öğelerdir.
27.İkonlar
Öğelerin ikonlarla desteklenmesi kullanıcı tarafından daha kolay anlaşılabilmesini sağlar.
28.Sayfalandırma
Kullanıcının, görüntülenmekte olan sayfa ve toplam sayfa sayısı hakkında bilgi sahibi olmasının yanı sıra sayfalar arasında gezinebilmesini sağlayan navigasyon öğesidir.
29. Footer
Çoğunlukla sitedeki her sayfada, sayfanın en altında bulunan, öncelikli site içeriklerine kolayca ulaşmayı sağlayan öğelerdir. Sitenin arama motorları tarafından indekslenebilmesini kolaylaştırır.