annotate-a-wireframe
Annotate a wireframe with behavior, content, states, accessibility, data, and unresolved decisions for implementation review. Use when boxes and arrows alone cannot communicate how the interface should work.
ソース情報
- リポジトリ
- protosphinx/sphinxstack
- ソースの最終更新活動
- 2026年7月29日 13:55
- 検出された SKILL.md の言語
- 英語
- スター
- 3
- フォーク
- 0
インストール方法
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
ソースファイルを確認
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
ファイルエクスプローラー
2 ファイルSKILL.md を表示中
SKILL.md
ソースの指示 · 読み取り専用プレビュー- name
- annotate-a-wireframe
- category
- design
- description
- Annotate a wireframe with behavior, content, states, accessibility, data, and unresolved decisions for implementation review. Use when boxes and arrows alone cannot communicate how the interface should work.
# annotate-a-wireframe
Annotate decisions and uncertainty, not every visible pixel.
## When to use
- Use before design review, content review, technical planning, or handoff.
- Do not use annotations to hide missing user flows or unapproved requirements.
## Procedure
1. Give every screen and annotation a stable identifier and version.
2. Mark entry conditions, user goal, primary path, alternate path, and exit outcome.
3. Annotate content source, ownership, truncation, localization, and privacy sensitivity.
4. Describe interactions, keyboard and focus behavior, navigation, validation, confirmation, and undo.
5. Include loading, empty, error, partial, offline, permission, and responsive states.
6. Identify data inputs, outputs, authority, retention, and unavailable dependencies.
7. Label assumptions, open questions, decisions, owner, and review status.
8. Export a readable document with links to related flow and requirements.
## Done
- An annotated wireframe file identifies flows, states, behavior, content, accessibility, data, assumptions, and owners
- A reviewer check confirms every annotation resolves to a decision, question, dependency, or observable implementation outcome
GitHubで見る