fix #8: Feature: Tutorial Mode - #42
Merged
Merged
Conversation
Add an interactive, first-run tutorial that walks new users through the core game loop and can be replayed from Settings. - components/TutorialOverlay.jsx: 6-step guided walkthrough (welcome, scenario presentation, first response, turn progression, scoring, and encouraging exploration) with a fixed sample scenario, an interactive response choice, a demo turn advance, and a sample score reveal. Steps are gated so users must interact before continuing (interactive, not passive). Includes skip/back/finish controls. - pages/simulation.jsx: launch the tutorial once for new users via the save-the-world:tutorial-status localStorage flag (SSR-safe, storage failures handled); add a Settings panel with a Replay Tutorial control; add a dismissible gameplay hint during play. - tests-e2e/tutorial.spec.js: hermetic regression suite covering all four acceptance criteria (first-time launch, interactive walkthrough, skip + replay from Settings, gameplay hint). - Legacy e2e specs (difficulty/mobile/save-resume/simulation) seed tutorial-status=completed so the first-run modal never intercepts post-onboarding gameplay flows. - .github/workflows/ci.yml: run the tutorial suite in the regressions job (3-job CI shape preserved; no code-graph job — repo has no graph). Closes #8 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #8
Summary
Adds an interactive first-run tutorial that teaches new users the core game loop, with a replay path from Settings and an in-game hint. Entirely client-side and static — no new dependencies, no backend changes.
What changed
components/TutorialOverlay.jsx(new) — 6-step guided walkthrough mapping 1:1 to the issue's tutorial flow: Welcome/overview → Scenario presentation → First response → Turn progression → Scoring → Encourage exploration. Includes a fixed sample scenario ("A coastal city has lost power…") with a predictable sample score (Impact 80 / Clarity 90 / Overall 85). Steps are gated (choose a response, advance the demo turn, reveal the score) so the tutorial is interactive rather than passive. Skip / Back / Finish controls;role="dialog" aria-modal="true".pages/simulation.jsx— launches the tutorial once for new users via thesave-the-world:tutorial-statuslocalStorage flag (read insideuseEffect, SSR/hydration-safe, storage failures caught); adds a Settings panel with a Replay Tutorial control; adds a dismissible gameplay hint shown during play.tests-e2e/tutorial.spec.js(new) — hermetic regression suite covering all four acceptance criteria.difficulty,mobile,save-resume,simulation) seedtutorial-status=completedso the first-run modal never intercepts post-onboarding gameplay flows..github/workflows/ci.yml— runs the tutorial suite in theregressionsjob. The repo's 3-job CI shape (unit-tests / regressions / build) is preserved; no code-graph job (repo has no graph).Acceptance criteria
Review pipeline
Implemented via four sequential fresh subagents — implementation+CI, code-review (mattpocock), code-simplifier, and Claude security review. No blockers found; security review reported zero new attack surface and zero new dependencies.
Verification (local, CI-equivalent)
npm run build: cleanmobile-chrome): 8 passedGraph status: N/A — repo has no graphify toolchain/
graphify-out/; 3-job CI shape unchanged.