3D Cohort Retention Skyline & Funnel Tunnel

Funnel Tunnel + Retention Skyline

Install → Signup 55%

Signup → First action 60%

First action → Purchase 22%

Daily churn (retention decay) 0.12

Converted users

–

Active cohorts

–

Day-7 retention

–

Day-30 retention

–

How it works

Users are instanced spheres flying down a tunnel through three gates — install→signup, signup→first action, first action→purchase — each gate rolling that stage's conversion rate the instant a user crosses its plane; failed rolls veer off and are tinted red. Every user who clears the last gate joins the current signup-week cohort; when a cohort closes it is added as a new column of instanced bars in the retention skyline, whose heights are recomputed every frame from a stretched-exponential decay model, so older columns visibly settle into their long-run shape while the newest column is still tall.

retention(t) = exp( −(t/τ)^p ),  τ = 1/churn,  p = 0.65
bar height(week, day) = retention(day) · maxHeight

Install → Signup / Signup → First action / First action → Purchase — the three gate probabilities; tightening one visibly thins the stream of spheres reaching the next ring.
Daily churn — steepens the skyline's slope from front (day 0) to back (day 60) row for every cohort column at once.
View toggle — swaps the camera between watching the funnel gates and orbiting the retention skyline.

Real-world relevance: this is the same two-view analytics stack product teams use — a live event funnel for onboarding health, and a cohort-retention grid for whether the users who do convert keep coming back.

User (in flight) Dropped at gate Retention bar

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