Skip to content

First-time user onboarding tour for Stellar flows #60

Description

@truthixify

Tier: M (2-4 days) Type: ux

Context

feature

Scope

First-time visitors bounce because there's no "what am I supposed to do here" guidance. Add a dismissible 5-step tour with restart option.

Acceptance criteria

  • Library: shepherd.js or driver.js (≤ 10 KB gzipped)
  • 5 steps: header context, post-connect explanation, send page intro, amount input intro, submit context
  • Persist completion in localStorage; never re-fires automatically
  • "Take the tour" link in footer to restart
  • Keyboard-navigable, Esc dismisses, respects prefers-reduced-motion
  • All copy in src/i18n/en.json

Files to start with

  • Tour functional with all 5 steps
  • Dismiss + restart
  • Persistence verified
  • A11y verified manually
  • Playwright test for happy-path completion

Why this matters

  • New: src/components/OnboardingTour.tsx
  • src/App.tsx

Metadata

Metadata

Assignees

Labels

Stellar WaveIssues in the Stellar wave programdripsFunded via Drips NetworkfeatureNew feature workhelp wantedExtra attention is neededstellarTouches Stellar / Soroban codeuxUser experience

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions