accessibility
Design, implement, and audit inclusive digital products using WCAG 2.2 Level AA. Use when building or auditing UI that must meet WCAG 2.2 Level AA, or when…
Create CodeTour `.tour` files — persona-targeted, step-by-step walkthroughs with real file and line anchors. Use for onboarding tours, architecture walkthroughs, PR tours, RCA tours, and structured "explain how this works" requests. Use when the user asks for a code tour,
$ npx -y skills add affaan-m/everything-claude-code --skill code-tour --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/code-tourContext preview
The summary Claude sees to decide when to auto-load this skill.
Create CodeTour `.tour` files — persona-targeted, step-by-step walkthroughs with real file and line anchors. Use for onboarding tours, architecture walkthroughs, PR tours, RCA tours, and structured "explain how this works" requests. Use when the user asks for a code tour,
name: code-tour description: Create CodeTour `.tour` files — persona-targeted, step-by-step walkthroughs with real file and line anchors. Use for onboarding tours, architecture walkthroughs, PR tours, RCA tours, and structured "explain how this works" requests. Use when the user asks for a code tour, onboarding walkthrough, PR tour, or an explanation of how a subsystem works. metadata: origin: ECC
Create **CodeTour** `.tour` files for codebase walkthroughs that open directly to real files and line ranges. Tours live in `.tours/` and are meant for the CodeTour format, not ad hoc Markdown notes.
A good tour is a narrative for a specific reader:
Only create `.tour` JSON files. Do not modify source code as part of this skill.
Use this skill when:
Examples:
| Instead of code-tour | Use | | --- | --- | | A one-off explanation in chat is enough | answer directly | | The user wants prose docs, not a `.tour` artifact | `documentation-lookup` or repo docs editing | | The task is implementation or refactoring | do the implementation work | | The task is broad codebase onboarding without a tour artifact | `codebase-onboarding` |
Explore the repo before writing anything:
Do not start writing steps before you understand the shape of the code.
Decide the persona and depth from the request.
| Request shape | Persona | Suggested depth | | --- | --- | --- | | "onboarding", "new joiner" | `new-joiner` | 9-13 steps | | "quick tour", "vibe check" | `vibecoder` | 5-8 steps | | "architecture" | `architect` | 14-18 steps | | "tour this PR" | `pr-reviewer` | 7-11 steps | | "why did this break" | `rca-investigator` | 7-11 steps | | "security review" | `security-reviewer` | 7-11 steps | | "explain how this feature works" | `feature-explainer` | 7-11 steps | | "debug this path" | `bug-fixer` | 7-11 steps |
Every file path and line anchor must be real:
Never guess line numbers.
Write to:
.tours/<persona>-<focus>.tour
Keep the path deterministic and readable.
Before finishing:
`ref` ties the tour to a git branch or commit. It matters more than it looks: when `ref` is not the branch the reader has checked out, CodeTour opens each step's file from that revision in git, not from the files on disk. If a file is not in that revision, the step will not open — the reader sees *"The editor could not be opened because the file was not found"* even though the file is sitting right there. The tour and its comments still show, so the real cause is easy to miss.
Pick `ref` by tour type:
| Tour type | Set `ref` to | | --- | --- | | PR tour | the PR branch — never the base branch | | Onboarding / architecture | the branch the reader will be on (often `main`), or leave it out | | Not sure | leave `ref` out, so CodeTour reads files straight from disk |
The PR case is the common trap: a PR usually adds new files, and new files do not exist on the base branch yet. Point `ref` at the base (e.g. `develop`) and every step on a new file fails to open.
Before finishing, confirm each step's file actually exists at the `ref` you chose.
Use sparingly, usually only for a closing step:
{ "title": "Next Steps", "description": "You can now trace the request path end to end." }Do not make the first step content-only.
Use to orient the reader to a module:
{ "directory": "src/services", "title": "Service Layer", "description": "The core orchestration logic lives here." }This is the default step type:
{ "file": "src/auth/middleware.ts", "line": 42, "title": "Auth Gate", "description": "Every protected request passes here first." }Use when one code block matters more than the whole file:
{
"file": "src/core/pipeline.ts",
"selection": {
"start": { "line": 15, "character": 0 },
"end": { "line": 34, "character": 0 }
},
"title": "Request Pipeline",
"description": "This block wires validation, auth, and downstream execution."
}Use when exact lines may drift:
{ "file": "src/app.ts", "pattern": "export default class App", "title": "Application Entry" }Use for PRs, issues, or docs when helpful:
{ "uri": "https://github.com/org/repo/pull/456", "title": "The PR" }Each description should answer:
Keep descriptions compact, specific, and grounded in the actual code.
Your agent can write code, but ECC gives it a coordinated engineering system and toolbox: it plans before it builds, verifies changes with tests, reviews its own work from a fresh context, remembers what matters, and turns repeated wins into reusable skills
Repo: affaan-m/everything-claude-code
Design, implement, and audit inclusive digital products using WCAG 2.2 Level AA. Use when building or auditing UI that must meet WCAG 2.2 Level AA, or when…
Full-stack diagnostic for agent and LLM applications. Audits the 12-layer agent stack for wrapper regression, memory pollution, tool discipline failures,…
Head-to-head comparison of coding agents (Claude Code, Aider, Codex, etc.) on custom tasks with pass rate, cost, time, and consistency metrics. Use when…
Design and optimize AI agent action spaces, tool definitions, and observation formatting for higher completion rates. Use when defining or revising an agent's…
Structured self-debugging workflow for AI agent failures using capture, diagnosis, contained recovery, and introspection reports. Use when an agent run fails…
Add x402 payment execution to AI agents with per-task budgets, spending controls, and non-custodial wallets. Supports Base through agentwallet-sdk and X Layer…