Touch Heatmap Tracker: Kernel Density Event Tracking

Event Stream

Tap rate 6.0 taps/s

Kernel bandwidth σ 3.5 px

Session decay half-life 12 s

Tap Distribution

Live Readouts

Total taps

Peak density

0.00

Screen coverage (cells > threshold)

0.0%

How it works

Mobile-analytics SDKs (Firebase, Amplitude, Hotjar-style session recorders) log every tap as a raw (x, y, t) event. A touch heatmap turns that event stream into a continuous surface with 2D kernel density estimation: each tap deposits a Gaussian "splat" on a grid, and overlapping splats sum into hot zones.

For a tap at (x0,y0), grid cell (x,y) gains:
  ΔI(x,y) = A · exp( -((x-x0)² + (y-y0)²) / (2σ²) )

Between ticks the whole grid decays exponentially
(a rolling session window, not infinite memory):
  I(x,y) ← I(x,y) · exp(-λ·dt),   λ = ln(2) / half-life

Tap rate — events/second arriving from the simulated user session, like DAU-scale interaction volume compressed into one screen.
Kernel bandwidth σ — how far a single tap's influence spreads on the grid; small σ shows exact touch points, large σ approximates finger/thumb contact area and produces smoother zones.
Decay half-life — how long a tap keeps contributing before the analytics window "forgets" it; short half-life shows only what's hot right now, long half-life approximates a cumulative session heatmap.
Realistic vs Uniform — realistic mode samples taps from three weighted UI zones (top search bar, center feed, bottom nav icons), the way real engagement clusters around interactive elements; uniform mode is the null model with no UX structure, for comparison.

Real-world relevance: this is the same aggregation mobile analytics platforms run over millions of raw touch events to answer "where do users actually tap" — informing button placement, nav-bar redesign and dead-zone detection.

Tap event ripple Cold Hot

⚠ Couldn't load the 3D engineThree.js failed to load from the CDN. Check your connection and reload.