app-docs
Generate complete user documentation for a web app with screenshots. Browses the app via browser automation, screenshots every screen, and produces a structured user guide with step-by-step instructions, annotated screenshots, workflow diagrams, and reference tables. Supports quick (key screens), standard (all pages), thorough (every state and flow), and exhaustive (publishable documentation suite). Triggers: 'document the app', 'user guide', 'app documentation', 'screenshot docs', 'generate user docs', 'help docs', 'how-to guide', 'write the docs'.
npx skills add jezweb/claude-skills --skill app-docs --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# App Documentation Generator Browse a running web app, screenshot every screen, and produce documentation good enough to publish. Not a screenshot dump — a structured guide that teaches someone how to use the app. ## Browser Tool Detection Same as ux-audit — Chrome MCP, Playwright MCP, or playwright-cli. ## URL Resolution Same as ux-audit — prefer deployed/live URL over localhost. ## Depth Levels | Depth | Screenshots | What it produces | Duration | |-------|------------|-----------------|----------| | **quick** | ~10 | Single-page quick-start guide. Key screens, happy path only. | 10-15 min | | **standard** | ~30 | Full user guide. All pages, primary workflows, reference tables. | 30-60 min | | **thorough** | ~80+ | Comprehensive guide. All states, mobile views, every CRUD flow, troubleshooting. | 1-3 hours | | **exhaustive** | ~150+ | Publishable documentation suite. Everything in thorough plus: getting started tutorial, feature-by-feature deep dives, admin guide, keyboard shortcut reference, FAQ, and HTML version. | 3-6 hours | Default: **standard** ## Workflow ### 1. Get App Details Ask the user: - **App URL** (required — or auto-detect from wrangler.jsonc / running dev server
- Browser Tool Detection
- URL Resolution
- Depth Levels
- Workflow
- 1. Get App Details
- 2. Discover All Routes
- 3. Document Each Page
- 4. Write Supporting Sections
- 5. Output Formats
- 6. Mockups and Diagrams
- Screenshot Quality
- Autonomy Rules
- Quality Bar
What does the app-docs skill do?
Generate complete user documentation for a web app with screenshots. Browses the app via browser automation, screenshots every screen, and produces a structured user guide with step-by-step instructions, annotated screenshots, workflow diagrams, and reference tables. Supports quick (key screens), standard (all pages), thorough (every state and flow), and exhaustive (publishable documentation suite). Triggers: 'document the app', 'user guide', 'app documentation', 'screenshot docs', 'generate user docs', 'help docs', 'how-to guide', 'write the docs'.
How do I install it?
Run `npx skills add jezweb/claude-skills --skill app-docs --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From jezweb/claude-skills, a repository with 954 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.