gsd-sketch

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

<objective> Explore design directions through throwaway HTML mockups before committing to implementation. Each sketch produces 2-3 variants for comparison. Sketches live in `.planning/sketches/` and integrate with GSD commit patterns, state tracking, and handoff workflows. Loads spike findings to ground mockups in real data shapes and validated interaction patterns.

Two modes:

Idea mode (default) — describe a design idea to sketch
Frontier mode (no argument or "frontier") — analyzes existing sketch landscape and proposes consistency and frontier sketches

Does not require prior new-project setup — auto-creates

.planning/sketches/

if needed. </objective>

<execution_context> @~~/.claude/gsd-core/workflows/sketch.md @~~/.claude/gsd-core/workflows/sketch-wrap-up.md @~~/.claude/gsd-core/references/ui-brand.md @~~/.claude/gsd-core/references/sketch-theme-system.md @~~/.claude/gsd-core/references/sketch-interactivity.md @~~/.claude/gsd-core/references/sketch-tooling.md @~/.claude/gsd-core/references/sketch-variant-patterns.md </execution_context>

<runtime_note> Copilot (VS Code): Use

vscode_askquestions

wherever this workflow calls

AskUserQuestion

. </runtime_note>

<context> Design idea: $ARGUMENTS

Available flags:

```
--quick
```
— Skip mood/direction intake, jump straight to decomposition and building. Use when the design direction is already clear.
```
--wrap-up
```
— Package sketch design findings into a persistent project skill for future build conversations. Runs the sketch-wrap-up workflow. </context>

<process> Parse the first token of $ARGUMENTS: - If it is `--wrap-up`: strip the flag, execute the sketch-wrap-up workflow end-to-end. - Otherwise: execute the sketch workflow end-to-end.

Preserve all workflow gates (intake, decomposition, target stack research, variant evaluation, MANIFEST updates, commit patterns). </process>

<objective> 在投入开发前，通过一次性HTML原型探索设计方向。每次绘制会生成2-3个变体用于对比。草图存储在`.planning/sketches/`目录中，并与GSD提交模式、状态跟踪和交接工作流集成。加载探索结果，使原型基于真实数据结构和经过验证的交互模式。

两种模式：

创意模式（默认）——描述设计想法进行绘制
前沿模式（无参数或输入"frontier"）——分析现有草图情况，提出一致性和前沿方向的绘制建议

无需预先进行新项目设置——如果需要会自动创建

.planning/sketches/

目录。 </objective>

<runtime_note> Copilot (VS Code)： 当此工作流调用

AskUserQuestion

时，使用

vscode_askquestions

。 </runtime_note>

<context> 设计想法：$ARGUMENTS

可用标志：

```
--quick
```
— 跳过风格/方向收集，直接进入分解和构建环节。适用于设计方向已明确的场景。
```
--wrap-up
```
— 将草图设计成果打包为持久化项目技能，用于未来的开发对话。运行sketch-wrap-up工作流。 </context>

<process> 解析$ARGUMENTS的第一个令牌： - 如果是`--wrap-up`：移除该标志，完整执行sketch-wrap-up工作流。 - 否则：完整执行sketch工作流。

保留所有工作流关卡（需求收集、分解、目标栈研究、变体评估、MANIFEST更新、提交模式）。 </process>