designcontent-media
wireframe-builder
Web/アプリの画面ワイヤーフレーム（構造・レイアウト・導線）をASCII図とMarkdown注釈で作成するSkill。 「ワイヤーフレームを作って」「画面構成を設計して」「画面のレイアウトを考えて」「UI構造を整理して」「画面の骨組みを作って」 「wireframeを書いて」「画面設計して」「ラフを作って」などの依頼で発動する。 出力はASCIIワイヤーフレーム + 画面注釈（状態・制約・挙動）のMarkdown。モックアップ（見た目重視）やプロトタイプ（動作検証）とは異なる。
maintainer
lilpacy
Updated 1/18/2026
Stars
0
Forks
0
quick start
Installation and usage
Web/アプリの画面ワイヤーフレーム（構造・レイアウト・導線）をASCII図とMarkdown注釈で作成するSkill。 「ワイヤーフレームを作って」「画面構成を設計して」「画面のレイアウトを考えて」「UI構造を整理して」「画面の骨組みを作って」 「wireframeを書いて」「画面設計して」「ラフを作って」などの依頼で発動する。 出力はASCIIワイヤーフレーム + 画面注釈（状態・制約・挙動）のMarkdown。モックアップ（見た目重視）やプロトタイプ（動作検証）とは異なる。
Installation
$ install --globalskills.sh
Usage
Once installed, you can use this skill by running the following command in your terminal:
skills use wireframe-builder