Agent skill

Design Ship

by yonatangross in yonatangross/orchestkit

One-shot pipeline turning a claude.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR.

MITAuto-check: notesDevelopment

Install Design Ship

skills CLI
$ npx skills add yonatangross/orchestkit --skill design-ship -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install yonatangross/orchestkit design-ship --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/yonatangross/orchestkit.git skills-src && mkdir -p .claude/skills && cp -r skills-src/src/skills/design-ship .claude/skills/design-ship && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
design-ship
GitHub stars
292
Token cost
~2.3k tokens
SKILL.md length
392 words
Files
1
Skills in repo
108
Repo updated
First seen
Licence
MIT

At a glance

One-shot pipeline turning a claude.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR.

  • Works in 5 steps: Import → Cover → Expect → …
  • A design link should come back as a PR with no intermediate steps
  • SKILL.md covers When to use, Pipeline, Pre-flight and Phase 1 — Import, plus 8 more sections
  • Reaches claude.ai

What it does

Design Ship is an agent skill from yonatangross/orchestkit. One-shot pipeline turning a claude.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR. Use when a design link should come back as a PR with no intermediate steps; if all you need is the components written to disk, run /ork:design-import instead.

Its SKILL.md is about 2.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts. Compatibility notes: Claude Code 2.1.277+. Requires: design-import skill, claude-design-orchestrator agent. Composes: cover, expect, create-pr.

It sits in Development, covering Pull requests. The repository describes itself as: The Complete AI Development Toolkit for Claude Code. 106 skills, 36 agents, 171 hooks. Install ork for stable (v9.x), or ork-alpha for the v10 line, which ships daily. The licence is MIT.

When your agent uses it

  • A design link should come back as a PR with no intermediate steps
  • All you need is the components written to disk
  • Run /ork:design-import instead

Example prompts

  • “/design-ship”

Requirements

  • Python 3
  • Compatibility (from SKILL.md): Claude Code 2.1.277+. Requires: design-import skill, claude-design-orchestrator agent. Composes: cover, expect, create-pr.
  • Pre-approved tools (allowed-tools): Read, Write, Edit, Glob, Grep, Bash, WebFetch, AskUserQuestion, Agent, TaskCreate, TaskUpdate, TaskList

Workflow steps

5 steps, taken from the step headings in SKILL.md.

  1. Import
  2. Cover
  3. Expect
  4. Create PR
  5. Update provenance

What it can do on your machine

Read from SKILL.md and the folder at commit e4ff8d9. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves these tools, so the agent can use them without asking each time:

    • Read
    • Write
    • Edit
    • Glob
    • Grep
    • Bash
    • WebFetch
    • AskUserQuestion
    • Agent
    • TaskCreate

    …and 2 more on the same allowed-tools line.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are python and bash).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • claude.ai

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

  • Compatibility

    Claude Code 2.1.277+. Requires: design-import skill, claude-design-orchestrator agent. Composes: cover, expect, create-pr.

    From compatibility in the SKILL.md frontmatter.

Context cost

Design Ship loads about 2.3k tokens when it runs. Until then it costs about 91 tokens; SKILL.md has 392 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~91
When it runs · the whole SKILL.md, loaded when a task matches
~2.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check: notes

The automated check noted patterns worth knowing about, such as sudo or a known installer.

  • NotePre-approves every shell command (allowed-tools: Bash)SKILL.md
    allowed-tools: Read, Write, Edit, Glob, Grep, Bash, WebFetch, AskUserQuestion, Agent, TaskCreate, TaskUpdate, TaskL

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from yonatangross/orchestkit at commit e4ff8d9, republished under its MIT licence (© yonatangross). 392 words, ~2,294 tokens.

Download SKILL.mdSave it as .claude/skills/design-ship/SKILL.md (or your agent's skills folder).
name
design-ship
description
One-shot pipeline turning a claude.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR. Use when a design link should come back as a PR with no intermediate steps; if all you need is the components written to disk, run /ork:design-import instead.
allowed-tools
Read, Write, Edit, Glob, Grep, Bash, WebFetch, AskUserQuestion, Agent, TaskCreate, TaskUpdate, TaskList
compatibility
Claude Code 2.1.277+. Requires: design-import skill, claude-design-orchestrator agent. Composes: cover, expect, create-pr.
license
MIT
argument-hint
<handoff-url | path-to-bundle.json>
context
fork
background
false
user-invocable
true
effort
high
model
sonnet
agent
claude-design-orchestrator
skills
design-import, cover, expect, remember, memory
metadata.category
workflow-automation

Design Ship

One command: Claude Design handoff URL → reviewable GitHub PR.

bash
design-ship https://claude.ai/design/abc123     # From handoff URL
design-ship /tmp/handoff-bundle.json            # From local file

When to use

You have a Claude Design handoff URL (or file) and want a PR opened against the current branch. No intermediate steps, no manual test generation, no manual PR drafting.

For just-the-import (no tests, no PR), use design-import instead.

Pipeline

Handoff bundle (URL or file)
  │
  ▼
┌──────────────────────────────┐
│ 1. design-import         │  Scaffold components, write provenance
│    (delegates to orchestrator │  Tokens reconciled
│     for parse + dedup)        │  Components written or reused
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 2. cover                 │  Storybook stories per new component
│    (Storybook + Playwright)   │  Playwright E2E for new routes/views
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 3. expect                │  Diff-aware browser verification
│    (CDP + ARIA-tree-first)    │  Screenshots saved for PR body
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 4. create-pr             │  PR opened with:
│                               │   - Claude Design URL link
│                               │   - Before/after screenshots
│                               │   - Component scaffold list
│                               │   - Coverage delta
│                               │   - Label: claude-design
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 5. UPDATE PROVENANCE          │  Patch .claude/design-handoffs/<id>.json
│                               │  with the opened PR number + URL
└──────────────────────────────┘

Pre-flight

Before starting the pipeline, verify the working tree is clean enough to ship:

python
status = Bash("git status --porcelain")
if status:
    AskUserQuestion(questions=[{
      "question": "Working tree has uncommitted changes. How to proceed?",
      "header": "Pre-flight",
      "options": [
        {"label": "Commit them first", "description": "Run commit, then proceed with ship"},
        {"label": "Stash and restore", "description": "Stash now, restore after PR opens"},
        {"label": "Include in this PR", "description": "Risky — only if changes are related"},
        {"label": "Cancel", "description": "Abort design-ship"}
      ],
      "multiSelect": False
    }])

current_branch = Bash("git branch --show-current")
if current_branch in ("main", "master", "dev"):
    AskUserQuestion(questions=[{
      "question": f"You're on {current_branch}. Create a feature branch?",
      "header": "Branch",
      "options": [
        {"label": "Yes — feat/design-ship-<bundle-id>", "description": "Recommended"},
        {"label": "Cancel", "description": "Switch branch yourself first"}
      ],
      "multiSelect": False
    }])

Phase 1 — Import

Delegate to design-import with the bundle argument. Capture its output (the import manifest) — it includes the bundle_id, list of components written, and the provenance file path.

If import fails, stop. Do NOT proceed to test generation against partially-imported components.

Phase 2 — Cover

Run cover scoped to the components written by phase 1:

python
component_paths = [c["path"] for c in import_result["components"] if c["decision"] != "reuse"]

Agent(
  subagent_type="ork:test-generator",
  description="Cover the freshly-imported components",
  prompt=f"""Use the cover skill to generate tests for these components (scoped — do not regenerate suites for unrelated files):
  {component_paths}

  Tiers needed:
  - Storybook stories per component (mandatory)
  - Playwright E2E if any new route was registered (check src/app or src/pages)
  - Unit tests if the components include non-trivial logic (skip for pure-presentation)
  """
)

Phase 3 — Expect

Run expect to do diff-aware browser verification. This produces the screenshots that go into the PR body:

python
Agent(
  subagent_type="ork:expect-agent",
  description="Diff-aware verification of imported components",
  prompt=f"""Use the expect skill on the current diff.

  Extra: capture before/after screenshots for each new component
  and save them to .claude/design-handoffs/{bundle_id}/screenshots/.
  These will be uploaded to the PR body.

  If verification fails, do not block — report findings and continue.
  Failures will surface in the PR review.
  """
)

Phase 4 — Create PR

Use create-pr with a body templated from the bundle and verification results:

python
pr_body = f"""## Summary
Generated from Claude Design handoff: {bundle_url}

Bundle ID: `{bundle_id}` · Provenance: `.claude/design-handoffs/{bundle_id}.json`

## Components
| Decision | Component | Path |
|---|---|---|
{table_from(import_result['components'])}

## Tokens
- Added: {len(token_diff['added'])}
- Modified: {len(token_diff['modified'])}
- Conflicts (resolved): {len(token_diff['conflicts'])}

## Verification (`expect`)
{expect_summary}

## Coverage delta (`cover`)
{coverage_delta}

## Screenshots
{screenshot_table}

---
🤖 Opened by `design-ship` · Closes: (none — link issues manually)
"""

Bash(f"gh pr create --title '{pr_title}' --body @- <<< '{pr_body}' --label claude-design")

Phase 5 — Update provenance

Patch the provenance file with the opened PR number and URL:

python
provenance = Read(f".claude/design-handoffs/{bundle_id}.json")
provenance["pr"] = {"number": pr_number, "url": pr_url, "opened_at": now()}
Write(f".claude/design-handoffs/{bundle_id}.json", provenance)

Failure modes

PhaseFailureBehavior
Pre-flightDirty tree, on mainAskUserQuestion, do not proceed silently
1. ImportSchema deviation, token conflictdesign-import already prompts; if user cancels, abort
2. CoverTest generation failsContinue to expect — tests are recoverable in PR review
3. ExpectBrowser verification failsContinue to PR — failures noted in PR body
4. Create PRgh not authenticatedStop, surface auth error
5. ProvenanceFile not writableWarn but do not fail (PR is already open)
Show full SKILL.md (140 more words)Show less

Composition

SkillRole
design-importPhase 1 — scaffold components
coverPhase 2 — Storybook + Playwright
expectPhase 3 — diff-aware browser verification
create-prPhase 4 — open PR with templated body
remember / memoryProvenance updates

NOT this skill's job

ConcernOwned by
Parsing bundlesclaude-design-orchestrator agent (called by design-import)
Component dedupOrchestrator agent (called by design-import)
Test execution (CI)GitHub Actions — this skill only generates tests
Merging the PRHuman reviewer — never auto-merge

Limitations

  • No auto-merge: this skill opens the PR; humans review and merge.
  • No iteration loop: if the PR review surfaces design changes, you currently re-export from Claude Design and re-run design-ship. The reverse-path (live UI drift → refinement prompt for claude.ai/design) is tracked in M124 — Claude Design Drift Sync (Bet B): #1391 (PR hook), #1393 (design-iterate), #1395 (design-drift-detector agent).
  • Single-bundle scope: one invocation, one bundle, one PR. Multi-bundle batches are not supported.

© yonatangross, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in src/skills/design-ship of yonatangross/orchestkit.

Open the folder on GitHubat commit e4ff8d9

Compare with similar skills

Design Ship next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Design Ship compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Design Ship this skillyonatangross/orchestkit292—~2.3kAutomated safety check: NotesMIT
Finishing a Development Branchobra/superpowers297k5 repos~1.9kAutomated safety check: PassMIT
PR Babysitteropeninterpreter/openinterpreter69k3 repos~4.2kAutomated safety check: PassApache-2.0
Check PRonyx-dot-app/onyx32k2 repos~2.3kAutomated safety check: PassMIT
PR Design DocOpenHands/OpenHands91k—~2.4kAutomated safety check: PassMIT
WooCommerce Code Reviewwoocommerce/woocommerce11k3 repos~1.1kAutomated safety check: PassCustom licence

Similar skills

  • Walks the last step of a branch: confirm tests pass, detect the git environment, ask how to integrate, carry out your choice and clean up the worktree.

    297k GitHub starsUsed in 5 repos~1.9k tokens
    DevelopmentAuto-check passed
  • PR Babysitter

    openinterpreter/openinterpreter

    Watches an open GitHub pull request until it merges, handling review comments, diagnosing CI failures and retrying flaky checks along the way.

    69k GitHub starsUsed in 3 repos~4.2k tokens
    DevelopmentAuto-check passed
  • Check PR

    onyx-dot-app/onyx

    Checks a GitHub, GitLab, or Perforce (p4) pull request (or merge request, or shelved changelist) for unresolved review comments, failing status checks, and incomplete PR descriptions.

    32k GitHub starsUsed in 2 repos~2.3k tokens
    DevelopmentAuto-check passed
  • PR Design Doc

    OpenHands/OpenHands

    For a non-trivial pull request, write a self-contained HTML design doc under the temporary .pr/ directory and link a visibility-appropriate preview in the PR description, so maintainers grasp the…

    91k GitHub stars~2.4k tokensUpdated today
    DevelopmentAuto-check passed
  • WooCommerce Code Review

    woocommerce/woocommerce

    Reviews WooCommerce code changes against the project's standards, flagging backend PHP architecture, naming, documentation, data integrity and testing violations.

    11k GitHub starsUsed in 3 repos~1.1k tokens
    DevelopmentAuto-check passed
  • Record PR Demo

    payloadcms/payload

    A skill your agent uses when a Payload pull request needs a concise visual walkthrough for reviewers.

    45k GitHub stars~1k tokensUpdated yesterday
    DevelopmentAuto-check passed

More from yonatangross/orchestkit

All 107 skills in this repo
  • API Design

    yonatangross/orchestkit

    API contract design for REST and GraphQL, covering resource shape, URL and header versioning with deprecation windows, RFC 9457 Problem Details error handling, and OpenAPI specs.

    292 GitHub stars~2.9k tokensUpdated today
    Auto-check passed
  • Architecture Decision Record

    yonatangross/orchestkit

    ADR templates in the Nygard format with context, decision, consequences, and alternatives.

    292 GitHub stars~2k tokensUpdated today
    Auto-check passed
  • Audit Full

    yonatangross/orchestkit

    Single-pass codebase analysis leveraging a 1M-token context window for comprehensive security scanning, architecture review, and dependency auditing.

    292 GitHub stars~3.5k tokensUpdated today
    Auto-check: notes
  • Code Review Playbook

    yonatangross/orchestkit

    Structured review processes, conventional comments, language-specific checklists, and feedback templates.

    292 GitHub stars~2.2k tokensUpdated today
    Auto-check passed
  • Create PR

    yonatangross/orchestkit

    Creates GitHub pull requests with pre-flight validation, conventional title formatting, and structured summary generation.

    292 GitHub stars~4.5k tokensUpdated today
    Auto-check: notes
  • Explore

    yonatangross/orchestkit

    Multi-angle codebase exploration spawning 3-5 parallel agents for code structure, data flow, architecture patterns, and health assessment.

    292 GitHub stars~3.9k tokensUpdated today
    Auto-check: notes

Categories

Questions about Design Ship

What does Design Ship do?

One-shot pipeline turning a claude.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR. Design Ship is an agent skill from yonatangross/orchestkit.ai/design link into a pull request: scaffold via /ork:design-import, stories and specs via /ork:cover, browser verification via /ork:expect, then open the PR.

When should I use Design Ship?

Design Ship fits situations like: A design link should come back as a PR with no intermediate steps; all you need is the components written to disk; run /ork:design-import instead.

How do I install Design Ship in Claude Code?

Run `npx skills add yonatangross/orchestkit --skill design-ship -a claude-code`. Or copy the skill folder (src/skills/design-ship in yonatangross/orchestkit) into .claude/skills/design-ship in your project. Claude Code loads it when a task matches its description.

How do I install Design Ship in Codex?

Run `npx skills add yonatangross/orchestkit --skill design-ship -a codex`. Or copy the skill folder (src/skills/design-ship in yonatangross/orchestkit) into .agents/skills/design-ship in your project. Codex loads it when a task matches its description.

Can I use Design Ship in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add yonatangross/orchestkit --skill design-ship -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/design-ship, .gemini/skills/design-ship, .github/skills/design-ship and .opencode/skills/design-ship in your project.

What does Design Ship need to run?

SKILL.md names no scripts, command-line tools or credentials: Design Ship is instructions for the agent only. Our summary lists: Python 3. Its frontmatter pre-approves these tools: Read, Write, Edit, Glob, Grep, Bash, WebFetch, AskUserQuestion, Agent, TaskCreate, TaskUpdate, TaskList. Compatibility (from SKILL.md): Claude Code 2.1.277+. Requires: design-import skill, claude-design-orchestrator agent. Composes: cover, expect, create-pr..

Does Design Ship access the network?

SKILL.md names 1 domain. In commands or code: claude.ai; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Design Ship safe to install?

Our automated static check of SKILL.md found notes only (pre-approves every shell command (allowed-tools: bash)), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.

What licence does Design Ship use?

Design Ship is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Design Ship use?

About 2.3k tokens (SKILL.md is roughly 9.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Design Ship?

Skills that share tags, products or a category with Design Ship: Finishing a Development Branch (obra/superpowers, 297k stars), PR Babysitter (openinterpreter/openinterpreter, 69k stars), Check PR (onyx-dot-app/onyx, 32k stars) and PR Design Doc (OpenHands/OpenHands, 91k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Design Ship?

yonatangross (a GitHub user) maintains it in yonatangross/orchestkit, which has 292 GitHub stars. The repository holds 108 skills in this directory. The repository was last updated on October 10, 2026.

Source: yonatangross/orchestkit on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.