extract-skill
Reverse-engineer design systems, tokens, and components from live products or screenshots
Create zero-context implementation plans with bite-sized tasks — use for multi-step feature planning
$ npx -y skills add nyldn/claude-octopus --skill skill-writing-plans --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/skill-writing-plansContext preview
The summary Claude sees to decide when to auto-load this skill.
Create zero-context implementation plans with bite-sized tasks — use for multi-step feature planning
name: skill-writing-plans description: "Create zero-context implementation plans with bite-sized tasks — use for multi-step feature planning" disable-model-invocation: true
> **Host: Codex CLI** — This skill was designed for Claude Code and adapted for Codex. > Cross-reference commands use installed skill names in Codex rather than `/octo:*` slash commands. > Use the active Codex shell and subagent tools. Do not claim a provider, model, or host subagent is available until the current session exposes it. > For host tool equivalents, see `skills/blocks/codex-host-adapter.md`.
Load `skills/blocks/engineering-method-selection.md` from the installed plugin and apply only the methods relevant to this task. Preserve this entry point's execution contract and output format. Read referenced skills as instructions; do not invoke the current command recursively or add provider calls from a seat.
**When this skill is invoked, you MUST produce a full implementation plan following the structure below. You are PROHIBITED from:**
**The user asked for a plan, not an implementation. Write the plan first.**
**Your first output line MUST be:** `🐙 **CLAUDE OCTOPUS ACTIVATED** - Implementation Planning`
Write comprehensive implementation plans assuming the engineer has **zero context** for the codebase and **questionable taste**.
Document everything: which files to touch, complete code, how to test, how to verify.
**Principles:** DRY. YAGNI. TDD. Frequent commits.
Build a dependency graph for unresolved decisions before writing implementation tasks. A decision record contains its question, evidence required, dependencies, owner, resolution, and the implementation it unblocks. Use the repository's configured tracker. Beads is not an end-user requirement.
Decision states are `open`, `claimed`, `resolved`, `superseded`, and `blocked`, mapped to native tracker states or labels. Resolve only from evidence or a recorded human decision. If new evidence invalidates a decision, reopen its dependent work and explain why. A cycle means the work is not ready; recut the decisions rather than marking tasks ready.
Claim through the tracker's atomic operation and read ownership back before writing. If atomic claiming is unavailable, appoint one integrator. Never overwrite another claim. When the tracker fails, save an explicitly unfiled proposal in existing plan storage, stop tracker writes, and never fabricate IDs or migrate a database.
# [Feature Name] Implementation Plan **Goal:** [One sentence describing what this builds] **Architecture:** [2-3 sentences about approach] **Tech Stack:** [Key technologies/libraries] **Estimated Time:** [X tasks × 5 min = Y minutes] ## Prerequisites - [ ] [Any setup needed before starting] - [ ] [Dependencies to install] - [ ] [Files that must exist]
**Each task is ONE action (2-5 minutes):**
| Good (Single Action) | Bad (Multiple Actions) | |---------------------|------------------------| | "Write the failing test" | "Write tests and implement" | | "Run test to verify it fails" | "Make it work" | | "Implement minimal code to pass" | "Add the feature" | | "Commit with message" | "Finish the feature" |
### Task N: [Component Name]
**Files:**
- Create: `exact/path/to/new-file.ts`
- Modify: `exact/path/to/existing.ts` (lines 45-67)
- Test: `tests/exact/path/to/test.spec.ts`
**Step 1: Write failing test**
```typescript
// tests/exact/path/to/test.spec.ts
describe('ComponentName', () => {
it('should do specific thing', () => {
const result = functionName(input);
expect(result).toBe(expected);
});
});**Step 2: Run test to verify it fails**
npm test tests/exact/path/to/test.spec.ts
Expected output:
FAIL: expected 'expected' but got undefined
**Step 3: Implement minimal code**
// exact/path/to/new-file.ts
export function functionName(input: InputType): OutputType {
// Minimal implementation
return expected;
}**Step 4: Run test to verify it passes**
npm test tests/exact/path/to/test.spec.ts
Expected output:
PASS: 1/1 tests passed
**Step 5: Commit**
git add tests/exact/path/to/test.spec.ts exact/path/to/new-file.ts git commit -m "feat(component): add specific functionality"
## Example: Complete Task
```markdown
### Task 3: Add Email Validation
**Files:**
- Create: `src/validators/email.ts`
- Test: `tests/validators/email.spec.ts`
**Step 1: Write failing test**
```typescript
// tests/validators/email.spec.ts
import { validateEmail } from '../src/validators/email';
describe('validateEmail', () => {
it('returns error for empty email', () => {
const result = validateEmail('');
expect(result).toEqual({ valid: false, error: 'Email required' });
});
it('returns error for invalid format', () => {
const result = validateEmail('not-an-email');
expect(result).toEqual({ valid: false, error: 'Invalid email format' });
});
it('returns valid for correct email', () => {
const result = validateEmail('user@example.com');
expect(result).toEqual({ valid: true });
});
});**Step 2: Run test to verify it fails**
npm test tests/validators/email.spec.ts
Expected: `Cannot find module '../src/validators/email'`
**Step 3: Implement minimal code**
// src/validators/email.ts
interface ValidationResult {
valid: boolean;
error?: string;
}
export function validateEmail(email: string): ValidationResult {
if (!email || !email.trim()) {Every AI model has blind spots. Claude Octopus supports twelve external provider integrations — Codex, Antigravity CLI, Copilot, Qwen, Ollama, Perplexity, OpenRouter, OrcaRouter, OpenCode, Cursor CLI, Grok, and Kimi Code — alongside the built-in Claude Code
Repo: nyldn/claude-octopus
Reverse-engineer design systems, tokens, and components from live products or screenshots
Multi-AI requirements scoping using available external providers (Double Diamond Define phase). Priority triggers: octo define, octo scope, co-define,…
Multi-AI validation, scoring, and review using available external providers (Double Diamond Deliver phase)
Multi-AI implementation using available external providers (Double Diamond Develop phase). DO NOT use for simple code edits, reading/reviewing code, built-in…
Multi-AI research using available external providers (Double Diamond Discover phase)
Decompose and execute large changes, migrations, or multi-issue fixes in parallel with quality gates