Addy Osmani’s Agent Skills: Making Claude Code a Disciplined AI Coding Partner

This guide walks developers through the open‑source addyosmani/agent‑skills repository, explains its seven essential slash commands, shows how to install them via plugin or manual copy, demonstrates a complete AI‑assisted development loop, and compares the workflow with ECC agents.

Frontend AI Walk
Frontend AI Walk
Frontend AI Walk
Addy Osmani’s Agent Skills: Making Claude Code a Disciplined AI Coding Partner

Introduction

Who benefits? Developers who use Claude Code for writing requirements, modifying code, or pairing with AI, as well as newcomers.
Scope Only the seven slash commands and the required skill directories are covered; additional tools like browser MCP or CI pipelines can be added later.
Installation overview Two options: (1) plugin installation using /plugin install (which also installs the commands), or (2) manually copying the skills/ directory (the commands live in .claude/commands/ and will not appear in /help without the plugin).

What the repository provides

addyosmani/agent-skills is an open‑source skill pack that compresses the full development workflow – requirement → specification → task breakdown → incremental implementation → testing → review → shipping – into seven slash commands plus a set of Markdown SKILL.md files.

When installed, the model is forced to consider boundaries before generating code, reducing mindless code generation.

Core 7 Slash Commands (must master)

These commands cover the entire development lifecycle, forming a muscle memory for daily Claude Code usage.

Relation between commands and skills Each /xxx command reads the corresponding skills/<directory>/SKILL.md . The command files reside in .claude/commands/ . Copying only the Markdown files to ~/.claude/skills makes the skill descriptions available but does not expose the slash shortcuts in /help .

1. /spec – Requirement Specification (most important)

Purpose : Convert vague spoken requirements into a structured, testable specification.

Why it helps : Automates the “stage 0: slice the requirement” step, making the scope, acceptance criteria, and edge cases explicit before any code is written.

Directory : skills/spec-driven-development/ Try it :

/spec Implement a user registration form with mandatory phone number, email login support, and friendly error messages

The command returns a structured spec containing goals, scope, acceptance criteria, and open issues.

2. /plan – Task Breakdown & Impact Analysis

Purpose : Turn the spec into a list of small tasks and surface dependencies and potential failure points.

Where it fits : Mirrors the usual “stage 1: impact analysis” step – you see the map before changing code.

Directory : skills/planning-and-task-breakdown/ Example :

/plan Based on the previous spec, implement the registration form

The output is a task list with impact notes and suggested breakdowns, giving the developer confidence before invoking the AI.

3. /build – Incremental Implementation

Purpose : Apply the plan piece by piece instead of a massive diff.

Directory : skills/incremental-implementation/ Scenario : Prevents the “AI changes ten files at once, impossible to review” problem and aligns with the “small‑step PR” practice.

Example : /build Task 1: create the form component After each chunk, pause for a human review before proceeding.

4. /test – Test‑Driven Development & Verification

Purpose : Push the model to think about tests before implementation, binding verification into the workflow.

Directory : skills/test-driven-development/ Useful for core logic or behavior‑changing bugs; saves effort compared to “write code then add tests”.

5. /review – Code Review

Purpose : Run a pre‑merge check using the “senior colleague” standard.

Directory : skills/code-review-and-quality/ If you already use ECC’s Reviewer Agent, the semantics are similar, but this skill focuses on engineering conventions.

Example :

/review Show changes in the current branch

6. /code-simplify – Code Simplification

Purpose : Transform runnable code into a form that remains readable months later, curbing over‑clever AI output.

Directory :

skills/code-simplification/

7. /ship – Release Checklist

Purpose : Run a pre‑launch checklist (docs, version, rollback plan, etc.) to avoid hidden fire‑fighting costs.

Directory :

skills/shipping-and-launch/

Command‑Skill Mapping (minimal daily set)

/spec

spec-driven-development – "Specification first" – required for almost every new feature. /planplanning-and-task-breakdown – task breakdown & impact – used together with /spec. /buildincremental-implementation – write in small chunks – needed when a change touches many files. /testtest-driven-development – test‑driven – for core logic or behavior changes. /reviewcode-review-and-quality – pre‑merge screening – run before every merge. /code-simplifycode-simplification – readability cleanup – during refactor or finalization. /shipshipping-and-launch – launch checklist – executed on the actual release day.

Full Installation Workflow (recommended for Claude Code users)

Path A: Plugin Installation (recommended)

# 1. Add marketplace (use HTTPS if SSH is unavailable)
/plugin marketplace add https://github.com/addyosmani/agent-skills.git

# 2. Install the plugin
/plugin install agent-skills@addy-agent-skills

After a restart, the seven commands appear in the panel; this is the most hassle‑free route because you do not need to remember which directory to copy.

Path B: Manual Skill Copy (no plugin)

Suitable for users who refuse plugins or have unstable plugin sources; only the skill context is needed, not the slash buttons.
git clone https://github.com/addyosmani/agent-skills.git --depth 1
mkdir -p ~/.claude/skills
cp -r agent-skills/skills/{spec-driven-development,planning-and-task-breakdown,incremental-implementation,test-driven-development,code-review-and-quality} ~/.claude/skills/

With this path, /help will not list the slash shortcuts; you must invoke the skills via natural language or switch to Path A for button‑style execution.

Verify Installation

Restart Claude Code.

Run /help. If Path A was used, you should see /spec, /plan, /build, /test, /review, /code-simplify, and /ship.

Co‑existence with Existing Tools

If ECC or Superpowers already provide a /review command, keep the one you prefer and disable the duplicate.

Skill directories can coexist; resolve conflicts by disabling commands with identical names.

Daily AI‑Coding Loop (default after installation)

Requirement → /spec (pin the spec).

Plan → /plan (break tasks, assess impact).

Implement → /build (incremental slices).

Validate → /test (run tests, optionally lint / build locally).

Review → /review (pre‑merge check).

Finalize → /code-simplify (optional readability cleanup).

Ship → /ship (final checklist).

Choosing Between agent‑skills and Everything Claude Code

Form : agent‑skills offers 7 commands + Markdown skills; Everything Claude Code provides a full suite of agents, skills, and hooks.

Installation effort : agent‑skills is low (plugin or simple copy); Everything Claude Code often requires consulting profiles.

Daily presence : agent‑skills stays lightweight; the full suite can become noisy when many hooks are active.

Best fit : agent‑skills for teams that want a lightweight, standardized workflow without heavy overhead; Everything Claude Code for those needing a comprehensive engineering ecosystem.

Conclusion

The value of addyosmani/agent-skills lies not in the number of commands but in forcing the model to follow the engineer’s rhythm: /spec → /plan → /build → /test → /review → /ship. This chain encodes “think first, move in small steps, review before merging, and checklist before launch”, turning Claude Code from a free‑wheeling code generator into a disciplined pair‑programming partner.

Quick Start

Install the plugin :

/plugin marketplace add https://github.com/addyosmani/agent-skills.git

then /plugin install agent-skills@addy-agent-skills and restart.

Run a small real‑world task : Execute the full loop /spec → /plan → /build → /test → /review on a modest feature; you’ll see the reduction in rework.

Align with ECC : If you already use ECC, compare overlapping commands (e.g., /review) and keep the preferred set.

Original Source

Signed-in readers can open the original source through BestHub's protected redirect.

Sign in to view source
Republication Notice

This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactadmin@besthub.devand we will review it promptly.

Software Engineeringopen sourceAI DevelopmentClaude CodeAgent SkillsSlash Commands
Frontend AI Walk
Written by

Frontend AI Walk

Looking for a one‑stop platform that deeply merges frontend development with AI? This community focuses on intelligent frontend tech, offering cutting‑edge insights, practical implementation experience, toolchain innovations, and rich content to help developers quickly break through in the AI‑driven frontend era.

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.