Component specification toolkit for breaking software projects into discrete, buildable blocks. Create detailed specifications with interfaces, dependencies, test criteria, and effort estimates for Claude Code to build incrementally.
npx claudepluginhub flight505/claude-project-planner --plugin claude-project-plannerThis skill is limited to using the following tools:
Building blocks are discrete, independently buildable components that together form a complete software system. This skill helps you decompose projects into well-specified blocks that Claude Code can build incrementally, with clear interfaces, dependencies, and acceptance criteria.
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
Building blocks are discrete, independently buildable components that together form a complete software system. This skill helps you decompose projects into well-specified blocks that Claude Code can build incrementally, with clear interfaces, dependencies, and acceptance criteria.
This skill should be used when:
When documenting building blocks, always include diagrams.
Use the project-diagrams skill to generate:
python .claude/skills/project-diagrams/scripts/generate_schematic.py "diagram description" -o diagrams/output.png
| Type | Description | Examples |
|---|---|---|
| frontend | User interface components | Dashboard, Forms, Navigation |
| backend | Server-side services | Auth Service, API Gateway, Business Logic |
| infrastructure | Platform and DevOps | CI/CD, Monitoring, Database Setup |
| integration | External system connectors | Payment Gateway, Email Service, Third-party APIs |
| shared | Cross-cutting components | Logging, Configuration, Utilities |
building_block:
# Identity
name: "string - clear, descriptive name"
id: "string - unique identifier (e.g., BB-001)"
type: "frontend | backend | infrastructure | integration | shared"
# Description
description: "string - what this block does and why"
responsibilities:
- "string - specific responsibility 1"
# Dependencies
dependencies:
internal:
- block_id: "BB-XXX"
type: "required | optional"
interface: "interface name"
external:
- name: "PostgreSQL"
version: ">=14.0"
purpose: "Primary data storage"
# Interfaces
interfaces:
api_endpoints:
- method: "GET | POST | PUT | PATCH | DELETE"
path: "/api/v1/resource"
description: "What this endpoint does"
request_schema: "schema reference or inline"
response_schema: "schema reference or inline"
auth_required: true | false
events_published:
- name: "event.name"
description: "When this event is emitted"
payload_schema: "schema reference"
events_consumed:
- name: "event.name"
description: "How this block responds"
data_contracts:
- name: "Contract name"
description: "Data structure shared"
schema: "schema reference"
# Estimation
complexity: "S | M | L | XL"
estimated_hours: number
story_points: number
# Quality
test_criteria:
- "string - acceptance criterion 1"
# Metadata
priority: "critical | high | medium | low"
sprint_assignment: "Sprint N"
owner: "string - responsible team/person"
| Complexity | Hours | Story Points | Characteristics |
|---|---|---|---|
| S (Small) | 4-8 | 1-2 | Single responsibility, minimal dependencies, straightforward |
| M (Medium) | 16-24 | 3-5 | Multiple responsibilities, some dependencies, standard patterns |
| L (Large) | 32-48 | 8-13 | Complex logic, multiple dependencies, custom implementations |
| XL (Extra Large) | 48-80 | 13-21 | Highly complex, many dependencies, novel solutions needed |
Start with domain-driven decomposition:
For each domain, identify components by asking:
For each component, define: API contracts (REST, GraphQL), event contracts (messages published/consumed), data contracts (shared structures).
Create a dependency graph. Rules: no circular dependencies, minimize dependency chains, shared components at the bottom, infrastructure before business logic.
For each block: review similar past work, consider complexity factors, apply velocity adjustments, add 20-30% buffer.
For detailed specification examples (backend service, frontend component, infrastructure block), see references/examples.md.
Primary output file listing all blocks:
metadata:
project: "[Project Name]"
total_blocks: N
total_estimated_hours: N
version: "1.0.0"
building_blocks:
- name: "Block 1"
id: "BB-001"
# ... full specification
dependency_graph:
- from: "BB-002"
to: "BB-001"
type: "required"
build_order:
- phase: 1
blocks: ["BB-001", "BB-100"]
- phase: 2
blocks: ["BB-002", "BB-003"]
For complex blocks, create detailed specs:
components/
├── building_blocks.yaml # Master list
├── component_specs/
│ ├── BB-001_auth_service.md # Detailed spec
│ ├── BB-002_user_service.md
│ └── BB-020_dashboard_ui.md
└── interfaces/
├── api_contracts.yaml # OpenAPI specs
└── event_contracts.yaml # Event schemas
Do's: Keep blocks focused (single responsibility), make independently testable, define interfaces before implementation, include error handling in test criteria, version interface contracts, document why blocks are separated.
Don'ts: Create blocks too small (< 4 hours) or too large (> 80 hours), have hidden dependencies, specify implementation details in interfaces, skip test criteria, forget infrastructure blocks.