prompt-export

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Prompt Export

提示词导出

Transform design artifacts into a sequenced
prompts.md
file that guides coding agents through incremental development.
将设计产物转换为有序的
prompts.md
文件,引导编码Agent完成增量开发。

Why This Exists

设计初衷

Breaks development into sequenced prompts with checkpoints, preventing agents from losing focus or making assumptions.
将开发拆解为带检查点的有序提示词,避免Agent偏离焦点或做出主观假设。

Input Requirements

输入要求

This skill expects upstream context from one or more of:
  • Problem framing document
  • PRD
  • UX spec (flows, screens, interactions)
  • Any combination of the above
If the user hasn't completed upstream work, suggest they start with
problem-framing
or
prd-generation
first.
本技能需要来自以下一项或多项的上游上下文:
  • 问题界定文档
  • PRD
  • UX 规格(流程、页面、交互)
  • 以上任意组合
如果用户尚未完成上游工作,建议他们先从
problem-framing
prd-generation
开始。

Workflow

工作流程

Step 1: Gather Artifacts

步骤1:收集产物

Ask the user to provide their design artifacts. Accept any format—markdown, docs, images of sketches, bullet points.
请用户提供其设计产物,支持任意格式:markdown、文档、草图图片、要点列表。

Step 2: Extract Key Elements

步骤2:提取关键元素

From the provided artifacts, identify:
ElementSource
Project overviewProblem statement, target user
Core featuresPRD, solution scope
User flowsUX spec
Screen/component descriptionsUX spec
Interactions & statesUX spec
Tech preferencesUser input or infer from context
ConstraintsMVP scope, what's out
Success criteriaProblem framing, PRD
从提供的产物中识别以下内容:
元素来源
项目概述问题陈述、目标用户
核心功能PRD、解决方案范围
用户流程UX spec
页面/组件描述UX spec
交互与状态UX spec
技术偏好用户输入或从上下文推断
约束条件MVP范围、排除项
成功标准问题界定、PRD

Step 3: Clarify Gaps

步骤3:澄清信息缺口

If critical information is missing, ask targeted questions:
  • "What tech stack do you want? (React, vanilla JS, etc.)"
  • "Any specific libraries or frameworks to use or avoid?"
  • "Mobile-first, desktop-first, or responsive?"
  • "Any authentication or data persistence needs?"
Keep questions minimal—infer where possible.
如果缺少关键信息,提出针对性问题:
  • "你希望使用什么技术栈?(React、vanilla JS等)"
  • "有没有需要使用或避免的特定库或框架?"
  • "优先适配移动端、优先适配桌面端,还是响应式?"
  • "有没有身份认证或数据持久化需求?"
尽量减少提问,可推断的内容直接推断。

Step 4: Decompose Into Prompts

步骤4:拆解为提示词

Break the project into a logical sequence. Typical prompt sequence:
  1. Project setup — scaffold, dependencies, config
  2. Data/state foundation — types, schemas, state structure
  3. Core component(s) — one prompt per major component or screen
  4. Feature implementation — one prompt per feature
  5. Integration — connect components, wire up flows
  6. Polish — error states, loading states, edge cases
  7. Final review — cleanup, optimization, documentation
Adapt based on project complexity. Simple projects might be 3-4 prompts. Complex ones might be 10+.
将项目拆分为逻辑序列,典型的提示词序列如下:
  1. 项目搭建 — 脚手架、依赖、配置
  2. 数据/状态基础 — 类型、schemas、状态结构
  3. 核心组件 — 每个主要组件或页面对应一个提示词
  4. 功能实现 — 每个功能对应一个提示词
  5. 集成 — 连接组件、打通流程
  6. 优化 — 错误状态、加载状态、边界场景处理
  7. 最终审查 — 代码清理、性能优化、文档补充
可根据项目复杂度调整,简单项目可能仅需3-4个提示词,复杂项目可能需要10个以上。

Step 5: Generate prompts.md

步骤5:生成prompts.md

Output a single file the user can reference as they work through Claude Code.
输出单个文件,供用户在使用Claude Code时参考。

Output Format

输出格式

Automatically save the output to
prompts.md
(in project root) using the Write tool
while presenting it to the user.
markdown
undefined
向用户展示内容的同时,使用Write工具自动将输出保存到项目根目录下的
prompts.md
markdown
undefined

[Project Name] — Development Prompts

[Project Name] — Development Prompts

Context

Context

[2-3 sentences: what this is, who it's for, core problem it solves]
Tech stack: [framework, styling, key libraries] Key constraints: [what's in/out of scope]

[2-3 sentences: what this is, who it's for, core problem it solves]
Tech stack: [framework, styling, key libraries] Key constraints: [what's in/out of scope]

Prompt 1: Project Setup

Prompt 1: Project Setup

[Prompt text the user pastes into Claude Code]
Goal: [What this accomplishes] Checkpoint: [How to verify it worked before moving on]

[Prompt text the user pastes into Claude Code]
Goal: [What this accomplishes] Checkpoint: [How to verify it worked before moving on]

Prompt 2: [Name]

Prompt 2: [Name]

[Prompt text]
Goal: [What this accomplishes] Checkpoint: [How to verify]

[Prompt text]
Goal: [What this accomplishes] Checkpoint: [How to verify]

Prompt 3: [Name]

Prompt 3: [Name]

[Prompt text]
Goal: [What this accomplishes] Checkpoint: [How to verify]

[Continue for all prompts...]

[Prompt text]
Goal: [What this accomplishes] Checkpoint: [How to verify]

[Continue for all prompts...]

Final Checklist

Final Checklist

  • [Success criterion 1]
  • [Success criterion 2]
  • [Success criterion 3]
undefined
  • [Success criterion 1]
  • [Success criterion 2]
  • [Success criterion 3]
undefined

Prompt Writing Guidelines

提示词编写规范

Each prompt should:
  • Be self-contained — agent shouldn't need to read previous prompts
  • Reference existing files — "In
    src/components/Header.jsx
    , add..."
  • Specify acceptance criteria — what "done" looks like
  • Stay focused — one logical unit of work
Good prompt:
"Create a TaskList component in src/components/TaskList.jsx that displays an array of tasks. Each task shows a title, due date, and completion checkbox. Clicking the checkbox toggles completion state. Use Tailwind for styling. The component receives tasks as a prop."
Bad prompt:
"Build the task management features."
每个提示词应当:
  • 自包含 — Agent不需要阅读之前的提示词即可执行
  • 引用现有文件 — 例如"在
    src/components/Header.jsx
    中,添加…"
  • 明确验收标准 — 清晰说明"完成"的定义
  • 保持聚焦 — 仅对应一个逻辑工作单元
正面示例:
"Create a TaskList component in src/components/TaskList.jsx that displays an array of tasks. Each task shows a title, due date, and completion checkbox. Clicking the checkbox toggles completion state. Use Tailwind for styling. The component receives tasks as a prop."
反面示例:
"Build the task management features."

Adaptation Guidelines

适配规范

Simple project (3-5 prompts):
  • Setup → Core UI → Features → Polish
Medium project (5-8 prompts):
  • Setup → Data layer → Screen 1 → Screen 2 → Feature A → Feature B → Integration → Polish
Complex project (10+ prompts):
  • Consider grouping into phases with phase summaries
  • Add dependency notes ("Run after Prompt 3")
  • Include rollback hints for risky steps
简单项目(3-5个提示词):
  • 搭建 → 核心UI → 功能 → 优化
中等项目(5-8个提示词):
  • 搭建 → 数据层 → 页面1 → 页面2 → 功能A → 功能B → 集成 → 优化
复杂项目(10+提示词):
  • 可考虑分阶段并添加阶段概述
  • 添加依赖说明(例如"在提示词3之后运行")
  • 为高风险步骤添加回滚提示

Handoff

交接

After presenting the prompts, inform the user:
"Work through these prompts sequentially with Claude Code—each builds on the last. Check the checkpoint before moving to the next prompt."
Offer to:
  • Adjust prompt granularity (more/fewer steps)
  • Reorder sequence
  • Add detail to specific prompts
Note: File is automatically saved to
prompts.md
in the project root.
向用户展示完提示词后,告知用户:
"按顺序在Claude Code中使用这些提示词,每个提示词都基于上一个的输出构建。进入下一个提示词前请先确认检查点已达标。"
可主动提供以下服务:
  • 调整提示词粒度(增加/减少步骤)
  • 调整提示词顺序
  • 为特定提示词补充细节
**注意:文件会自动保存到项目根目录下的
prompts.md
中。"