SlideShare a Scribd company logo
1 of 33
UI
İYİLEŞTİRMELERİ
Volkan Şentürk - tasit.com Developer
Daha iyi kullanıcı arayüzü
Kullanımı kolay ve bu kolaylaştırma sebebiyle
yüksek dönüşüm oranlı sayfalar yaratmak için
pratik fikirler...
1.Çoklu kolon yerine TEK kolon
● Tekli kolon sistemi size sayfa üzerinde daha
iyi kontrol sağlar.
● Okuyucunun dikkati kolonlar içinde dağılmaz
ve tek kolon üzerinden aşağıya doğru
yönlenir.
● Fazla kolon sayfanın başarısız olma riskini
arttırır
● Tek kolonlu sayfada kolonun sonundaki
önemli bir çağrı , haraket veya
yönlendirmenin başarıya ulaşma şansını
yükseltir.
1.Çoklu kolon yerine Tekli kolon
2.Satışı hemen kapatmak
yerine HEDİYE vermek
Verdiğiniz küçük veya büyük hediyeyi öne
çıkararak etkili bir ikna yöntemi sağlayarak
müşterinin size geri dönüş şansını
arttırabilirsiniz.
2.Satışı hemen kapatmak
yerine HEDİYE vermek
3.Farklı fonksiyonlar yerine, benzerleri
TEK fonksiyonda birleştir.
● Temel haraketler, olaylar, "ŞEY"ler zaman içinde
parçalanır ve sayfa karmaşıklaşır.
● Bu karmaşık yapı, kullanıcı üzerinde gereksiz bir
yük oluşturur ve sayfanın görevini yapmasını
engeller.
● Çeşitli şekillerde yenilenen işlevler
birleştirilmelidir.
● Kullanıcı için öğrenme eğrisi oluşturacak
yapılardan kaçınmak gereklidir.
● Belli aralıklarla sayfalar kontrol edilerek sayfadaki
parçalanmaları birleştirin.
3.Farklı fonksiyonlar yerine benzerleri
TEK fonksiyonda birleştir.
4.Kendiniz hakkında konuşacağınıza
müşterileriniz sizin hakkınızda konuşsun
● Dönüş oranlarını arttırmak için kullanılan etkili
yöntemlerden biriside sizin hakkınızdaki olumlu
müşteri deneyimlerinin sayfada paylaşılmasıdır.
● Referans ve kanıt gösterme harakete geçirmede
etkindir.
4.Kendiniz hakkında konuşacağınıza
müşterileriniz sizin hakkınızda konuşsun
5. Ana (Birincil) hareketi tekrarlamayı dene
● Uzun ve/veya çok sayıda sayfada kullanıcıyı
sıkmadan kullanımı kolaylaştırmak için hareketi
tekrarlamalısınız.
5. Ana (Birincil) hareketi tekrarlamayı dene
6. Tıklanabilir, seçilir veya metin öğelerinde
farklı stiller kullanılmalı.
● Renk, derinlik ve kontrast gibi görsel stiller ,
sayfadaki navigasyonu sağlamak ve kullanıcıları
yönlendirmek için iyi işaretlerdir.
● Kullanıcılarla iletişim kurmanın en iyi yoludur ancak
tutarlı bir şekilde uygulanmalıdır.
● Seçilebilen, tıklanabilen ve metinlerin farklı stillerde
tutarlı bir şekilde uygulanması, sayfanın hedefe
ulaşmasında önemlidir.
6. Tıklanabilir, seçilen veya metin öğelerinde
farklı stiller kullanılmalı.
7.Eşit seçimler yerine öneri kullan.
● Bazı kullanıcıları harekete geçirmek için
onlara faklı paketlerden birini önermek
önemlidir.
● Kullanıcılara birden fazla önerin varsa, bir
tanesini önermen ve öne çıkarman karar
veme sürecini etkileyebilir.
● Öne çıkararak kullanıcının karar verme
sürecindeki felcini önleyebilirsin.
7.Eşit seçimler yerine öneri kullan.
8.Onay İstemek yerine geri
çevir (Undo) kullan.
● Kullanıcı eylemlerinin çoğunu tasarlayarak
yapar. Çok azı kazara yapılan işlemlerdir.
● Bu yüzden kullanıcının eylemleri için onay
almak yerine işlemi gerçekleşmesine izin
verip. Kazara yapılan eylemi geriye alması
sağlanmalıdır. Ve kullanıcının kontrolü
sağlanmalıdır.
8.Onay İstemek yerine geri
çevir (Undo) kullan.
9.Hedef kullanıcılarını
belirt.
● Her sayfanın bir ana hedef kitlesi
vardır/olmalıdır.
● Sayfanın hangi hedef kitle için tasarlandığı
düşünülmeli ve metin içerisinde belirtilip
seçkinlik hissi verilerek hedefteki kullanıcıyı
siteye daha fazla bağlayabilirsiniz.
● Bu hedeflerin iyi belirlenememesi riskler
taşımaktadır. Dikkatli olunmalıdır.
9.Hedef kullanıcılarını
belirt.
10. Belirsizlikleri kaldır. Net ol
● Net olmayan, karışık metin ve mesajlardan
kaçınılmalı.
● "İster misin?" ve benzeri kalıplardan uzak
durulmalı.
10. Belirsizlikleri kaldır. Net ol
11 Daha fazla kontrast
● Kullancıyı harekete geçirdiğiniz yerlerdeki
mesajı kuvvetlendirmek için kontrastı iyi
kullanmalıyız.
● Kullanıcı arayüzünün mesajı kuvvetli
olmalıdır.
● Tamamlayıcı renkler kullanılarak harekete
geçiren öğenin kullanıcıya daha yakın
görünmesi sağlanabilir.
11 Daha fazla kontrast
12. Özel ve Kaliteli içerik
● Sayfanın içeriğinin kalitesini artıracak,
kullanıcının kaliteli bilgiye ulaşabileceği
ekstra bilgiler eklenerek kullanıcının siteye
olan bağı arttırılabilir.
12. Özel ve Kaliteli içerik
13 .Form alanlarını kısalt
● Kullanıcının emek harcayarak doldurduğu
formlarda gereksiz ekstra bilgilerden
kaçınarak , kullanıcının arkasının dönüp
çıkmasını engeller ve daha fazla kullanıcıya
erişebilirsiniz.
● Mobil kullanımın her geçen gün arttığı
düşünülürse uzun formların mobil cihazlarda
nasıl doldurulduğunu dikkate almalısınız
13 .Form alanlarını kısalt
14.Seçenekleri gizleme!
15.Uzun metinleri formatla
● Kullanıcının metni okumasını sağlamak için
güvenilir bir ritim ve desenle uzun metinleri
formatlayın.
● Formatlarken boşluklara dikkat edin.
15.Uzun metinleri formatla
16.Bağlantılara boğma; odak
noktasına yönlendir.
● Farklı bağlantıların çıkarılması; ziyaretçi için
zaman kaybına uğratmadan asıl olan
düğmeye ulaşılmasını ve harekete geçmeyi
kolaylaştırır.
● Müşteri ihtiyaçlarını karşılamak için iyi niyetle
koyduğunuz bağlantılar, müşteriyi hedeften
uzaklaştırır ve risk taşır.
● Linkleri koyarken iki kere düşünün.
16.Bağlantılara boğma; odak
noktasına yönlendir.

More Related Content

Featured

Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Featured (20)

Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 
More than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike RoutesMore than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike Routes
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
 

UI (Kullanıcı Arayüzü) İpuçları

  • 2. Daha iyi kullanıcı arayüzü Kullanımı kolay ve bu kolaylaştırma sebebiyle yüksek dönüşüm oranlı sayfalar yaratmak için pratik fikirler...
  • 3. 1.Çoklu kolon yerine TEK kolon ● Tekli kolon sistemi size sayfa üzerinde daha iyi kontrol sağlar. ● Okuyucunun dikkati kolonlar içinde dağılmaz ve tek kolon üzerinden aşağıya doğru yönlenir. ● Fazla kolon sayfanın başarısız olma riskini arttırır ● Tek kolonlu sayfada kolonun sonundaki önemli bir çağrı , haraket veya yönlendirmenin başarıya ulaşma şansını yükseltir.
  • 4. 1.Çoklu kolon yerine Tekli kolon
  • 5. 2.Satışı hemen kapatmak yerine HEDİYE vermek Verdiğiniz küçük veya büyük hediyeyi öne çıkararak etkili bir ikna yöntemi sağlayarak müşterinin size geri dönüş şansını arttırabilirsiniz.
  • 7. 3.Farklı fonksiyonlar yerine, benzerleri TEK fonksiyonda birleştir. ● Temel haraketler, olaylar, "ŞEY"ler zaman içinde parçalanır ve sayfa karmaşıklaşır. ● Bu karmaşık yapı, kullanıcı üzerinde gereksiz bir yük oluşturur ve sayfanın görevini yapmasını engeller. ● Çeşitli şekillerde yenilenen işlevler birleştirilmelidir. ● Kullanıcı için öğrenme eğrisi oluşturacak yapılardan kaçınmak gereklidir. ● Belli aralıklarla sayfalar kontrol edilerek sayfadaki parçalanmaları birleştirin.
  • 8. 3.Farklı fonksiyonlar yerine benzerleri TEK fonksiyonda birleştir.
  • 9. 4.Kendiniz hakkında konuşacağınıza müşterileriniz sizin hakkınızda konuşsun ● Dönüş oranlarını arttırmak için kullanılan etkili yöntemlerden biriside sizin hakkınızdaki olumlu müşteri deneyimlerinin sayfada paylaşılmasıdır. ● Referans ve kanıt gösterme harakete geçirmede etkindir.
  • 11. 5. Ana (Birincil) hareketi tekrarlamayı dene ● Uzun ve/veya çok sayıda sayfada kullanıcıyı sıkmadan kullanımı kolaylaştırmak için hareketi tekrarlamalısınız.
  • 12. 5. Ana (Birincil) hareketi tekrarlamayı dene
  • 13. 6. Tıklanabilir, seçilir veya metin öğelerinde farklı stiller kullanılmalı. ● Renk, derinlik ve kontrast gibi görsel stiller , sayfadaki navigasyonu sağlamak ve kullanıcıları yönlendirmek için iyi işaretlerdir. ● Kullanıcılarla iletişim kurmanın en iyi yoludur ancak tutarlı bir şekilde uygulanmalıdır. ● Seçilebilen, tıklanabilen ve metinlerin farklı stillerde tutarlı bir şekilde uygulanması, sayfanın hedefe ulaşmasında önemlidir.
  • 14. 6. Tıklanabilir, seçilen veya metin öğelerinde farklı stiller kullanılmalı.
  • 15. 7.Eşit seçimler yerine öneri kullan. ● Bazı kullanıcıları harekete geçirmek için onlara faklı paketlerden birini önermek önemlidir. ● Kullanıcılara birden fazla önerin varsa, bir tanesini önermen ve öne çıkarman karar veme sürecini etkileyebilir. ● Öne çıkararak kullanıcının karar verme sürecindeki felcini önleyebilirsin.
  • 16. 7.Eşit seçimler yerine öneri kullan.
  • 17. 8.Onay İstemek yerine geri çevir (Undo) kullan. ● Kullanıcı eylemlerinin çoğunu tasarlayarak yapar. Çok azı kazara yapılan işlemlerdir. ● Bu yüzden kullanıcının eylemleri için onay almak yerine işlemi gerçekleşmesine izin verip. Kazara yapılan eylemi geriye alması sağlanmalıdır. Ve kullanıcının kontrolü sağlanmalıdır.
  • 18. 8.Onay İstemek yerine geri çevir (Undo) kullan.
  • 19. 9.Hedef kullanıcılarını belirt. ● Her sayfanın bir ana hedef kitlesi vardır/olmalıdır. ● Sayfanın hangi hedef kitle için tasarlandığı düşünülmeli ve metin içerisinde belirtilip seçkinlik hissi verilerek hedefteki kullanıcıyı siteye daha fazla bağlayabilirsiniz. ● Bu hedeflerin iyi belirlenememesi riskler taşımaktadır. Dikkatli olunmalıdır.
  • 21. 10. Belirsizlikleri kaldır. Net ol ● Net olmayan, karışık metin ve mesajlardan kaçınılmalı. ● "İster misin?" ve benzeri kalıplardan uzak durulmalı.
  • 23. 11 Daha fazla kontrast ● Kullancıyı harekete geçirdiğiniz yerlerdeki mesajı kuvvetlendirmek için kontrastı iyi kullanmalıyız. ● Kullanıcı arayüzünün mesajı kuvvetli olmalıdır. ● Tamamlayıcı renkler kullanılarak harekete geçiren öğenin kullanıcıya daha yakın görünmesi sağlanabilir.
  • 24. 11 Daha fazla kontrast
  • 25. 12. Özel ve Kaliteli içerik ● Sayfanın içeriğinin kalitesini artıracak, kullanıcının kaliteli bilgiye ulaşabileceği ekstra bilgiler eklenerek kullanıcının siteye olan bağı arttırılabilir.
  • 26. 12. Özel ve Kaliteli içerik
  • 27. 13 .Form alanlarını kısalt ● Kullanıcının emek harcayarak doldurduğu formlarda gereksiz ekstra bilgilerden kaçınarak , kullanıcının arkasının dönüp çıkmasını engeller ve daha fazla kullanıcıya erişebilirsiniz. ● Mobil kullanımın her geçen gün arttığı düşünülürse uzun formların mobil cihazlarda nasıl doldurulduğunu dikkate almalısınız
  • 30. 15.Uzun metinleri formatla ● Kullanıcının metni okumasını sağlamak için güvenilir bir ritim ve desenle uzun metinleri formatlayın. ● Formatlarken boşluklara dikkat edin.
  • 32. 16.Bağlantılara boğma; odak noktasına yönlendir. ● Farklı bağlantıların çıkarılması; ziyaretçi için zaman kaybına uğratmadan asıl olan düğmeye ulaşılmasını ve harekete geçmeyi kolaylaştırır. ● Müşteri ihtiyaçlarını karşılamak için iyi niyetle koyduğunuz bağlantılar, müşteriyi hedeften uzaklaştırır ve risk taşır. ● Linkleri koyarken iki kere düşünün.