devmethod-ai 0.3.0 → 0.3.1

package/README.md

@@ -4,12 +4,14 @@ From idea to delivery with your AI coding agents.
 
 [![npm](https://img.shields.io/npm/v/devmethod-ai?label=npm)](https://www.npmjs.com/package/devmethod-ai) [![license](https://img.shields.io/npm/l/devmethod-ai)](LICENSE) [![platform tests](https://github.com/montassarkhalloufi/DevMethod/actions/workflows/platform-tests.yml/badge.svg)](https://github.com/montassarkhalloufi/DevMethod/actions/workflows/platform-tests.yml)
 
-## Watch DevMethod build Lisière — 2 min 58 s
+## Watch DevMethod build Lisière, then inspect a review — 4 min 03 s
 
-[![Play the 4K demo: approved master and derived Lisière screens](docs/media/visual-chain/video-preview.jpg)](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/devmethod-du-besoin-au-produit-4k.fr.mp4)
+[![Play the extended 4K demo: Lisière and the review interface](https://raw.githubusercontent.com/montassarkhalloufi/DevMethod/main/docs/media/visual-chain/video-preview.jpg)](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/devmethod-du-besoin-au-produit-4k.fr.mp4)
 
 **[▶ Watch the video — 4K, French narration](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/devmethod-du-besoin-au-produit-4k.fr.mp4)** · [Subtitles and execution evidence](docs/media/visual-chain/README.md) · [Download the working prototype](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/lisiere-visual-source.zip)
 
+**Existing Lisière film, extended with the new review interface.** The original footage is retained, with an added narrated chapter showing real interface captures and a clearly fictional review example.
+
 **Concrete example: Lisière, a personal reading library.** Start with an idea, compare three visual directions, approve a master screen, derive the other screen images, choose a suitable architecture, then build and verify the application.
 
 | Step shown | Concrete result |
@@ -19,6 +21,7 @@ From idea to delivery with your AI coding agents.
 | Architecture | HTML/CSS/JavaScript, testable book rules and browser-local storage |
 | Plan, ready and implement | Working form, filters, status changes and saved books |
 | Review and verify | Corrected alert/focus behavior, 6 tests and real Chrome desktop/mobile journeys |
+| New review chapter | Find and filter findings, inspect evidence/corrections, distinguish coverage, inspect sources and export |
 | Integrate and handoff | Local prototype, references, evidence and resumption context |
 
 The video uses illustrative Codex commands with real generated images and recorded application interactions. DevMethod guides the coding agent; image generation requires an available host tool. The visual workflow is included in npm 0.2.0. [Follow the visual workflow](docs/VISUAL-WORKFLOW.md).
@@ -29,7 +32,7 @@ DevMethod is the public name of the kit. Its entry-point skill remains `project-
 
 A reusable workflow for taking a software project from exploration to delivery: decisions, UX, architecture, tickets, development, tests, review and handoff. Six focused skills support fourteen workflow stages, each ending with evidence, limitations and one suggested next command.
 
-**DevMethod 0.3.0.** [Changes, migration and verification limits](docs/RELEASE-0.3.0.md). This release adds proportionate research, explicit architecture decisions, delivery-scope discussion linked mission/ticket templates, and a functional browser review viewer. Check the registry and GitHub release for publication evidence.
+**DevMethod 0.3.1.** [Documentation and film update](docs/RELEASE-0.3.1.md) · [0.3 workflow changes](docs/RELEASE-0.3.0.md). This release adds proportionate research, explicit architecture decisions, delivery-scope discussion, linked mission/ticket templates, and a functional browser review viewer. Check the registry and GitHub release for publication evidence.
 
 For developers and small teams using coding agents in new or existing repositories. Requires Node.js 22+ and npm; Git is required for context provenance. Application examples have separate framework/database prerequisites. DevMethod records scope, decisions and verification; it does not certify agent output, infer all dependencies, deploy applications or run an autonomous backlog. Installation and deterministic fixture results are separate from native host validation. See [compatibility](COMPATIBILITY.md).
 
@@ -40,18 +43,18 @@ Start with [missions and the tested source quick start](docs/MISSIONS.md), the [
 Requires Node.js 22+ and npm. Install into a fresh staging directory first:
 
 ```bash
-npx --yes devmethod-ai@0.3.0 init --tool codex --dest ../foundation-staging
+npx --yes devmethod-ai@0.3.1 init --tool codex --dest ../foundation-staging
 ```
 
 Choose `codex`, `claude` or `cursor`. If you omit `--tool`, an interactive terminal asks. For example:
 
 ```bash
-npx --yes devmethod-ai@0.3.0 init --tool claude --dest ../foundation-staging --dry-run
+npx --yes devmethod-ai@0.3.1 init --tool claude --dest ../foundation-staging --dry-run
 ```
 
 Remove `--dry-run` to write. Select a subset with `--modules decision-architecture,scoped-delivery`; `project-foundation` is always included. Without `--modules`, all six modules are installed. The installer refuses divergent files and duplicate skills across host directories. It never edits AGENTS.md, CLAUDE.md or your package.json. Review the staging output, then merge only what the project needs.
 
-The installer has no runtime dependencies and makes no network requests after npm obtains the package. To pin the final version, use `npx --yes devmethod-ai@0.3.0 init ...`. To pin a reviewed repository commit instead, use: `npx --yes --package=github:montassarkhalloufi/DevMethod#<commit-sha> devmethod init ...`.
+The installer has no runtime dependencies and makes no network requests after npm obtains the package. To pin the final version, use `npx --yes devmethod-ai@0.3.1 init ...`. To pin a reviewed repository commit instead, use: `npx --yes --package=github:montassarkhalloufi/DevMethod#<commit-sha> devmethod init ...`.
 
 Complete PROJECT_PROFILE.md with your real stack, commands, scope, deployment permissions and data requirements. Merge AGENTS.foundation.md into the project's existing instructions only after review. Claude Code reads CLAUDE.md: preserve its current content and, if the project has AGENTS.md, optionally add `@AGENTS.md` to import it. Keep existing accepted architecture decisions authoritative.
 
@@ -114,7 +117,7 @@ Replace `status` with an action below. These are prompts to the skill, not shell
 | `plan` | Useful scope discussion, conditional milestones and near-term tickets |
 | `ready TASK-1` | Readiness assessment before implementation |
 | `implement TASK-1` | Scoped code, tests and corrections |
-| `review TASK-1` | Diff and architecture review |
+| `review TASK-1` | Evidence-backed inspection, structured findings, checks, sources and report |
 | `verify TASK-1` | Executed checks and remaining gates |
 | `integrate TASK-1` | Delivery under existing permissions |
 | `correct-course` | Resolve changed scope or blocked decisions |
@@ -128,17 +131,25 @@ See [research, decision dialogue and mission migration](docs/WORKFLOW-0.3.md). S
 
 ## More recorded examples
 
-[Detailed recorded Lisière chain](docs/media/full-chain-4k/README.md) · [Short Clair demo](docs/media/from-zero/README.md) · [Run Clair](examples/clair-from-zero/README.md). Clair is a separate from-zero example; the featured video above follows Lisière throughout.
+[Detailed recorded Lisière chain](docs/media/full-chain-4k/README.md) · [Short Clair demo](docs/media/from-zero/README.md) · [Run Clair](examples/clair-from-zero/README.md). Clair is a separate from-zero example. The featured film retains the Lisière story and adds an explicitly separate fictional review example.
 
 ## Inspect a review in your browser
 
 Generate a local interactive report from the packaged fictional demo:
 
 ```sh
-npx --yes devmethod-ai@0.3.0 review --demo --output review.html
+npx --yes devmethod-ai@0.3.1 review --demo --output review.html --open
 ```
 
-Open `review.html` in your browser. For your own results, use `--review relative/review.json`; add `--markdown REVIEW.md` for the derived report. Search and filter findings, inspect evidence and source provenance, and export the same results. Existing Markdown remains readable with `--legacy`. See [review commands, format and trust limits](docs/REVIEWS.md). The CLI presents recorded results; it does not perform an automatic code review.
+The command generates `review.html` and opens it in your browser without a local server. On a headless machine, omit `--open`; if opening fails, the file remains available. For your own results, use `--review relative/review.json`; add `--markdown REVIEW.md` for the derived report. Search and filter findings, inspect evidence and source provenance, and export the same results. Existing Markdown remains readable with `--legacy`. See [review commands, format and trust limits](docs/REVIEWS.md). The CLI presents recorded results; it does not perform an automatic code review.
+
+![Actual DevMethod review interface — fictional demonstration data](https://raw.githubusercontent.com/montassarkhalloufi/DevMethod/main/docs/images/review-interface-desktop.jpg)
+
+**[Follow the review walkthrough](https://github.com/montassarkhalloufi/DevMethod/blob/main/docs/REVIEW-GUIDE.md)** · [JSON, Markdown and HTML example](https://github.com/montassarkhalloufi/DevMethod/tree/main/examples/review) · [Review chapter provenance](https://github.com/montassarkhalloufi/DevMethod/blob/main/docs/media/review-extension/README.md)
+
+The example contains two fictional findings and three separate checks. Severity, confidence and resolution remain distinct. Sources show whether they were actually consulted. The same structured record produces the UI and reports; tickets reference stable finding IDs.
+
+![Coverage distinguishes passed, failed and unexecuted checks](https://raw.githubusercontent.com/montassarkhalloufi/DevMethod/main/docs/images/review-coverage.jpg)
 
 ## Visual design and architecture
 

package/dist/review-browser.js

@@ -86,7 +86,7 @@ function reviewFreshness(r, currentRevision, changedTargets) {
     const affected = (targets) => targets.some(t => changedTargets.includes(t));
     return { state: different || changedTargets.length ? 'different' : currentRevision === null ? 'unknown' : 'same', affectedChecks: r.checks.filter(c => affected(c.targets)).map(c => c.id), affectedFindings: r.findings.filter(f => affected(f.targets)).map(f => f.id) };
 }
-const md = (s) => s.replace(/[\\`*_{}\[\]<>|#]/g, c => `\\${c}`).replace(/\n/g, '  \n');
+const md = (s) => s.replace(/[\\`*_{}\[\]<>|#]/g, c => `\\${c}`).replace(/\n/g, '\\' + '\n');
 function reviewMarkdown(r) {
     const s = summarizeReview(r);
     const lines = [`# ${md(r.title)}`, '', `${md(r.project)} · ${md(r.mission)} · ${md(r.date)}`, `Revision: ${md(r.revision.commit)}; uncommitted changes: ${r.revision.dirty.map(md).join(', ') || 'none recorded'}`, '', `Conclusion: **${conclusionLabels[s.conclusion]}**`, md(r.summary), `Policy: ${md(r.policy.rationale)}`, '', '## Scope', ...r.scope.map(v => `- ${md(v)}`), '', '## Exclusions and limits', ...[...r.exclusions, ...r.limits].map(v => `- ${md(v)}`), '', '## Counts (whole review)', ...Object.entries(s.severities).map(([severity, count]) => `- ${severityLabels[severity]}: ${count}`), `- À vérifier: ${s.suspected}`, ...Object.entries(s.checks).map(([status, count]) => `- ${checkLabels[status]}: ${count}`), '', '## Coverage', ...r.checks.map(c => `- **${md(c.id)} — ${md(c.title)}** (${md(c.domain)}, ${c.kind}): ${checkLabels[c.status]}. ${md(c.result)}${c.reason ? ` Reason: ${md(c.reason)}` : ''} Revision: ${md(c.revision)}. Evidence: ${c.evidenceIds.map(md).join(', ') || 'none'}`), '', '## Findings'];

package/dist/review-model.js

@@ -84,7 +84,7 @@ export function reviewFreshness(r, currentRevision, changedTargets) {
     const affected = (targets) => targets.some(t => changedTargets.includes(t));
     return { state: different || changedTargets.length ? 'different' : currentRevision === null ? 'unknown' : 'same', affectedChecks: r.checks.filter(c => affected(c.targets)).map(c => c.id), affectedFindings: r.findings.filter(f => affected(f.targets)).map(f => f.id) };
 }
-const md = (s) => s.replace(/[\\`*_{}\[\]<>|#]/g, c => `\\${c}`).replace(/\n/g, '  \n');
+const md = (s) => s.replace(/[\\`*_{}\[\]<>|#]/g, c => `\\${c}`).replace(/\n/g, '\\' + '\n');
 export function reviewMarkdown(r) {
     const s = summarizeReview(r);
     const lines = [`# ${md(r.title)}`, '', `${md(r.project)} · ${md(r.mission)} · ${md(r.date)}`, `Revision: ${md(r.revision.commit)}; uncommitted changes: ${r.revision.dirty.map(md).join(', ') || 'none recorded'}`, '', `Conclusion: **${conclusionLabels[s.conclusion]}**`, md(r.summary), `Policy: ${md(r.policy.rationale)}`, '', '## Scope', ...r.scope.map(v => `- ${md(v)}`), '', '## Exclusions and limits', ...[...r.exclusions, ...r.limits].map(v => `- ${md(v)}`), '', '## Counts (whole review)', ...Object.entries(s.severities).map(([severity, count]) => `- ${severityLabels[severity]}: ${count}`), `- À vérifier: ${s.suspected}`, ...Object.entries(s.checks).map(([status, count]) => `- ${checkLabels[status]}: ${count}`), '', '## Coverage', ...r.checks.map(c => `- **${md(c.id)} — ${md(c.title)}** (${md(c.domain)}, ${c.kind}): ${checkLabels[c.status]}. ${md(c.result)}${c.reason ? ` Reason: ${md(c.reason)}` : ''} Revision: ${md(c.revision)}. Evidence: ${c.evidenceIds.map(md).join(', ') || 'none'}`), '', '## Findings'];

package/docs/RELEASE-0.3.1.md

@@ -0,0 +1,15 @@
+# DevMethod 0.3.1 — review documentation and film
+
+This patch makes the 0.3 review capability visible in the GitHub/npm README, provides a step-by-step guide with actual interface captures, and distributes the fictional example as JSON, generated Markdown and standalone HTML. CLI behavior and the format-1 contract are unchanged.
+
+The existing Lisière 4K film is extended to approximately **4 min 03 s**. Its original footage, narration and ending are retained; six narrated review-interface scenes are inserted before the ending. The added example is clearly fictional and separate from the Lisière pilot. French subtitles, the preview image and montage provenance are updated. The video is linked from npm and hosted on GitHub, rather than included in the npm tarball.
+
+```sh
+npx --yes devmethod-ai@0.3.1 review --demo --output review-demo.html --open
+```
+
+[Review guide](REVIEW-GUIDE.md) · [Example](../examples/review/README.md) · [Extended film](media/visual-chain/README.md) · [0.3 functional changes](RELEASE-0.3.0.md)
+
+Validation covers the unchanged CLI test suite, document links, derivation of the example Markdown/HTML, archive resources and preserved installation behavior. Media checks inspect the encoded frames, subtitle timing, duration and audio/video streams. The new chapter is a narrated screenshot montage, not a continuous browser recording or an independently executed review of Lisière. Direct offline browser reopening remains unverified under the tool policy described in the 0.3 review evidence.
+
+GitHub release and npm registry metadata are the publication evidence; see the associated PR for the exact revision, archive integrity and final check results.

package/docs/REVIEW-GUIDE.md

@@ -0,0 +1,68 @@
+# From a review record to the browser
+
+DevMethod 0.3 adds a review workflow and an offline browser interface. Version 0.3.1 expands the documentation and the existing narrated film with this journey. The CLI presents recorded results; it does not inspect code or run tests on your behalf.
+
+## Try the packaged example
+
+Use Node.js 22+ from a normal project directory, with a fresh output filename:
+
+```sh
+npx --yes devmethod-ai@0.3.1 review --demo --output review-demo.html --open
+```
+
+The OS opens the generated standalone HTML in your browser. No local server, account or source checkout is required. npx may download the package first. On a headless system, omit `--open` and transfer the HTML to your desktop. If automatic opening fails, the output is preserved for manual opening. Paths containing symlink components are rejected; on macOS use the canonical `/private/tmp/...` instead of `/tmp/...` for a temporary `--dest`.
+
+The **Atelier de lecture** record is deliberately fictional. It contains two illustrative findings: a confirmed moderate accessibility problem and an unverified minor performance risk. Its three checks have separate outcomes: one passed, one failed, one not executed. They are not findings from the Lisière pilot or evidence that this fictional product was tested.
+
+![Actual desktop review interface, displaying fictional example data](images/review-interface-desktop.jpg)
+
+1. In **Constats**, search for `silencieux`. One finding remains; the severity and coverage cards still describe the whole review.
+2. Select **R-01**. **Preuve** explains its trigger, expected and observed behavior, and labels its explanatory diagram.
+3. Open **Correction** for the proposed change, trade-offs and required verification. A ticket link is shown only when supplied; the demo's link is explicitly illustrative.
+4. Open **Couverture** to distinguish check outcomes and reasons for missing verification. Counts of tests and findings are independent.
+5. Open **Sources** to inspect version, provenance, consultation and limits. The example's reference is marked **non vérifiée**, not presented as research actually performed.
+6. Use **Exporter le rapport** for HTML, Markdown or JSON. The HTML snapshot retains selection, filters and detail section. Open your exported file again to resume; a different inspected revision still requires reassessment of affected evidence.
+7. On mobile, return from the detail to the list without losing your filters. Keyboard focus and text labels complement the severity colors.
+
+![Coverage is independent of findings](images/review-coverage.jpg)
+
+![Correction includes the expected verification](images/review-correction.jpg)
+
+## Produce a real review
+
+Within the coding agent, ask the workflow to review the authorized ticket. This is an illustrative skill request, not a CLI command or a claimed recorded agent run:
+
+```text
+$project-foundation review TASK-1
+Inspect the actual stack and versions, the diff, accepted decisions and ticket criteria.
+Consult applicable official sources and verify the provenance of any suggested skill.
+Record checks, findings, evidence, limitations and the inspected revision in review.json.
+Fix confirmed issues within the authorized scope, then record their new verification.
+```
+
+For a substantial review, use one results owner:
+
+```text
+docs/missions/first-save/reviews/review-01/
+  review.json       # validated, versioned results
+  REVIEW.md         # generated from those results
+  preuves/          # only necessary, reviewed evidence
+```
+
+The [format contract](REVIEWS.md) defines required fields and path/link/privacy boundaries. Start from the [complete fictional JSON](../examples/review/review.json) to understand the shape, replacing **all** illustrative facts with actual observations. Do not label a suspect risk confirmed or a known source consulted without evidence. A failed check and a finding are different objects. Tickets reference finding IDs rather than copying their content.
+
+```sh
+npx --yes devmethod-ai@0.3.1 review \
+  --review docs/missions/first-save/reviews/review-01/review.json \
+  --output review-first-save.html \
+  --markdown docs/missions/first-save/reviews/review-01/REVIEW.md \
+  --open
+```
+
+Output files must be new; select another name if a report exists. The [packaged example](../examples/review/README.md) also contains generated HTML and Markdown for comparison. Existing Markdown can be opened with `--legacy path/to/REVIEW.md`; missing structured fields remain unknown.
+
+## Watch the journey
+
+The [extended existing 4K film](media/visual-chain/README.md) retains the Lisière footage and narration, then inserts a review-interface chapter before the original conclusion. The added chapter is a narrated montage of actual browser screenshots, not a continuous screen recording or a fresh review of Lisière. [Montage sources and provenance](media/review-extension/README.md).
+
+The [verification record](REVIEW-VALIDATION.md) distinguishes automated tests, real browser observations and illustrative workflows. Export bytes and state were inspected; direct `file://` reopening was blocked by the browser tool, so that end-to-end check is not claimed as passed. Automatic redaction is heuristic: inspect evidence before distributing it.

package/docs/images/devmethod-delivery.svg

@@ -3,7 +3,7 @@
 <defs><marker id="arrow" markerWidth="8" markerHeight="8" refX="6" refY="3" orient="auto"><path d="M0 0L6 3L0 6" fill="#ddac86"/></marker></defs>
 <rect width="1200" height="650" rx="28" fill="#10272b"/><g font-family="Arial, sans-serif">
 <text x="52" y="65" fill="#eeb88e" font-size="16" letter-spacing="3">DEVMETHOD / THE DELIVERY LOOP</text><text x="52" y="117" fill="#fff9ef" font-size="36" font-weight="700">A finished slice needs evidence</text>
-<text x="52" y="154" fill="#b9ccc4" font-size="20">Design approval guides the work. Tests and browser checks verify the result.</text>
+<text x="52" y="154" fill="#b9ccc4" font-size="20">Accepted decisions guide the work. Structured review connects checks, findings and evidence.</text>
 <rect x="52" y="203" width="320" height="157" rx="16" fill="#1a363a" stroke="#49615e"/><text x="74" y="250" fill="#fff9ef" font-size="24" font-weight="700">Accepted references</text><text x="74" y="293" fill="#c6d7ce" font-size="18">Scope · design · architecture</text><text x="74" y="325" fill="#c6d7ce" font-size="18">Plan and readiness</text><rect x="440" y="203" width="320" height="157" rx="16" fill="#1a363a" stroke="#49615e"/><text x="462" y="250" fill="#fff9ef" font-size="24" font-weight="700">Implement and review</text><text x="462" y="293" fill="#c6d7ce" font-size="18">Build the real interactions</text><text x="462" y="325" fill="#c6d7ce" font-size="18">Review code, risks and tests</text><rect x="828" y="203" width="320" height="157" rx="16" fill="#1a363a" stroke="#49615e"/><text x="850" y="250" fill="#fff9ef" font-size="24" font-weight="700">Verify the result</text><text x="850" y="293" fill="#c6d7ce" font-size="18">Run the agreed checks</text><text x="850" y="325" fill="#c6d7ce" font-size="18">Compare UI with the design</text><g stroke="#ddac86" stroke-width="3" fill="none" marker-end="url(#arrow)"><path d="M378 281h54"/><path d="M766 281h54"/><path d="M988 365v75"/><path d="M600 450v-78"/><path d="M930 365v40H210v35"/></g>
 <rect x="828" y="452" width="320" height="117" rx="16" fill="#24483f" stroke="#74b49a"/><text x="850" y="490" fill="#fff9ef" font-size="23" font-weight="700">Checks pass → deliver</text><text x="850" y="526" fill="#c6d7ce" font-size="18">Integrate within permissions</text><text x="850" y="552" fill="#c6d7ce" font-size="18">Record evidence and handoff</text>
 <rect x="52" y="452" width="708" height="117" rx="16" fill="#3b3531" stroke="#ddac86"/><text x="74" y="491" fill="#fff9ef" font-size="23" font-weight="700">Failed check or changed constraint → correct</text><text x="74" y="526" fill="#decbbb" font-size="18">Fix the slice or revisit the affected design / architecture decision.</text><text x="74" y="552" fill="#decbbb" font-size="18">If blocked, preserve a checkpoint; do not mark the slice delivered.</text>

package/docs/images/devmethod-flow.svg

@@ -8,6 +8,6 @@
 <rect x="424" y="202" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="448" y="237" fill="#eeb88e" font-size="17" font-weight="700">02</text><text x="448" y="278" fill="#fff9ef" font-size="23" font-weight="700">Design the experience</text><text x="448" y="316" fill="#eeb88e" font-size="18">Design</text><text x="448" y="350" fill="#c6d7ce" font-size="17">Directions → master → screens</text>
 <rect x="796" y="202" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="820" y="237" fill="#eeb88e" font-size="17" font-weight="700">03</text><text x="820" y="278" fill="#fff9ef" font-size="23" font-weight="700">Choose the architecture</text><text x="820" y="316" fill="#eeb88e" font-size="18">Architecture</text><text x="820" y="350" fill="#c6d7ce" font-size="17">Technologies, boundaries, trade-offs</text>
 <rect x="52" y="409" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="76" y="444" fill="#eeb88e" font-size="17" font-weight="700">04</text><text x="76" y="485" fill="#fff9ef" font-size="23" font-weight="700">Prepare a useful slice</text><text x="76" y="523" fill="#eeb88e" font-size="18">Plan · ready</text><text x="76" y="557" fill="#c6d7ce" font-size="17">Dependencies and acceptance checks</text>
-<rect x="424" y="409" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="448" y="444" fill="#eeb88e" font-size="17" font-weight="700">05</text><text x="448" y="485" fill="#fff9ef" font-size="23" font-weight="700">Build and improve</text><text x="448" y="523" fill="#eeb88e" font-size="18">Implement · review</text><text x="448" y="557" fill="#c6d7ce" font-size="17">Working behavior, tests and fixes</text>
+<rect x="424" y="409" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="448" y="444" fill="#eeb88e" font-size="17" font-weight="700">05</text><text x="448" y="485" fill="#fff9ef" font-size="23" font-weight="700">Build and improve</text><text x="448" y="523" fill="#eeb88e" font-size="18">Implement · review</text><text x="448" y="557" fill="#c6d7ce" font-size="17">Findings · evidence · corrections</text>
 <rect x="796" y="409" width="352" height="183" rx="16" fill="#1a363a" stroke="#49615e"/><text x="820" y="444" fill="#eeb88e" font-size="17" font-weight="700">06</text><text x="820" y="485" fill="#fff9ef" font-size="23" font-weight="700">Verify and deliver</text><text x="820" y="523" fill="#eeb88e" font-size="18">Verify · integrate · handoff</text><text x="820" y="557" fill="#c6d7ce" font-size="17">Evidence, delivery and resumption</text>
 <path d="M52 630h1096" stroke="#49615e"/><text x="52" y="664" fill="#c6d7ce" font-size="18">Adapt the depth to the project. Revisit decisions when constraints or checks change.</text><text x="52" y="694" fill="#9fb8af" font-size="16">Skill guidance for your coding agent · Image generation requires an available host tool.</text></g></svg>

package/docs/media/review-extension/README.md

@@ -0,0 +1,21 @@
+# Ajout de la review au film existant
+
+Le film principal conserve les séquences et la narration de Lisière provenant du tag `v0.3.0`. Six séquences de review sont insérées à 171,52 secondes, avant la conclusion originale. Aucun cadrage, choix artistique ni parcours de Lisière n'a été recréé.
+
+Les captures proviennent de l'interface réelle, inspectée dans le navigateur à 1586 × 992 : constats, recherche « silencieux », correction, couverture, sources et menu d'export. Elles affichent la fixture **Atelier de lecture**, dont les résultats sont fictifs et explicitement signalés. Ce chapitre n'affirme pas qu'une review structurée de Lisière a été exécutée.
+
+Le complément est un montage de captures avec transitions et narration française macOS Thomas, comme le film existant ; ce n'est pas une capture vidéo continue des interactions. Les plans conservent le contenu des captures, avec un redimensionnement proportionnel et un habillage explicatif. La commande d'ouverture affichée est documentée et testée séparément ; la limite de vérification `file://` reste dans le [guide](../../REVIEW-GUIDE.md).
+
+[Film et sous-titres](../visual-chain/README.md) · [Scènes ajoutées et empreinte de l'original](scenes.json) · [Script de montage](../../../scripts/media/review-extension/extend.py)
+
+Le script extrait le film original depuis le tag immuable `v0.3.0`, génère seulement les nouveaux plans, décale les sous-titres et déplace la conclusion après le chapitre. Il nécessite Python avec Pillow, ffmpeg/ffprobe et la voix macOS Thomas. Exécuter depuis la racine : `python3 scripts/media/review-extension/extend.py`. Le cache de travail est `/private/tmp/devmethod-review-film`. Les empreintes des images, des voix et des paramètres d’encodage déclenchent la régénération des plans modifiés. Le script de montage se lance depuis un clone Git comprenant les médias ; le paquet npm suffit uniquement pour utiliser la review.
+
+La vidéo 4K est hébergée sur GitHub et liée depuis npm ; elle n'alourdit pas l'archive npm. Les captures explicatives, le guide et l'exemple de review sont distribués. Les captures sont des observations du navigateur ; la synthèse vocale n'est pas un enregistrement humain.
+
+## Vérifications du montage final
+
+- Durée mesurée : **243,216 secondes** ; 3840 × 2160, 25 images/s, H.264, audio AAC mono 48 kHz et sous-titres français intégrés.
+- Décodage complet du MP4 terminé sans erreur. Les six nouveaux plans, un plan original et la conclusion déplacée ont été extraits du fichier encodé et inspectés visuellement.
+- Les nouvelles captures montrent réellement les onglets et le filtre annoncé ; leur cadrage a été corrigé avant montage.
+- Les sous-titres d’origine sont conservés, la conclusion est décalée et les nouvelles phrases sont synchronisées aux durées des voix générées.
+- Pas de revendication d’écoute humaine intégrale ni de nouvel enregistrement continu de l’application.

package/docs/media/review-extension/scenes.json

@@ -0,0 +1,70 @@
+{
+  "baseTag": "v0.3.0",
+  "baseSHA256": "6d803f75ec4a0fcef70f188216977ac878846d7ffb84000fb281d8001dc092c0",
+  "insertionSeconds": 171.52,
+  "baseDuration": 177.509,
+  "duration": 243.216,
+  "method": "Original footage and narration retained; review screenshot chapter inserted before original ending. Re-encoded splice tracks; no original scene regenerated.",
+  "scenes": [
+    {
+      "title": "La review devient consultable",
+      "capture": "findings.jpg",
+      "command": "npx devmethod-ai@0.3.1 \\\n  review --demo \\\n  --output review.html --open",
+      "explanation": "Une interface locale pour relier constats, preuves et corrections.",
+      "note": "HTML autonome hors ligne. La commande présente des résultats enregistrés ; elle ne réalise pas la review.",
+      "voice": "Dev Method ajoute maintenant une interface de review. Voici sa démonstration fictive, distincte des résultats réels du pilote Lisière. Cette commande ouvre un rapport local.",
+      "duration": 11.36,
+      "start": 171.52
+    },
+    {
+      "title": "Retrouver le constat utile",
+      "capture": "filtered.jpg",
+      "command": "Constats → Rechercher\n« silencieux »",
+      "explanation": "Rechercher, filtrer et sélectionner sans confondre gravité et confiance.",
+      "note": "Un constat confirmé et un risque à vérifier restent distincts. Les compteurs décrivent toute la review.",
+      "voice": "La recherche isole un constat. Les filtres distinguent domaine, gravité, confiance et résolution. Un risque à vérifier reste une hypothèse, pas un défaut confirmé.",
+      "duration": 11.32,
+      "start": 182.88
+    },
+    {
+      "title": "Comprendre, puis corriger",
+      "capture": "correction.jpg",
+      "command": "Preuve → Correction\n→ Vérification attendue",
+      "explanation": "Du scénario observé à la correction et à sa nouvelle vérification.",
+      "note": "Le ticket complète le constat. Fermer le panneau ne résout jamais le problème.",
+      "voice": "Chaque constat relie scénario, preuve, impact et correction. La vérification attendue et le ticket restent accessibles. Masquer un résultat ne le marque pas comme résolu.",
+      "duration": 11.04,
+      "start": 194.2
+    },
+    {
+      "title": "Voir la couverture réelle",
+      "capture": "coverage.jpg",
+      "command": "Couverture\nRéussi · Échec · Non exécuté",
+      "explanation": "Les contrôles ont leur propre statut, indépendant du nombre de constats.",
+      "note": "Une zone non inspectée ne devient pas verte. La révision et les limites restent visibles.",
+      "voice": "La couverture sépare les contrôles réussis, en échec et non exécutés. L’absence de constat ne prouve pas que tout a été vérifié.",
+      "duration": 8.6,
+      "start": 205.23999999999998
+    },
+    {
+      "title": "Vérifier les références",
+      "capture": "sources.jpg",
+      "command": "Sources\nVersion → Provenance → Usage",
+      "explanation": "Une référence connue n’est pas automatiquement une source consultée.",
+      "note": "La démonstration signale sa référence non vérifiée. Une vraie review consigne sa consultation et ses limites.",
+      "voice": "Les sources indiquent technologie, version, provenance et usage. Ici, la référence est clairement non vérifiée : cette démonstration ne prétend pas l’avoir consultée.",
+      "duration": 11.44,
+      "start": 213.83999999999997
+    },
+    {
+      "title": "Exporter et reprendre",
+      "capture": "export.jpg",
+      "command": "Exporter le rapport\nHTML · Markdown · JSON",
+      "explanation": "Une source structurée commune pour l’interface et les rapports.",
+      "note": "Conserver la révision, les preuves et les limites. Le HTML exporté conserve aussi l’état de consultation.",
+      "voice": "Exportez la même review en HTML, Markdown ou JSON. Les résultats partagent une source commune. Le rapport conserve la révision, les preuves et les limites pour la reprise.",
+      "duration": 11.92,
+      "start": 225.27999999999997
+    }
+  ]
+}

package/docs/media/visual-chain/README.md

@@ -2,7 +2,9 @@
 
 [Voir le film 4K](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/devmethod-du-besoin-au-produit-4k.fr.mp4) · [Sous-titres](devmethod-du-besoin-au-produit.fr.srt) · [Prototype source](https://github.com/montassarkhalloufi/DevMethod/raw/refs/heads/main/docs/media/visual-chain/lisiere-visual-source.zip)
 
-**2 min 58 s · 3840 × 2160 · 23 séquences · voix française.**
+**4 min 03 s · 3840 × 2160 · 23 séquences originales + 6 séquences review · voix française.**
+
+La version 0.3.1 enrichit le film existant : les séquences et la voix de Lisière restent présentes. Un chapitre sur l’interface de review est inséré à **2 min 51 s**, avant la conclusion originale. [Détails, captures et provenance du complément](../review-extension/README.md).
 
 Le film remplace le long documentaire comme démonstration principale : un seul projet, Lisière, une commande et son résultat visuel, puis l'étape suivante. Narration française courte, commandes tapées, apparitions successives, mouvements doux et interaction réelle. Le cadrage, les choix techniques, les responsabilités du code, la préparation, la revue et la reprise complètent le parcours des maquettes. GitHub garde la prononciation « guit-hub » demandée.
 
@@ -41,4 +43,8 @@ Les scripts sont dans [scripts/media/visual-short](../../../scripts/media/visual
 
 Le montage est en 4K ; les images source générées sont en 1536×1024. Le texte et les transitions sont rendus dans Chrome à 3840×2160.
 
-Vérifications du média : MP4 H.264, AAC, sous-titres français mov_text ; 177.509 secondes. Plans explicatifs de 6 à 10 secondes environ, transitions et apparitions animées ; séquence navigateur de 20 secondes avec plusieurs actions. Images du master, des déclinaisons, de la comparaison et de la persistance encodée inspectées. Les sous-titres ont un timing proportionnel par phrase. Pas de revendication d’écoute humaine complète.
+Vérifications du média original : MP4 H.264, AAC, sous-titres français mov_text ; 177.509 secondes. Le montage enrichi mesure environ 243 secondes ; sa durée exacte et ses points de montage sont consignés dans [le manifeste du complément](../review-extension/scenes.json). Plans explicatifs de 6 à 10 secondes environ, transitions et apparitions animées ; séquence navigateur de 20 secondes avec plusieurs actions. Images du master, des déclinaisons, de la comparaison et de la persistance encodée inspectées. Les sous-titres ont un timing proportionnel par phrase. Pas de revendication d’écoute humaine complète.
+
+## Chapitre review ajouté
+
+Le [guide de review](../../REVIEW-GUIDE.md) accompagne les six nouveaux plans : ouvrir, filtrer, comprendre/corriger, couverture, sources, exporter/reprendre. Il utilise **Atelier de lecture**, une fixture fictive distincte de Lisière. Les captures sont réelles ; les constats ne sont pas des résultats de test du pilote. La nouvelle vignette montre cette interface et le lien du film demeure identique pour les lecteurs de GitHub et npm.

package/docs/media/visual-chain/devmethod-du-besoin-au-produit.fr.srt

@@ -143,5 +143,69 @@ Handoff conserve les décisions, les preuves et les limites.
 Next retrouve ensuite la suite pertinente, ou constate que le périmètre est terminé.
 
 37
-00:02:51,507 --> 00:02:55,280
+00:02:51,520 --> 00:02:54,787
+Dev Method ajoute maintenant une interface de review.
+
+38
+00:02:54,787 --> 00:02:59,719
+Voici sa démonstration fictive, distincte des résultats réels du pilote Lisière.
+
+39
+00:02:59,719 --> 00:03:02,062
+Cette commande ouvre un rapport local.
+
+40
+00:03:02,880 --> 00:03:04,840
+La recherche isole un constat.
+
+41
+00:03:04,840 --> 00:03:09,152
+Les filtres distinguent domaine, gravité, confiance et résolution.
+
+42
+00:03:09,152 --> 00:03:13,399
+Un risque à vérifier reste une hypothèse, pas un défaut confirmé.
+
+43
+00:03:14,200 --> 00:03:17,849
+Chaque constat relie scénario, preuve, impact et correction.
+
+44
+00:03:17,849 --> 00:03:21,376
+La vérification attendue et le ticket restent accessibles.
+
+45
+00:03:21,376 --> 00:03:24,417
+Masquer un résultat ne le marque pas comme résolu.
+
+46
+00:03:25,240 --> 00:03:29,460
+La couverture sépare les contrôles réussis, en échec et non exécutés.
+
+47
+00:03:29,460 --> 00:03:33,007
+L’absence de constat ne prouve pas que tout a été vérifié.
+
+48
+00:03:33,840 --> 00:03:37,956
+Les sources indiquent technologie, version, provenance et usage.
+
+49
+00:03:37,956 --> 00:03:44,452
+Ici, la référence est clairement non vérifiée : cette démonstration ne prétend pas l’avoir consultée.
+
+50
+00:03:45,280 --> 00:03:48,564
+Exportez la même review en HTML, Markdown ou JSON.
+
+51
+00:03:48,564 --> 00:03:51,388
+Les résultats partagent une source commune.
+
+52
+00:03:51,388 --> 00:03:56,379
+Le rapport conserve la révision, les preuves et les limites pour la reprise.
+
+53
+00:03:57,187 --> 00:04:00,960
 Découvrez Dev Method sur GitHub et essayez cette chaîne sur votre projet.

package/docs/missions/review-media-0.3.1.md

@@ -0,0 +1,11 @@
+# Review documentation and media — 0.3.1
+
+Scope authorized in conversation on 2026-09-13: update GitHub/npm documentation, images and the existing video to demonstrate review and its interface; extend the existing film rather than starting over. Version 0.3.0 was already published and verified, so this is a new patch release.
+
+Outputs: the README, review walkthrough, actual UI screenshots, the packaged fictional JSON/Markdown/HTML example and six review scenes inserted before the existing film's conclusion. CLI runtime behavior and the accepted offline HTML decision are unchanged. The video remains on GitHub; the package distributes the guide, screenshots and example.
+
+Validation: 89 core tests, local Markdown links, generated example equality against its JSON source, full MP4 decode, visual inspection of all added scenes and the retained ending, and actual tarball installation/update smoke. The smoke expectation distinguishes an unchanged upstream skill in 0.3.0→0.3.1 from an upstream/local conflict in 0.2.0→0.3.1; both preserve user content. Exact archive and platform/fullstack results belong to the associated PR/release.
+
+Limits: the added video chapter is a narrated montage of real screenshots with fictional findings, not a continuous recording or a real review of Lisière. Direct file:// reopening remains unverified under the browser tool policy. No independent human audiovisual review is claimed.
+
+Next: await final PR checks, integrate under existing authorization, create the new tag/release, publish the exact verified npm archive and verify registry integrity/readme/resources. npm may require another maintainer authentication. Never replace v0.3.0 or its published tarball.

package/docs/missions/workflow-0.3.md

@@ -14,4 +14,6 @@ Exclusions: whole-project dashboard, remote hosting, automatic discovery/install
 
 Current architecture question: static self-contained HTML versus loopback server; recommended static report under the dependency-free offline contract, presented to the user before dependent implementation. Preserve their forthcoming choice/delegation in the relevant ADR.
 
-Next action: verify the final delegated offline-opening integration, merge and publish under current authorization. The user explicitly delegated the opening-mode choice on 2026-09-13; ADR 008 records the selected standalone HTML and optional OS opening command. Shared model, report/export, CLI presentation and browser UI are implemented. The file:// browser reopening limitation remains documented; do not bypass the browser tool policy or claim that check passed.
+Delivered as v0.3.0: PR #19 merged at `2bea8ec47cbb1d085819ba05e64f9d3816e91af8`; GitHub release and npm `latest` publication verified. Registry tarball bytes matched the inspected archive and package smoke passed. The installed published package generated its review HTML and Markdown from a canonical temporary directory without this checkout. Direct file:// reopening remains unverified under browser tool policy.
+
+The user subsequently requested expanded documentation, images and an extension of the existing film. That follow-up is owned by [review-media-0.3.1](review-media-0.3.1.md); the 0.3.0 tag and npm artifact remain immutable.

package/examples/review/README.md

@@ -0,0 +1,14 @@
+# Fictional review example
+
+This is a demonstration of the review format and viewer, not a review of a real product. It is separate from the Lisière video pilot.
+
+- [review.json](review.json) owns the illustrative results.
+- [REVIEW.md](REVIEW.md) is generated from that JSON.
+- [review-demo.html](review-demo.html) is the same standalone interactive viewer. Download it to open locally; GitHub's file page displays source.
+- [Step-by-step guide](../../docs/REVIEW-GUIDE.md) explains filters, evidence, coverage, sources and exports.
+
+```sh
+npx --yes devmethod-ai@0.3.1 review --demo --output review-demo.html --open
+```
+
+Choose a fresh output path. This works from the distributed package without this source checkout. The packaged generated HTML is illustrative; your real results belong in your own mission's review record.

package/examples/review/REVIEW.md

@@ -0,0 +1,98 @@
+# Review de la bibliothèque
+
+Atelier de lecture · Première sauvegarde · 2026-09-13
+Revision: demo-revision-1; uncommitted changes: none recorded
+
+Conclusion: **Corrections nécessaires**
+Démonstration de l’interface. Les constats et contrôles ci-dessous sont fictifs.
+Policy: Politique illustrative : corriger les problèmes confirmés modérés ou plus graves avant intégration.
+
+## Scope
+- Démonstration fictive de consultation, sans audit du projet illustré.
+
+## Exclusions and limits
+- Aucun résultat réel de sécurité ou de performance.
+- DÉMONSTRATION : données fictives, sans validation d’un produit réel.
+- Le contrôle de performance n’a pas été exécuté.
+
+## Counts (whole review)
+- Critique: 0
+- Majeur: 0
+- Modéré: 1
+- Mineur: 1
+- À vérifier: 1
+- Réussi: 1
+- En échec: 1
+- Non exécuté: 1
+- Bloqué: 0
+- Hors périmètre: 0
+
+## Coverage
+- **C-01 — Annonce après sauvegarde** (Accessibilité, manual): En échec. Exemple fictif : le changement de statut ne serait pas annoncé. Revision: demo-revision-1. Evidence: E-01
+- **C-02 — Conservation du titre** (Données, automated): Réussi. Exemple fictif : la valeur enregistrée correspond à la saisie. Revision: demo-revision-1. Evidence: E-02
+- **C-03 — Temps de réponse sur liste longue** (Performance, automated): Non exécuté. Aucune mesure disponible dans cette fixture. Reason: Jeu de données représentatif indisponible. Revision: demo-revision-1. Evidence: none
+
+## Findings
+
+### R-01 — Le retour de sauvegarde reste silencieux
+Modéré / Confirmé / Ouvert
+Severity rationale: Exemple fictif : le lecteur pourrait ignorer que son action a réussi.
+Location: save-status (composant fictif)
+Impact: Le lecteur ne sait pas si son titre a été conservé.
+Trigger: Sauvegarder un titre en utilisant un lecteur d’écran.
+Expected: Le succès est annoncé sans déplacer le focus.
+Observed: Dans ce scénario fictif, seul le texte visuel change.
+Reproduction:
+- Scénario illustratif, non exécuté.
+- Saisir un titre, activer Sauvegarder et écouter le retour.
+Evidence: E-01
+Correction: Exposer le message de succès comme statut accessible, puis vérifier son annonce.
+Trade-offs: Éviter les annonces répétées ; conserver le focus dans le parcours.
+Resolution verification: Inspecter avec un lecteur d’écran réel et vérifier le maintien du focus.
+Resolution evidence: none
+Sources: WAI
+Tickets: DEMO-12
+
+### R-02 — Une grande liste pourrait ralentir la recherche
+Mineur / À vérifier / Ouvert
+Severity rationale: Impact supposé limité aux collections volumineuses.
+Location: list-view (composant fictif)
+Impact: Un délai pourrait gêner la saisie ; cela reste à vérifier.
+Trigger: Rechercher dans une collection volumineuse.
+Expected: La saisie reste réactive.
+Observed: Aucune mesure ; risque hypothétique seulement.
+Reproduction:
+- Préparer un jeu représentatif puis mesurer ; non exécuté.
+Evidence: none
+Correction: Mesurer avant de décider d’une optimisation.
+Trade-offs: Éviter une complexité non justifiée par des mesures.
+Resolution verification: Mesurer latence et réactivité sur le matériel cible.
+Resolution evidence: none
+Sources: none
+Tickets: none
+
+## Evidence
+
+### E-01 — Flux du retour utilisateur — schéma explicatif
+diagram
+Saisie du titre → Sauvegarder → Titre conservé → Message visuel\
+                                      ↳ Annonce vocale manquante (hypothèse de fixture)\
+Schéma explicatif fictif, pas une capture ni un journal d’exécution.
+No external evidence destination.
+
+### E-02 — Résultat illustratif de conservation
+log
+DÉMONSTRATION — journal rédigé, test non exécuté.\
+Entrée « Un titre » → valeur conservée « Un titre ».
+No external evidence destination.
+
+## Sources
+- WAI: Messages de statut accessibles — W3C WAI; Web accessibility WCAG 2.2; unverified; not consulted; https://www.w3.org/WAI/WCAG22/Understanding/status-messages.html. Référence proposée pour cette démonstration, non consultée dans une review réelle. Compatibility: À vérifier pour le parcours cible. Provenance: Domaine w3.org ; cette fixture ne constitue pas une vérification de provenance.
+
+## Technologies
+- HTML / DOM Living Standard (Fixture authored for the viewer)
+
+## Tickets
+- DEMO-12 — PR de l’interface (lien de démonstration): https://github.com/montassarkhalloufi/DevMethod/pull/19
+
+Generated from review format 1. Counts describe the whole review. Historical evidence does not certify a later revision.