Headspace design examples

Headspace

Sign-in screen where the user authenticates with their email and password or via a Facebook social login.

• Sign In

Headspace

Password recovery screen where the user enters their email address to receive a password reset link.

• Forgot Password

Headspace

Landing page where the user signs up for a 10-day free trial using their email or Facebook account.

Headspace

Onboarding screen where the user is welcomed by a character illustration and prompted to start a product tour via a carousel.

• Welcome
• Guided Tour

Headspace

Home screen where the user views their meditation timeline, tracks progress, and is prompted to start their next session or subscribe.

• Onboarding Checklist

Headspace

Onboarding step where the user navigates a carousel explaining the series library and meditation packs.

• Getting Started
• Guided Tour

Headspace

App section discovery view where the user can browse through features like the Singles library via a carousel.

• Browse

Headspace

Onboarding product tour step explaining the Account section where users can manage profile settings, billing, and subscriptions.

• Getting Started
• Account Settings

Headspace

Onboarding step where the user finishes the product tour and is prompted to begin their first meditation session.

• Guided Tour
• Welcome

Headspace

Detail page where the user plays a 10-minute Level 1 session, featuring a central circular progress timer and pause controls.

• Timer
• Audio Player

Headspace

Home screen displaying the user's meditation progress along a gamified timeline with a prompt to start the next session.

• Timeline
• Progress

Headspace

List view where the user browses meditation courses categorized by themes like Foundation, Health, and Relationships, with advanced levels locked behind a subscription.

• Browse
• Feature Gate