Skip to content

First-run guided tour for new users #36

@PhillyUrbs

Description

@PhillyUrbs

Summary

Add an in-dashboard guided tour the first time a user lands on the dashboard after setup. Walks through the key UI elements: per-child outfit panes, weather card, evening (PJ) mode, settings, theme toggle, and the dev-channel toggles (when applicable).

Why

Current flow is: finish setup wizard → land on a dashboard with no explanation. New users have to figure out the layout themselves.

Proposed approach

  • Vendor a small library like driver.js (~12 KB) or shepherd.js — both MIT, no runtime deps.
  • Trigger only when localStorage flag outfitpi_tour_seen is missing.
  • Steps point at real selectors so the screenshots stay accurate.
  • A 'Skip' button in the corner of every step.
  • Re-trigger from Settings via a 'Show tour again' button.

Acceptance criteria

  • Tour fires once on the first dashboard load after a fresh install.
  • All steps work in both light and dark themes.
  • No layout shift when the overlay appears.
  • Test added that asserts the tour is dismissed after one walkthrough.

Tracked: was item #7 from the GitHub-features brainstorm.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions