Make a browser walkthrough someone can review.
The problem
A folder of screenshots loses the order of a user flow. Different screen sizes are also difficult to compare without consistent labels and captions.
An explanatory exhibit
A flow becomes a review document
An illustrated document sequence. No PDF pages or screenshots are represented as actual captures here.
- 01
Capture
Ordered steps at several widths
- 02
Caption
Explain action and visible result
- 03
Paginate
Readable pages for a reviewer
Inspect the consequence
An isolated screenshot
One visible state
It records what was on screen, but may omit the action that led there.
A captioned sequence
A reviewable flow
Ordered actions and results give the reader context and make width differences easier to compare.
What this makes possible
I turned multi-size browser capture into a reusable workflow for captioned, paginated PDF walkthroughs.
Source information sheet
Evidence, implementation & history Implementation inspected
What I checked
Both workbenches contain the capture workflow. A PDF walkthrough documents visible states and still needs review.
Research cut: 14 October 2026. Source areas below are from metaclaude and metacodex. Private conversation references are retained in the research ledger and are not published here.
Implementation decisions
The skill walks the real browser flow at selected sizes, records the steps and captions the captures. A template packages them into legible pages.
The workflow exists in both agent workbenches. It produces review material; the screenshots still need inspection and do not by themselves establish functional correctness.
A path through the feature
- Walk the complete flow
Capture the important steps in order at the requested screen sizes.
- Review the PDF
Check captions, grouping, page breaks and the images themselves before sharing the artifact.
Source areas
metaclaude/skills/flow-screenshots-pdf/SKILL.mdmetaclaude/skills/flow-screenshots-pdf/template.htmlmetacodex/skills/flow-screenshots-pdf/SKILL.md
The small explanatory exhibit uses invented records to describe the mechanism. Separate recordings and working examples carry their own evidence notes.
Recorded history
Dates describe the researched record, rather than today’s deployment.
Building a reusable flow screenshot-to-PDF workflow