add plans from usability testing: onboarding v2, notifications, live editor
All checks were successful
deploy / deploy (push) Successful in 1m7s

Onboarding UX v2 supersedes the original plan — reworks setup into a
single guided journey with progress bar, forgiving validation, and
contextual prompts for skipped steps.

Notification overhaul replaces floating toasts with inline feedback
and persistent top banners (110+ flash messages audited).

Live site editor is a design exploration for on-site editing with
contenteditable text and live CSS variable injection.

Also adds SEO settings and multiple providers to the roadmap.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey
2026-03-03 22:45:41 +00:00
parent 64f083d271
commit 2e5217b010
5 changed files with 536 additions and 92 deletions

View File

@@ -51,20 +51,59 @@ All 4 phases done. Tailwind utility clone deleted, all templates migrated to sem
| 70 | Margin guard on sales (prevent discounts that breach minimum profit threshold) | 69 | 1h | planned |
| 71 | Announcement bar (dismissable shop banner for active sales) | 69 | 1.5h | planned |
### Onboarding UX improvements ([plan](docs/plans/onboarding-ux.md))
### Onboarding UX v2 ([plan](docs/plans/onboarding-ux.md))
| # | Task | Priority | Est | Status |
|---|------|----------|-----|--------|
| 1 | Redirect to dashboard after wizard completion with welcome flash | High | 30m | planned |
| 2 | Add shipping setup to checklist, gate "Go live" on shipping existing | High | 1h | planned |
| 3 | Add shop settings to checklist (name, currency) | High | 45m | planned |
| 4 | Make checklist collapsible instead of dismissable | Medium | 15m | planned |
| 5 | Add test order guidance (test card number, what to expect) | Medium | 45m | planned |
| 6 | Skip completed wizard steps on revisit | Medium | 1h | planned |
| 7 | Better provider connection error messages with help links | Medium | 30m | planned |
| 8 | Add theme customisation tips to checklist | Low | 15m | planned |
| 9 | Smarter "Sync products" checklist link | Low | 15m | planned |
| 10 | Add email setup as optional checklist item | Low | 30m | planned |
Based on usability testing (March 2026). Reworks the entire setup flow into a single guided journey with progress bar, forgiving validation, and contextual prompts.
| # | Task | Est | Status |
|---|------|-----|--------|
| A | Simplify initial setup to account creation only (email, password, shop name) | 1.5h | planned |
| B | Guided setup flow with progress bar (multi-step, skippable, explains "why") | 4h | planned |
| C | Forgiving API key validation (strip whitespace, format checks, helpful errors) | 1.5h | planned |
| D | Email provider setup UX rework (recommended pick, grouping, guided flow, test email) | 2h | planned |
| E | Contextual prompts for skipped steps (products, checkout, order detail) | 2h | planned |
| F | Dashboard checklist and messaging rework | 2h | planned |
| G | Coming soon page fixes (logo layout, admin login link) | 30m | planned |
| H | External links UX (new tabs, icons, aria labels) | 1h | planned |
| I | Input styling — WCAG AA/AAA compliance | 1h | planned |
### Notification system overhaul ([plan](docs/plans/notification-overhaul.md))
Replace floating toast/flash messages with inline feedback and persistent top banners. 110+ flash messages across 28 files to migrate.
| # | Task | Est | Status |
|---|------|-----|--------|
| 1 | Build inline feedback component | 1.5h | planned |
| 2 | Build persistent top banner component (replaces flash) | 1.5h | planned |
| 3 | Migrate admin forms to inline feedback (theme, pages, settings, email, providers) | 3h | planned |
| 4 | Migrate remaining admin pages (media, products, activity, newsletter, redirects, nav) | 2h | planned |
| 5 | Migrate shop pages (cart, contact, checkout, auth) | 2h | planned |
| 6 | Migrate setup wizard notifications | 1h | planned |
| 7 | Remove old flash/toast CSS and JS | 30m | planned |
### Live site editor ([plan](docs/plans/live-site-editor.md))
On-site editing overlay for admins: browse the real shop with a sidebar for theme and page editing. Inline contenteditable for text, live CSS variable injection for theme changes. Responsive layout (split view on desktop, overlay on mobile).
| Phase | Description | Est | Status |
|---|---|---|---|
| 1 | Design: sketch approaches, pick one | 2h | planned |
| 2 | Extract shared components from theme editor and page editor | 4h | planned |
| 3 | Build editor wrapper LiveView with sidebar shell | 3h | planned |
| 4 | Theme editing in sidebar (re-use theme controls, live CSS vars) | 3h | planned |
| 5 | Block list and block settings in sidebar | 3h | planned |
| 6 | Block selection: click-to-select with highlight on page | 2h | planned |
| 7 | Inline text editing with contenteditable + phx-hook | 4h | planned |
| 8 | Responsive layout (split view / overlay) | 2h | planned |
| 9 | Save/discard/undo flow | 2h | planned |
| 10 | Edit mode toggle (floating button for admins on shop pages) | 1h | planned |
| 11 | Polish and testing | 4h | planned |
### Quick fixes (from usability testing)
| # | Task | Est | Status |
|---|---|---|---|
| 1 | Fix double radio button dots in theme editor | 30m | planned |
### Platform site
@@ -108,5 +147,7 @@ All plans in [docs/plans/](docs/plans/). Completed plans are kept as architectur
| [favicon.md](docs/plans/favicon.md) | Complete |
| [legal-page-generator.md](docs/plans/legal-page-generator.md) | Complete |
| [url-redirects.md](docs/plans/url-redirects.md) | Complete |
| [onboarding-ux.md](docs/plans/onboarding-ux.md) | Planned |
| [onboarding-ux.md](docs/plans/onboarding-ux.md) | Planned (v2) |
| [notification-overhaul.md](docs/plans/notification-overhaul.md) | Planned |
| [live-site-editor.md](docs/plans/live-site-editor.md) | Design exploration |
| [profit-aware-pricing.md](docs/plans/profit-aware-pricing.md) | Planned |