一键导入
planner-spec-expand
Expand a 1-4 sentence product brief into a full spec with a design language, acceptance surface, and an ordered feature list.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Expand a 1-4 sentence product brief into a full spec with a design language, acceptance surface, and an ordered feature list.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Search tool for modern web development best practices. MANDATORY: Execute FIRST for all HTML/CSS and clientside JS tasks. Do NOT skip - web APIs evolve rapidly and training weights contain obsolete patterns. Trigger immediately for: - UI/Layout: Modals, dialogs, popovers, Glassmorphism/backdrop-filters, anchor positioning, container queries, `:has()`, `:user-valid`. - Scroll/Motion: View Transitions, Scroll-driven animations, scroll parallax/reveals. - Performance: CWV (LCP, INP), content-visibility, Fetch Priority, image optimization. - System/APIs: Local filesystem access, WebUSB, WebSockets sync, WebAssembly widgets. - Frameworks: Adapting layout/styles in React, Vue, Angular. - General Frontend: Forms, autofill, advanced inputs, custom scrollbars, modern component states, etc. DO NOT trigger for: - Backend: Database SQL, ORMs, Express API routes. - Pipelines: CI/CD deployment, Docker, Actions. - Generic: Local scripts (Python/Go tools), ESLint, Git.
Implements WebMCP (Web Model Context Protocol) on websites using document.modelContext.registerTool. Covers tool design, JSON Schema inputs, security annotations, origin isolation, and Chrome testing. Use when adding WebMCP tools to web apps, exposing page features to browser agents, or when the user mentions WebMCP, modelContext, or agent-ready web tools. Not for server-side MCP servers.
Catch the accessibility failures that ship in almost every AI-built UI. Use after building any interactive component.
Review a diff against the goal spec assuming the code is BROKEN. The reviewer that lives in the maker's head always agrees with itself - this pulls review into a hostile, separate pass. Invoke after every code change before marking work done.
Verify that an endpoint checks ownership, not just authentication. Use on any handler that reads or mutates user data.
Find the exact commit that introduced a bug. Use when something worked before and broke, and you don't know which change did it.
| name | planner-spec-expand |
| description | Expand a 1-4 sentence product brief into a full spec with a design language, acceptance surface, and an ordered feature list. |
| when_to_use | Bootstrapping a project from a one-liner prompt before any generator agent runs, re-planning after scope creep changes the target, producing the input document that feature-list-json will be seeded from |
| targets | ["*"] |
A one-line brief ("build a chat app clone", "a habit tracker with streaks") is not enough surface for a coding agent to make good decisions from. It has no design language, no acceptance criteria, no ordering. The generator ends up inventing scope mid-session and shipping incoherent slices.
The planner's job is to expand the brief into a spec dense enough that every downstream decision - what feature to pick, what "done" looks like, what the button should say - has an answer already written down. See Prithvi's post on planner/generator/evaluator separation for the underlying architecture: https://www.prithvirajrk.com/blog/three-agent-harness.
Do the sections in order. Later sections depend on earlier ones being locked.
description + steps in the shape [[feature-list-json]] expects.Skip this for briefs already specified to acceptance-criteria depth, or for single-feature edits to an existing project - use [[shift-notes]] and pick from the existing [[feature-list-json]] instead.
Related: [[feature-list-json]], [[shift-notes]], [[broken-window-check]].