Web Tasarım Ajansı

UX Case Study

Airbnb Türkiye Design Audit

Küresel pazar yeri devinin Türkiye vitrini olan airbnb.com.tr, React tabanlı yığını Airbnb’nin imza Cereal tipografi sistemiyle birleştiriyor. Hesaplamalı metrikler, yoğun ürün arayüzlerinde sık görülen bir çelişkiyi ortaya koyuyor: marka ve hareket skorları zirvede iken uzamsal denge ve Fitts uyumu geride—sürükleyici keşif düzenleri ile mobil dokunma hedefi yönergeleri arasındaki bir takas.

75

Overall Score

Estetik70

UX/IX55

Kararlılık48

İçerik60

Teknik85

Akış100

Marka100

Motion100

Kromatik Estetik ve Algısal Canlılık

Score: 68

Hasler-Süsstrunk renk canlılığı metriği M ≈ 66.12 olarak ölçülüyor—literatürde sık anılan 20–50 “canlı ama yormayan” bandının üzerinde. Fotoğraf ve duygusal ipuçlarına dayanan bir seyahat pazar yerinde bu kısmen kasıtlı; denetim yine de tek görünümde çok sayıda doygun kartın yarıştığı senaryolarda görsel gürültü riskini işaret ediyor. WCAG kontrast örneklemesinde analiz edilen geçişte otomatik kontrast ihlali raporlanmadı.

Analysis by Celal Dinç

Renklilik (M Skoru)

66.12

Yüksek canlılık (çarpıcı, bilişsel yük riski)

Algısal Kontrast (WCAG)

0 Tespit Edilen Sorun

Uzamsal Denge ve Simetri

Score: 48

Görsel denge oranı yaklaşık %15.7 civarında—harita ağırlıklı veya kart raylı ana sayfalarda tipik, güçlü asimetrik bir yerleşim. Kompozisyonel yoğunluk (~20.9) ve 4px grid uyumu (~%27), bilgi yoğunluğu uğruna beyaz alan ve ritmin sıkıştırıldığını gösteriyor. Bu bir “hata”dan çok ürün tercihi; ilk boyamada bilişsel yükü artırıyor.

Analysis by Celal Dinç

Görsel Denge (Simetri)

%15.7

Sol/sağ görsel ağırlık asimetrisi.

Kompozisyonel Karmaşa

20.88

Birim alana düşen algısal öğe yoğunluğu.

Grid Sistemi Uyumu

%27

4px grid hizalama tutarlılığı

Tipografik Bilim

Score: 88

Tipografi, seviyeler arasında Büyük Üçlü (1.250) modüler ilişkisini izliyor—Airbnb’nin sistematik ölçeğiyle uyumlu. Taramada birincil yazı tipi Airbnb Cereal VF olarak çözülüyor; sans-serif genel yedeklerle destekleniyor. Ortalama satır yüksekliği 1.31 civarı, tarama ağırlıklı arayüzlere uygun; uzun metinlerden çok kısa arayüz dizeleriyle iyi eşleşiyor.

Analysis by Celal Dinç

Tespit Edilen Ölçek

1.250

Büyük Üçlü (belirgin hiyerarşi adımları)

Dikey Ritim (Satır Yüksekliği)

1.31

Etkileşim Fiziği ve Fitts Yasası

Score: 55

Fitts Yasası skoru 10 / 100’e düşüyor: birçok etkileşimli öğe mobil için önerilen dokunma hedefinin altında (denetim: 19 kontrol küçük işaretlendi). Ortalama hedef boyutu ~38px, yaygın 44px eşiğinin altında. Gestalt tutarlılığı mükemmel (100)—hedefler sıkışık olsa da bileşen aileleri tutarlı.

Analysis by Celal Dinç

Fitts Uyumluluk Endeksi

10 / 100

Ort. hedef ~38px; dokunmada ideal ≥44px.

Arayüz Tutarlılığı

100 / 100

Üç baskın buton stili; düşük stil entropisi.

İçerik Stratejisi ve Semantik Yapı

Score: 72

Başlık hiyerarşisi analiz edilen görünümde yüksek skor veriyor (Semantik DNA: 100), temiz bir H1→H2→H3 merdiveni. Okunabilirlik sezgileri (cümle başına ortalama kelime), pazarlama metni normlarına göre karmaşık/akademik okunuyor—yasal, politika ve ilan mikrometinlerinin ortalamayı şişirmesi beklenen bir durum. Anlık görüntüde yaklaşık 164 kelime metin yakalandı; sayfa ağırlığı ~2.94 MB ve 118 HTTP kaynağı, medya ve betik ağırlıklı bir yüzeyi yansıtıyor.

Analysis by Celal Dinç

Okunabilirlik (sezgisel)

41.0

Ort. cümle uzunluğu (kelime) — yoğun metin örüntüleri

Semantik DNA

Skor: 100

Dijital Karbon Ayak İzi

99.1

2.94 MB

Carbon

Görsel Dikkat (Saliency) ve Kapsayıcılık

Score: 68

Saliency sıralaması üstte jenerik kapsayıcıları (HTML / BODY / DIV) gösteriyor—kahraman alanı tek semantik manşet yerine büyük bileşik bir bölge olduğunda sık görülen bir durum. Denetim görsel hiyerarşi uyumunu geliştirilmesi gereken olarak etiketliyor. Deuteranopia simülasyonunda bir renk çakışma çifti raporlandı; WCAG kontrastı geçerken renk körlüğü altında ayırt edilebilirlik için çipler, haritalar ve durum renklerinde ikinci bir tasarım geçişi değerli.

Analysis by Celal Dinç

Dikkat Yoğunluğu (Saliency)

Başlık alanı (HTML)

Gövde kromu

Birincil içerik kabuğu

Renk körlüğü (Deutan)

Normal

Deut.

Teknoloji Altyapısı ve Performans

Score: 88

Çalışma zamanı parmak izinde React tespit edildi; denetim yığını modern standart uygulama olarak sınıflandırıyor ve teknoloji modernite skorunu 95 olarak veriyor. Ölçülen İlk Anlamlı Boyama (FCP) bu koşuda 2463ms—küresel dağıtılmış bir uygulama kabuğu için anlaşılır, yine de tekrar ziyaretlerde kenar önbellekleme ve paket bölme adayı. Çerçeve tespitiyle uyumlu ~%80 civarı “özel kod” oranı, saf el yapımı vanilya JS anlamına gelmiyor.

Analysis by Celal Dinç

Teknoloji Yığını

ReactModern SPA örüntüleri

Teknik Modernite Endeksi

Custom: ~%80 (hazır UI kitlerine kıyasla)

Marka Algısı ve Hareket Psikolojisi

Score: 100

Renk ipuçları persona olarak Kahraman (The Hero) arketipine yaklaşıyor—cesaret, enerji ve Airbnb macera anlatısıyla uyumlu. Hareket fiziği ortalama ~240ms geçiş süresiyle “hızlı ama okunaklı” banda oturuyor; doğal cubic-bezier easing lineer tween’lere göre baskın. 28 animasyonlu yüzey sayıldı—yüksek, ama dinamik bir pazar yeri UX’iyle uyumlu.

Analysis by Celal Dinç

Baskın Marka Arketipi

Kahraman (The Hero)

#Cesur#Enerjik#Acil#Modern

"Kırmızıya yakın vurgular enerji, tutku ve aciliyeti çağrıştırır."

Hareket Fiziği

240ms

100

Smoothness

Doğal (Bezier)

Bilimsel Temeller

Algısal Renk Canlılığı

Proceedings of SPIE•Hasler, D., & Süsstrunk, S. E. (2003)

Doğal görüntülerde renk canlılığının ölçülmesi.

Fitts Yasası ve İBE

Human-Computer Interaction•MacKenzie, I. S. (1992)

İnsan-bilgisayar etkileşiminde araştırma ve tasarım aracı olarak Fitts yasası.

WCAG 2.1 Kontrast Gereksinimleri

W3C Recommendation•W3C (2018)

Metin ve arayüz bileşenleri için parlaklık tabanlı kontrast oranları.

Tasarım İnceleme Aracımız (/tools/design-audit) tarafından inceleme sonrasında gelen veriler üzerine bir değerlendirme içeriği yazılmıştır. Bu inceleme yazısındaki veriler aracımızdan gelmektedir ve nesneldir. Gelen nesnel verileri yorumladığımız içerikler kişisel görüş içerebilir..