shape-up skill

---
name: shape-up
description: >
  Guided Shape Up workflow for taking projects from idea to working software.
  Orchestrates the /shaping and /breadboarding skills through a structured
  process: Frame, Shape, Breadboard, Slice, Build. Works for both greenfield
  (0-1) and existing projects. Use when: starting a new project or feature,
  planning a significant change to an existing codebase, user says "shape this",
  "let's shape", "shape up", or wants to go from idea to implementation with
  structured problem/solution separation. Proactively guides each phase and
  suggests next steps.
---

# Shape Up

Orchestrate the full Shape Up workflow by invoking `/shaping` and `/breadboarding`
at the right moments. Be proactive — after each step, explain what was accomplished
and suggest the next move.

## Prerequisites

Requires the `/shaping` and `/breadboarding` skills to be installed. If missing,
instruct the user to install them from https://github.com/rjs/shaping-skills

## Workflow Overview

```
Frame → Shape → Breadboard → Slice → Build
```

| Phase | Purpose | Sub-skill | Output |
|-------|---------|-----------|--------|
| **Frame** | Capture the "why" | `/shaping` | Problem + Outcome |
| **Shape** | Separate problem from solution, iterate | `/shaping` | R (requirements) + selected Shape |
| **Breadboard** | Map affordances and wiring | `/breadboarding` | Affordance tables + diagram |
| **Slice** | Cut into demoable increments | `/breadboarding` | V1..V9 vertical slices |
| **Build** | Implement slice by slice | — | Working software |

## Entry Point Detection

Determine the project type, then follow the appropriate path:

**New project (empty or new directory)?** → Start at Phase 1: Frame
**Existing project with code?** → Start at Phase 0: Map Current System

## Phase 0: Map Current System (Existing Projects Only)

Before shaping a change to an existing codebase, understand what exists.

1. Ask: "What workflow or area of the system does this change affect?"
2. Read the relevant code to understand the current implementation
3. Invoke `/breadboarding` to map the existing system as `CURRENT`:
   - Trace the affected workflow through the code
   - Produce affordance tables (UI + Code) for the current system
   - Generate a wiring diagram showing how it works today

This `CURRENT` breadboard becomes the baseline. Proposed shapes will modify it.

**After completing:** Present the CURRENT breadboard and say:
> "Here's how the current system works. Now let's frame what we want to change.
> What problem are you trying to solve, or what outcome do you want?"

## Phase 1: Frame

Capture source material and distill it into Problem and Outcome.

1. Ask the user to describe what they want (or paste stakeholder quotes, requests, etc.)
2. Invoke `/shaping` — capture the description as Source material
3. Distill into:
   - **Problem** — What's broken, what pain exists
   - **Outcome** — What success looks like
4. Write to `shaping.md` in `.claude/` (or project root for standalone projects)

**After completing:** Present the frame and say:
> "Here's the frame. Does this capture the problem and desired outcome?
> Once confirmed, we'll start extracting requirements and sketching a solution."

## Phase 2: Shape

Iterate on problem (R) and solution (shapes) until a shape is selected.

1. Invoke `/shaping`
2. Offer both entry points:
   - **Start from R** — extract requirements from the frame
   - **Start from S** — if user already has a solution in mind, capture it as Shape A
3. Run the shaping loop:

```
Extract R → Sketch shape(s) → Fit check → Spike unknowns → Iterate
```

### Proactive Guidance During Shaping

After extracting initial R and Shape A, immediately show the fit check:

> "Here's R x A — the fit between requirements and the proposed solution."

Then suggest based on what the fit check reveals:

| Fit check shows | Suggest |
|----------------|---------|
| Flagged unknowns (warning markers) | "A2 is flagged — want me to spike it?" |
| Requirements failing | "R3 fails because [reason]. Should we revise the shape or adjust R3?" |
| All green | "The shape looks solid. Ready to breadboard?" |
| Multiple viable shapes | "Both A and B pass. Want to compare with `show me A x R` vs `B x R`?" |

### Shorthand Commands

Teach the user these as you go:

| Command | What it does |
|---------|-------------|
| `show me R x A` | Fit check: requirements against shape A |
| `show me A x R` | Rotated fit check: shape A against requirements |
| `spike A2` | Investigate a specific part in depth |
| `add R that...` | Add a new requirement |
| `sketch shape B` | Propose an alternative approach |

**Phase complete when:** A shape is selected (passes fit check, unknowns resolved).

> "Shape [X] is selected and all requirements pass. Ready to breadboard?"

## Phase 3: Breadboard

Detail the selected shape into concrete affordances with wiring.

1. Invoke `/breadboarding`
2. For existing projects: breadboard the **mixture** — existing + new affordances wired together
3. For new projects: breadboard from the shape's parts
4. Produce:
   - Places table
   - UI Affordances table
   - Code Affordances table
   - Wiring diagram (Mermaid)

**After completing:**
> "The breadboard shows [N] UI affordances, [N] code affordances across [N] places.
> Ready to slice into vertical increments?"

## Phase 4: Slice

Cut the breadboard into demoable vertical slices.

1. Invoke `/breadboarding` slicing procedure
2. Identify V1 as the minimal demoable increment
3. Layer additional capabilities as V2..V9
4. For each slice, define:
   - Which affordances it includes
   - What mechanism it demonstrates
   - A concrete demo statement

**After completing:** Present the slice summary and say:
> "We have [N] slices. V1 demos '[demo statement]'. Want to start building V1?"

## Phase 5: Build

Implement each slice, verify it works, then move to the next.

For each slice:

1. Create an implementation plan (`V[N]-plan.md`)
2. Build the slice
3. Verify: run and test to confirm the demo works
4. Update the Big Picture document with completion status

**After each slice:**
> "V[N] is complete — [demo statement] is working. Ready for V[N+1]?"

## File Management

| File | Purpose | Location |
|------|---------|----------|
| `shaping.md` | Ground truth for R, shapes, fit checks | `.claude/` or project root |
| `spike-[topic].md` | Investigation findings | `.claude/` or project root |
| `big-picture.md` | High-level summary of entire feature | `.claude/` or project root |
| `V[N]-plan.md` | Per-slice implementation plans | `.claude/` or project root |

## Resuming a Session

When invoked with an existing `shaping.md`:

1. Read the shaping doc to understand current state
2. Invoke `/shaping` — it will detect the existing doc and show the fit check for the selected shape
3. Identify what needs attention (unsolved requirements, pending slices)
4. Suggest the next action:
   - If shaping: "R4 is still undecided — want to discuss?"
   - If breadboarded: "Ready to slice?"
   - If sliced: "V3 is next — want to build it?"
   - If building: "V2 is complete. V3 demos '[statement]' — ready?"