Uygulama analitiğinde ısı haritaları: nedir, türleri ve çalışma prensibi

Isı haritası nedir?

Isı haritası, metrik değerlerinin renklerle gösterildiği bir veri görselleştirme yöntemidir: mavi veya yeşilden (minimum aktivite) sarıdan kırmızıya (maksimum aktivite). Mobil analitik bağlamında, heatmap kullanıcıların en sık hangi arayüz öğelerine tıkladığını ve hangilerinin fark edilmediğini gösterir.

Sayısal raporların aksine, isı haritası davranış kalıplarının anında görsel olarak anlaşılmasını sağlar. NN Group (2024)'e göre, isı haritaları tablo verilerine kıyasla kullanıcı davranışı analiz süresini %60 oranında azaltır. Bu, onları UX araştırmacıları ve ürün tasarımcıları için vazgeçilmez bir araç haline getirir.

Analitikte isı haritası türleri

Click Heatmap (tıklama haritası)

Click Heatmap en yaygın türdür ve ekrandaki dokunma noktalarını ve tıklamaları görüntüler. Renk ne kadar sıcaksa, o bölgede o kadar fazla etkileşim vardır. Hipotezleri test etmek için kullanılır: bir “Satın Al” düğmesi soğuk bir bölgedeyse, daha yukarı taşınması veya tasarımının değiştirilmesi gerekir. Click Heatmap ayrıca sahte tıklamaları da ortaya çıkarır — kullanıcılar tepki bekleyerek tıklanamayan öğelere tıkladığında.

Scroll Heatmap (kaydırma haritası)

Scroll Heatmap, kullanıcıların yüzde kaçının bir ekran veya sayfanın her bölümüne kadar kaydırdığını gösterir. Üst kısım %100'dür ve aşağı indikçe azalır. Ekran yüksekliğinin %50'sinde kullanıcıların %30'undan azı kalırsa, kritik içerik daha yukarı taşınmalıdır. Crazy Egg (2024)'e göre, uzun formlara sahip mobil uygulamalarda kullanıcıların %65'i ilk ekranın altına kaydırmaz.

Move Heatmap (hareket haritası)

Move Heatmap fare imleci hareketinin yörüngesini (masaüstünde) izler. Nielsen Norman Group araştırmaları, imleç hareketi ile kullanıcının bakış yönü arasında yüksek bir korelasyon (0,85–0,90) göstermektedir. Mobil uygulamalarda bunun karşılığı dokunma haritalarıdır ve yalnızca tıklamaları değil, aynı zamanda uzun basış ve kaydırmaları da gösterir.

Isı haritaları nasıl çalışır

Bir isı haritasının çalışma prensibi, kullanıcının ekranla her etkileşiminin koordinatlarının toplanmasına dayanır. Analitik platformunun (Hotjar, Smartlook, UXCam) SDK'sı, ekran çözünürlüğü ve cihaz türüyle birlikte her tıklama veya dokunmanın X ve Y koordinatlarını kaydeder. Bu veriler toplanır ve bir ekran görüntüsünün üzerine katman olarak yerleştirilir.

Renk gösterimi bir gradyan kullanır: maviden (maksimum etkileşim sayısının %0–5'i) yeşil ve sarıdan kırmızıya (%95–100). Her nokta bir veya daha fazla etkileşimi temsil eder. Modern platformlar, bir alanın üzerine gelindiğinde tıklamaların mutlak sayılarını da gösterir.

Güvenilir veriler için sayfa veya ekran başına en az 100–200 oturum gerekir. Hotjar (2025)'e göre, 500 oturum %5'ten az hata payı sağlar ve tasarım kararları için istatistiksel olarak anlamlı kabul edilir.

Isı haritası verileri nasıl kullanılır

Isı haritası verileri üç senaryoda kullanılır: dönüşüm optimizasyonu, kullanılabilirlik iyileştirmesi ve tasarım kararlarının doğrulanması. İlk durumda, bir heatmap kullanıcıların CTA düğmesine tıklayıp tıklamadığını gösterir — tıklamıyorlarsa, düğme daha yukarı taşınır veya rengi değiştirilir. İkincisinde, kullanıcıların yanlışlıkla etkileşimli sandığı öğeler belirlenir.

Doğrulama senaryosunda, bir ekran yeniden tasarımından önceki ve sonraki isı haritalarını karşılaştırın. Sıcak bölge hedef öğeye (örneğin, “Sepete Ekle” düğmesi) kaymışsa, yeniden tasarım başarılıdır. VWO (2024)'ye göre, heatmap verilerine dayalı A/B testlerinin %70'i dönüşümde istatistiksel olarak anlamlı bir iyileşme gösterir.

Yalnızca isı haritalarına güvenmeyin — bunları oturum kayıtları ve nicel analitikle birleştirin. Heatmap “nereyi” gösterir ancak “neden” sorusunu yanıtlamaz — bunun için nitel davranış analizi gerekir.

Mobil ve masaüstü uygulamalar için isı haritaları

Mobil isı haritaları birkaç parametrede masaüstü olanlardan farklıdır. Mobil cihazlarda imleç bulunmadığından, Move Heatmap'in yerini Touch Heatmap — dokunma haritası alır ve ayrıca basınç kuvvetini (3D Touch) ve süreyi kaydeder. Mobil cihazlarda Scroll Heatmap, sınırlı ekran boyutu nedeniyle kritik öneme sahiptir: “katlanma çizgisinin altındaki” (below the fold) içerik, kullanıcıların %70'i tarafından görülmeyebilir.

Masaüstü isı haritaları, imleç hareketini dikkat için bir vekil olarak kullanır — imleç konumu ile bakış odağı arasındaki korelasyon Nielsen Norman Group'a göre 0,85'e ulaşır. Mobil cihazlarda böyle bir korelasyon yoktur, bu nedenle dikkat analizi için göz izleme haritaları veya uzun basış haritaları kullanılır. UXCam (2024)'e göre, mobil heatmap'ler, ekran boyutlarının değişkenliği nedeniyle istatistiksel anlamlılık için %40 daha fazla oturum gerektirir.

Platformlar arası bir uygulama için isı haritaları ayarlarken, iOS ve Android için ayrı heatmap'ler oluşturun — gezinme farklılıkları (hareketler vs düğmeler) tıklama dağılımını kökten değiştirebilir. Ayrıca işletim sistemi sürümüne göre filtreleyin: Android 12+ üzerinde Material You ile arayüz öğeleri, Android 11'den farklı görünebilir ve konumlanabilir.

Isı haritası uygulama örneği

Android'deki bir mobil uygulamada tıklamaları izlemek için aşağıdaki Kotlin kodunu kullanın. Dokunma koordinatlarını yakalar ve bir isı haritası oluşturmak için analitik sistemine gönderir.

class HeatmapTracker {
    fun trackEvent(activity: Activity) {
        activity.window.decorView.setOnTouchListener { _, event ->
            if (event.action == MotionEvent.ACTION_UP) {
                val bundle = Bundle().apply {
                    putFloat("x", event.x)
                    putFloat("y", event.y)
                    putInt("screen_width", resources.displayMetrics.widthPixels)
                }
                Firebase.analytics.logEvent("touch_heatmap", bundle)
            }
            false
        }
    }
}

Verileri topladıktan sonra, bir BI aracında isı haritası oluşturun veya otomatik görselleştirme için UXCam gibi hazır bir platform kullanın.

Isı haritası platformlarının karşılaştırılması

Isı haritası platformları işlevsellik, fiyat ve mobil SDK'larla entegrasyon derinliği açısından farklılık gösterir. Hotjar, basit bir arayüze ve günlük 35 oturuma kadar ücretsiz plana sahip web heatmap'leri için en popüler araçtır. Ancak Hotjar, mobil uygulamaları desteklemez — yalnızca web sürümleri ve PWA'lar. Mobil uygulamalar için yerel SDK'larla Smartlook veya UXCam kullanın.

UXCam, mobil heatmap'lerde liderdir: Android ve iOS, cihaz sınıfına göre otomatik filtreleme, A/B testleri için katman modu ve ML anomali tespitini destekler. Smartlook, Growth planında sınırsız kayıt sunar ve tek bir projede hem mobil hem de web heatmap'lerini destekler. Microsoft Clarity, sınırsız trafiğe sahip web projeleri için ücretsiz bir alternatiftir, ancak mobil SDK desteği yoktur.

Bir platform seçerken, veri güncelleme sıklığını, filtreleme derinliğini ve özel analitik için ham tıklama koordinatlarını dışa aktarma yeteneğini göz önünde bulundurun. G2 Reviews (2025)'e göre, UXCam mobil heatmap çözümleri arasında en yüksek puanları (4,6/5) alırken, Hotjar web çözümleri arasında (4,4/5) almaktadır.

Isı haritası analizinde yaygın hatalar

İlk hata, cihaza göre filtreleme yapmadan bir isı haritasını analiz etmektir. Ekran çözünürlüğü, öğelerin konumlandırılmasını büyük ölçüde etkiler: iPhone 15 Pro'da üstte olan, bütçe dostu bir Android cihazda ortada olabilir. Heatmap'leri her zaman cihaz modeline veya ekran boyutuna göre filtreleyin.

İkinci hata, mutlak ve göreceli tıklama sayılarını karıştırmaktır. Kırmızı bir bölge, yüksek dönüşümden değil, öğenin ekranın %50'sini kaplamasından dolayı sıcak olabilir. Rengin öğe boyutuna göre yüzdeyi gösterdiği normalleştirilmiş isı haritaları kullanın.

Üçüncü hata, ekranda geçirilen süreyi görmezden gelmektir. Kullanıcılar bir ekranda az zaman harcıyorsa, isı haritası kötü tasarımdan değil, düşük ilgiden dolayı “soğuk” olacaktır. Heatmap'leri etkileşim metrikleriyle — Time on Screen ve Session Duration — birlikte analiz edin.