onboard

Design onboarding flows with empty states, tooltips, and guided tours.

Updated May 16, 2025
One-click install
npx skills add https://github.com/range-et/slate --skill onboard-range-et
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: onboard
Source: https://github.com/range-et/slate/tree/main/.cursor/skills/onboard
Command: npx skills add https://github.com/range-et/slate --skill onboard-range-et

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Onboarding and first-use experiences often fail to teach value or guide users efficiently. This Skill provides a framework to design compelling onboarding flows, empty states, and contextual guidance that shorten time-to-value.

Core Features & Use Cases

  • Empty State Design: Create helpful empty states that propose actions and set expectations.
  • Progressive Onboarding: Introduce features gradually with contextual tooltips and guided tours.
  • First-Time Value: Ensure users reach value quickly through focused onboarding steps and templates.

Quick Start

Design a concise onboarding flow for a new product, including an empty state and a tooltip-guided tour.

Frequently Asked Questions about onboard

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design onboarding flows that shorten time-to-value for first-time users?

To design onboarding flows that shorten time-to-value, apply progressive onboarding patterns like empty states and contextual tooltips. This framework helps product teams guide users through focused steps, ensuring they reach core product value quickly across web and mobile apps.

What is progressive onboarding and when should I use contextual tooltips?

Progressive onboarding is a technique that introduces features gradually as users interact with the interface. You should use contextual tooltips and guided tours when users encounter complex features or empty states, preventing information overload while setting clear expectations.

What's the best way to design empty states that set expectations and propose actions?

The best way to design empty states is to provide clear calls to action and helpful guidance within the first-time user experience. This onboarding framework ensures empty states propose actionable next steps rather than just displaying placeholder text.

Can I use this onboarding framework for both web and mobile apps?

Yes, this onboarding framework supports best-practice patterns for both web and mobile apps. Product teams can apply these empty states, guided tours, and evaluation metrics across different platforms to standardize first-time user experiences.

How do I evaluate onboarding metrics to measure first-time user experience success?

You evaluate onboarding metrics by tracking time-to-value and user progression through the guided tour and empty state interactions. This Skill provides evaluation frameworks to measure how efficiently your onboarding design helps first-time users reach core product value.