UI (User Interface — Kullanıcı Arayüzü) bir dijital ürünün görsel ve etkileşim katmanını (renkler, tipografi, butonlar, ikonlar, ekran düzeni) ifade eder. UX (User Experience — Kullanıcı Deneyimi) kullanıcının ürünle tüm yolculuğunu ve hissettiklerini kapsar (kolay mı, akıcı mı, hedefe ulaştırıyor mu?). UX strateji + araştırma, UI ise görsel uygulamadır — ikisi bir arada çalıştığında dijital ürün başarılı olur.
UX (kullanıcı deneyimi) nedir?
Kısa cevap: UX (User Experience), bir kullanıcının bir ürün/sistem/hizmetle etkileşiminin tamamıdır. Web sitesi bağlamında UX; kullanıcının hedefine ulaşma kolaylığı, akış mantığı, engellerin olmaması ve genel duygusal sonucudur. UX tasarımcısı "kullanıcı amacına ulaştı mı, ne hissetti?" sorularını çözmeye odaklanır.
UX — User Experience — bir kullanıcının bir ürünle, sistemle veya hizmetle etkileşiminin tamamını kapsayan deneyimdir. Web sitesi bağlamında UX, ziyaretçinin siteye girdiği andan ayrıldığı ana kadar yaşadığı her şeyi kapsar.
UX tasarımcısının soruları şunlardır:
- Kullanıcı hedefine ulaşabiliyor mu? Randevu almak, ürün bulmak, iletişime geçmek — kolay mı?
- Akış mantıklı mı? Kullanıcı bir sonraki adımı sezgisel olarak bulabiliyor mu?
- Engeller var mı? Karmaşık formlar, kafa karıştırıcı menüler, yavaş yükleme süreleri?
- Kullanıcı memnun ayrılıyor mu? Deneyim olumlu bir izlenim bırakıyor mu?
Bir restoran benzetmesi yapalım: UX, restoranın konumu, park yeri, menü düzeni, garsonun hızı, yemeğin sıcaklığı ve hesap ödeme kolaylığı gibi deneyimin tamamıdır.
UI (kullanıcı arayüzü) nedir?
Kısa cevap: UI (User Interface), kullanıcının doğrudan etkileşimde bulunduğu görsel ve interaktif tüm öğelerin tasarımıdır. Renk paleti, tipografi, butonlar, ikonlar, boşluklar, etkileşim animasyonları, ekran düzeni — kullanıcının gördüğü ve dokunduğu her şey UI kapsamındadır. UI tasarımcısı görsel hiyerarşi, tutarlılık ve estetik tasarım kararlarını verir.
UI — User Interface — kullanıcının doğrudan etkileşimde bulunduğu görsel ve interaktif öğelerin tasarımıdır. Renkler, butonlar, ikonlar, tipografi, boşluklar, animasyonlar — kullanıcının gördüğü ve dokunduğu her şey UI kapsamındadır.
UI tasarımcısının soruları şunlardır:
- Görsel hiyerarşi doğru mu? Kullanıcı önce neyi görmeli, sonra neyi?
- Butonlar anlaşılır mı? Tıklanabilir öğeler tıklanabilir görünüyor mu?
- Renkler ve kontrastlar yeterli mi? Metinler rahat okunuyor mu?
- Tutarlılık var mı? Aynı tür öğeler her yerde aynı görünüyor mu?
Restoran benzetmesiyle: UI, masanın düzeni, tabak tasarımı, yemeğin sunumu, menü kartının fontu ve aydınlatmanın rengidir.
UI ve UX arasındaki temel farklar nelerdir?
Kısa cevap: UX deneyimin tamamına (nasıl hissettiriyor), UI görsel tasarıma (nasıl görünüyor) odaklanır. UX araştırma + bilgi mimarisi + kullanıcı akışı + test ile çalışır; UI renk + tipografi + ikon + buton + layout ile çalışır. UX'in çıktısı wireframe + prototip, UI'nin çıktısı yüksek çözünürlüklü mockup + stil kılavuzudur.
İki kavramı karıştırmamak için temel farklara bakalım:
| Boyut | UX (Kullanıcı Deneyimi) | UI (Kullanıcı Arayüzü) |
|---|---|---|
| Odak | Deneyimin tamamı — nasıl hissettiriyor? | Görsel tasarım — nasıl görünüyor? |
| Kapsam | Araştırma, bilgi mimarisi, kullanıcı akışı, test | Renk, tipografi, ikon, buton, layout |
| Soru | "Kullanıcı amacına ulaştı mı?" | "Kullanıcı burada ne görmeli?" |
| Araçlar | Wireframe, kullanıcı testi, ısı haritası, anket | Figma, renk paleti, grid sistemi, stil kılavuzu |
| Çıktı | Kullanıcı akış şeması, wireframe, prototip | Yüksek çözünürlüklü mockup, stil kılavuzu |
Bir benzetme: UX bir evin planı ve akışı (odaların yeri, kapı genişlikleri, merdiven sayısı), UI ise evin iç dekorasyonu (duvar rengi, mobilya stili, aydınlatma armatürleri). Plan kötüyse dekorasyon kurtarmaz; plan iyiyse dekorasyon deneyimi taçlandırır.
UI ve UX neden birlikte olmalı?
Kısa cevap: Sadece bir tarafa odaklanmak yetersiz kalır. İyi UX + kötü UI = işlevsel ama profesyonel görünmeyen site. Kötü UX + iyi UI = güzel ama kullanılamaz site. İyi UX + iyi UI ise dönüşüm, sadakat ve marka algısını birlikte güçlendiren bütünsel bir deneyim üretir. İkisi ayrı disiplinler ama bir ürünün iki yüzüdür.
İyi UX + kötü UI = işlevsel ama çirkin bir site. Kullanıcılar güvenmez, profesyonel algılanmaz.
Kötü UX + iyi UI = güzel ama kullanılamaz bir site. Kullanıcılar kaybolur, hızla terk eder.
İyi UX + iyi UI = hem işlevsel hem estetik bir site. Kullanıcılar kalır, dönüşür, geri gelir.
UI/UX'in Etkisi
- İlk izlenim: Kullanıcılar bir web sitesi hakkında ilk birkaç yüz milisaniyede karar verir; bu kısa süre büyük ölçüde görsel — yani UI tarafından şekillenir[1]
- Dönüşüm etkisi: İyi UX tasarımı, kullanıcı sürtünmesini azaltarak dönüşüm oranlarını belirgin şekilde artırabilir; sektör araştırmaları büyük katlamalar dahi mümkün olabildiğini gösterir[2]
- Terk oranı: Kötü kullanıcı deneyimi yaşayan ziyaretçilerin çoğunluğu siteyi tekrar ziyaret etmez
- ROI: Nielsen Norman Group ve Forrester gibi araştırma kuruluşlarına göre UX yatırımının ROI'si yüksek katlardadır[3]
- Mobil deneyim: Mobilde kötü deneyim yaşayan kullanıcılar markayı çevrelerine önermekten kaçınır
Kullanıcı araştırmasından görsel tasarıma, stratejiden uygulamaya — bütünsel UI/UX hizmeti.
İyi ve kötü UI/UX örnekleri nelerdir?
Kısa cevap: Kötü UX örnekleri: karmaşık navigasyon (7+ menü, 3 kademe alt menü), uzun formlar (15+ alan), gizli iletişim bilgileri, yavaş yükleme, pop-up bombardımanı. Kötü UI örnekleri: düşük kontrastlı metin, tutarsız buton stilleri, çok küçük dokunma alanları (mobilde 20x20px), aşırı animasyon ve klişe stok fotoğraflar.
Kötü UX Örnekleri
- Karmaşık navigasyon: 7+ ana menü öğesi, 3 kademe alt menü, kullanıcı aradığını bulamıyor
- Uzun formlar: İletişim formu için 15 alan doldurmak — çoğu gereksiz
- Gizli iletişim bilgileri: Telefon numarası footer'ın en altında, küçük fontla
- Yavaş yükleme: 5+ saniye yükleme süresi — ziyaretçilerin %53'ü 3 saniyede ayrılır
- Pop-up bombardımanı: Sayfa açılır açılmaz 3 farklı pop-up
Kötü UI Örnekleri
- Düşük kontrast: Açık gri arka plan üzerinde açık gri metin — okunamaz
- Tutarsız stiller: Her sayfada farklı buton rengi ve boyutu
- Çok küçük tıklama alanları: Mobilde 20x20px butonlar — tıklanamaz
- Aşırı animasyon: Her öğe zıplıyor, dönüyor, parlıyor — dikkat dağıtıcı
- Stok fotoğraf klişeleri: "Tokalaşan iş insanları", "dizüstü bilgisayara bakan kadın" — güven kırmaz
UI/UX işletme sonuçlarına nasıl etki eder?
Kısa cevap: İyi UI/UX dört temel iş metriğini doğrudan etkiler: dönüşüm oranı (basitleşen akış ve belirgin CTA), müşteri edinme maliyeti (CAC) (organik tavsiye artışı reklam ihtiyacını düşürür), müşteri yaşam boyu değeri (LTV) (sadakat artar), destek maliyeti (sezgisel arayüz "nasıl yapacağım" sorularını azaltır).
UI/UX sadece "güzel görünmek" veya "kolay kullanmak" değil — doğrudan gelire etki eder:
Dönüşüm Oranı
Karmaşık bir satın alma sürecini basitleştirmek (UX) ve "Satın Al" butonunu daha belirgin yapmak (UI), dönüşüm oranını doğrudan artırır. Amazon'un "1-Click" butonunun milyarlarca dolarlık gelir artışı sağladığı iyi bilinen bir gerçektir.
Müşteri Edinme Maliyeti
İyi UX, organik kullanıcı tavsiyelerini artırır. Memnun bir kullanıcı, sitenizi çevresine önerir. Bu, ücretli reklam maliyetlerini düşürür ve müşteri edinme maliyetini (CAC) azaltır.
Müşteri Yaşam Boyu Değeri
Olumlu bir dijital deneyim, müşteri sadakatini güçlendirir. Kullanıcılar tekrar gelir, daha fazla satın alır ve marka elçisi olur. Bu, müşteri yaşam boyu değerini (LTV) artırır.
Destek Maliyetleri
Sezgisel bir arayüz, "Nasıl yapacağım?" sorularını azaltır. Müşteri destek taleplerinin önemli bir kısmı kötü UX'ten kaynaklanır. İyi UX = daha az destek bileti = düşen operasyonel maliyet.
UI ve UX tasarım süreci nasıl işler, hangi araçlar kullanılır?
Kısa cevap: UX süreci: araştırma → bilgi mimarisi → wireframe → prototip → kullanıcı testi. UI süreci: stil kılavuzu → bileşen tasarımı → yüksek çözünürlüklü mockup → responsive uyarlama → etkileşim animasyonları. Yaygın araçlar: Figma (sektör standardı), Sketch, Adobe XD, prototip için ProtoPie/Framer, UX araştırma için Maze, Hotjar, FullStory.
UX Tasarım Süreci
- 1. Araştırma: Kullanıcı mülakatları, anketler, rakip analizi, persona oluşturma
- 2. Bilgi Mimarisi: Site haritası, içerik hiyerarşisi, navigasyon yapısı
- 3. Wireframe: Düşük detaylı sayfa iskeletleri — içerik yerleşimi ve akış
- 4. Prototip: Tıklanabilir wireframe'ler — kullanıcı testi için
- 5. Kullanıcı Testi: Gerçek kullanıcılarla test, sorunları tespit ve düzeltme
UI Tasarım Süreci
- 1. Stil Kılavuzu: Renk paleti, tipografi, ikon stili, boşluk sistemi
- 2. Bileşen Tasarımı: Butonlar, kartlar, formlar, menüler — her öğe tek tek
- 3. Yüksek Çözünürlüklü Mockup: Piksel-perfect sayfa tasarımları
- 4. Responsive Uyarlama: Masaüstü, tablet ve mobil versiyonlar
- 5. Etkileşim Tasarımı: Hover, tıklama, geçiş animasyonları
Web sitemin UI/UX'i nasıl iyileştirebilirim?
Kısa cevap: Hemen uygulanabilecek adımlar: Google Analytics ile kullanıcı yolculuğunu izleyin, telefonu header'da tıklanabilir yapın, formları minimum alana indirin, CTA'ları belirginleştirin, sitenizi kendi mobiliniz üzerinden manuel test edin, PageSpeed Insights ile hızı kontrol edin ve Hotjar/Microsoft Clarity ile ısı haritası kurun.
Web sitenizin UI/UX kalitesini artırmak için hemen uygulayabileceğiniz adımlar:
- Kullanıcılarınızı gözlemleyin: Google Analytics ile hangi sayfalarda kaybolduklarını görün
- Telefon numaranızı görünür yapın: Header'da, mobilde tıklanabilir
- Formları kısaltın: Sadece gerçekten ihtiyacınız olan bilgileri isteyin
- CTA'ları belirginleştirin: "Teklif Al" butonu ilk bakışta görülebilmeli
- Mobilde test edin: Sitenizi kendi telefonunuzdan kullanmayı deneyin — zorluk çekiyor musunuz?
- Hız kontrolü yapın: Google PageSpeed Insights ile sitenizi test edin
- Isı haritası kullanın: Hotjar veya Microsoft Clarity ile kullanıcıların nereye tıkladığını görün
Araştırma tabanlı, dönüşüm odaklı arayüz tasarımı.
UI/UX ilkelerine dayanan, özel kodlanmış web siteleri.
Sonuç: UI + UX = dijital başarı
UI ve UX birbirinden ayrılamaz. Biri olmadan diğeri eksik kalır. Güzel ama kullanılmaz bir site de, kullanışlı ama çirkin bir site de başarısız olur.
Dijital dünyada rekabet etmek istiyorsanız, hem kullanıcınızın ihtiyacını anlayan (UX) hem de bu ihtiyacı estetik ve sezgisel bir şekilde sunan (UI) bir web sitesine ihtiyacınız var.
Sıkça Sorulan Sorular
UI ve UX arasındaki fark nedir?
UI (User Interface — Kullanıcı Arayüzü), bir dijital ürünün görsel ve etkileşim katmanını (renkler, tipografi, butonlar, ikonlar, ekran düzeni) ifade eder. UX (User Experience — Kullanıcı Deneyimi), kullanıcının ürünle tüm yolculuğunu ve hissettiklerini kapsar (kolay mı, akıcı mı, hedefe ulaştırıyor mu?). UX strateji + araştırma, UI ise görsel uygulamadır.
UI ve UX aynı kişi tarafından mı yapılır?
Küçük projelerde aynı tasarımcı her ikisini de üstlenebilir; ancak büyük ekiplerde UX araştırmacısı/tasarımcısı (kullanıcı testi, akış haritası, wireframe) ile UI tasarımcısı (görsel sistem, etkileşim animasyonları, component kütüphanesi) ayrı disiplinler olarak çalışır. Her iki rolün de aynı tasarım dosyalarında yakın işbirliği yapması ürün kalitesini doğrudan etkiler.
İyi UX'in işletmeye doğrudan etkisi nedir?
İyi UX; dönüşüm oranını artırır (formlar tamamlanır, satın alma akar), bounce rate'i düşürür (kullanıcı sitede kalır), müşteri destek talebini azaltır (kullanıcı kendi başına çözer), marka algısını güçlendirir ve müşteri sadakatini artırır. Nielsen Norman Group ve Forrester araştırmaları UX yatırımının yüksek ROI getirdiğini gösteriyor.
UI tasarımı hangi araçlarla yapılır?
2026'da en yaygın UI tasarım araçları: Figma (de facto standart, web tabanlı, gerçek zamanlı işbirliği), Sketch (Mac'e özel), Adobe XD ve Adobe Creative Suite, prototip için ProtoPie veya Framer, design system yönetimi için Tokens Studio ve Specify. UX araştırma için Maze, Hotjar, FullStory, Lookback yaygındır.
Web sitesi için önce UI mi UX mi yapılır?
Profesyonel yaklaşımda her zaman önce UX gelir: kullanıcı araştırması, persona, kullanıcı akışı (user flow), bilgi mimarisi, wireframe (kaba taslak ekran düzeni). UX onaylandıktan sonra UI başlar: renk, tipografi, görsel detay, animasyon. UX olmadan yapılan UI "güzel ama işe yaramaz" tasarımlar üretir.
Kaynaklar
- Nielsen Norman Group — kullanıcıların ilk izlenim ve dwell time araştırmaları: nngroup.com
- Forrester Research — UX yatırımının dönüşüm oranı üzerindeki etkisi raporları: forrester.com
- Forrester / Nielsen Norman Group — UX ROI çalışmaları: nngroup.com/articles/return-on-investment
Not: UX/UI iyileştirmeleri sektör, mevcut kullanıcı tabanı ve ürün karmaşıklığına göre farklı sonuçlar verir. Bu yazıdaki etki referansları genel araştırma bulgularına dayanır; spesifik bir sıralama veya dönüşüm garantisi vermez. Sitenize özel UX denetimi için LimeGraf iletişim formunu kullanabilirsiniz.
Web sitenizin UI/UX kalitesini profesyonel gözle değerlendirelim. Kullanıcı deneyimi denetimi ve iyileştirme önerileri için bizimle iletişime geçin. Ücretsiz UX denetimi talep edin →