Sober - Therapy App Landing page Template

Sober is a split-screen landing page template built for addiction and recovery digital therapy apps. It opens with a live impact calculator, escalates through a stats-driven scroll experience, and closes with an inline recovery assessment. The design uses a Healing Space visual identity, deep teal, cloud white, sage, and warm amber, to feel honest, warm, and immediately actionable.

by Rocket studio

Quick summary

Sober is a single-page, split-screen (50/50) landing page template designed for a direct-to-consumer addiction and recovery therapy app. It leads with a live cost calculator, builds an evidence wall of sobering statistics, and funnels visitors into a personalized inline assessment. Every design choice prioritizes emotional safety and forward momentum over clinical distance.

Who this template is for

This template is built for founders, product teams, and health entrepreneurs launching a digital recovery app. It speaks directly to the audience most likely to be searching at 3 AM, not browsing at noon.

  • Recovery app developers and digital health startups targeting adults in early or mid-recovery
  • Teams building cognitive behavioral therapy (CBT) platforms with licensed counselor access
  • Marketers converting high-shame, high-function users who respond to data rather than emotion alone

What problem this template solves

Most recovery app landing pages either feel sterile and clinical or lean too hard on emotional imagery. Neither approach earns trust from someone in a fragile moment. This template solves the gap between cold medical copy and manipulative guilt tactics.

  • Users in crisis need to see their own data, not stock photos of sunsets or sad faces
  • The template replaces generic benefit lists with live, personalized impact numbers and statistics
  • It removes friction from the most critical conversion: connecting someone to a counselor right now

What you get with this template

You get a fully structured, high-interactivity landing page with five distinct scroll sections, a live calculator, an inline assessment quiz, and a sticky call-to-action bar. Everything is wired for a mobile-first, emotionally intelligent recovery experience.

  • A split-screen hero with a real-time drink calculator and animated impact stats (liver recovery timeline, annual cost, hours lost, sober milestones)
  • A stats-first scroll wall pairing relapse research with specific app features, plus milestone badges and named testimonial blocks
  • An inline progressive assessment quiz with a personalized recovery roadmap and post-result email capture

Feature list

This template is built around high interactivity and deliberate emotional pacing. Each feature below is specified in the source brief.

Live Impact Calculator

The hero section includes a two-input slider tool. Visitors enter their daily drink count and years of use. The right panel instantly populates with personalized output: estimated liver recovery timeline, dollars spent annually, hours lost to hangovers, and projected sober milestones at 30, 90, and 365 days. All numbers animate upward in real time.

Stats-First Scroll Sections

Each scroll beat opens with a single large statistic on the left panel. Examples include "83% of relapses happen in the first 90 days" and the average emergency room cost for alcohol poisoning. The right panel then reveals the specific app feature designed to counter that statistic. Micro-animations trigger on viewport entry.

Inline Progressive Assessment Quiz

The primary call to action launches a quiz directly on the page, not a new tab or modal. Three gentle opening questions cover frequency, triggers, and previous attempts. A personalized recovery roadmap generates instantly, showing which app features match the visitor's specific risk profile. Email capture appears only after the visitor sees their results.

Sticky Call-to-Action Bar

After the third scroll section, a warm amber bar stays anchored at the bottom of the screen. It repeats the primary assessment prompt without interrupting the reading flow. The secondary path is a frictionless text link to direct counselor chat.

Testimonials with Milestone Badges

A dedicated section features named recovery stories with visible days-sober counts and counselor credentials. Social proof is grounded in specificity rather than vague endorsements, building trust at the point of highest hesitation.

Asymmetric Features Bento Grid

An asymmetric grid layout displays the app's full capability set in a single visual block. Each card maps to a distinct recovery tool, making it easy to scan the full offer without reading dense paragraphs.

Page sections overview

SectionPurpose
Hero CalculatorPersonalized live impact stats via drink slider
Stats WallRelapse data paired with CBT feature counters
Features Bento GridApp capabilities in asymmetric card layout
Testimonials BlockNamed recovery milestones and counselor credentials
Assessment Call to ActionInline quiz leading to personalized recovery roadmap
Footer RowSingle-row minimal footer with direct links

Design & branding system

The visual identity follows a Healing Space theme built on the Teal Catalyst color system. The palette is deliberately absent of clinical harshness, feeling instead like a recovery garden at early morning.

  • Deep therapeutic teal (#0D7377) anchors left panels and carries calm authority; cloud white (#F7FAFA) opens the right side with space and clarity; muted sage (#A3C4BC) surfaces secondary elements
  • Warm amber (#E8A838) is reserved exclusively for call-to-action buttons and progress indicators, creating forward motion without alarm
  • DM Sans handles all body text for clean readability; Fraunces display headlines give emotional weight to key statistics and section openers

Mobile & speed optimization

This template is built mobile-first. The 3 AM panic use case demands that every interaction work cleanly on a small screen with one thumb.

  • The live calculator sliders, sticky call-to-action bar, and inline assessment quiz are all optimized for touch input and small viewport layouts
  • Static sections use server-side rendering (SSR) while interactive components (calculator, quiz) run as isolated client islands to keep load behavior predictable
  • Scroll-triggered animations, counter tick-ups, and progress ring fills are staggered and viewport-aware, so they do not fire before the user reaches them

How this template helps you convert

The conversion architecture is built around reducing shame and removing friction at every decision point. The template guides visitors through three deliberate stages.

  1. The live calculator makes the cost of continuing personal and visible before any pitch is made, building internal motivation through the visitor's own numbers rather than external pressure.
  2. The stats wall creates an evidence sequence that escalates from personal cost to systemic reality, making the emotional case for the app without a single manipulative line of copy.
  3. The inline assessment delivers a personalized roadmap before asking for an email address, so the visitor receives value first, then chooses to continue the relationship on their own terms.

Other information about this template

This template covers a specific intersection of health, behavioral science, and conversion design. A few additional details are worth noting for buyers evaluating fit.

  • The template is localized for USA audiences, using USD pricing references and English-language copy structures throughout
  • Typography pairing (DM Sans body, Fraunces display) is pre-specified and contributes directly to the warm-but-authoritative tone
  • Animation intensity is set to high by design: counter tick-ups, progress ring fills, and staggered viewport reveals are all included as specified interactive behaviors
  • The footer follows a minimal single-row pattern, keeping the exit experience clean and uncluttered
  • This template is suited for recovery platforms, digital health apps, and therapy-adjacent products where trust-building must happen in the first few seconds of a visit
Sober - Therapy App Landing page Template
Sober - Therapy App Landing page Template
Sober - Therapy App Landing page Template
Sober - Therapy App Landing page Template

Theme

Healing Space

Creative direction

Stats-First Impact

Color system

Teal Catalyst

Style

Split Screen (50/50)

Direction

Quiz/Assessment

Page Sections

Live Drink Impact Calculator

Stats-first Scroll Wall

Inline Progressive Assessment

Sticky Amber Call to Action Bar

Testimonials with Milestone Badges

Asymmetric Features Bento Grid

Related questions

Can I adjust the calculator inputs and output stats?

Does the assessment quiz require a separate page or tool?

How is the email capture handled in the assessment flow?

Is the sticky call-to-action bar always visible after it appears?

Can this template work for a non-alcohol recovery use case?