Mermaid図やフォルダ構成図を対話形式で作成するスキル。フロー図、クラス図、シーケンス図、ER図、ユースケース図、フォルダ構成図、アスキーアートの生成と既存図の編集・改善に対応。「図を作って」「クラス図を生成」「フローチャートを描いて」「フォルダ構成を可視化」「mermaidで図を作りたい」「既存の図を改善して」「ER図を作成」「シーケンス図を書いて」といったリクエストで起動する。
Mermaid図やプレーンテキスト図を対話形式で作成するスキル。 粒度を段階的にコントロールし、人が見やすい図を生成する。
%% コメント、 アノテーションを付与note📁 必要時に参照: references/mermaid_reference.md
図の生成時にMermaid構文の詳細が必要な場合に参照すること。 フローチャート、クラス図、シーケンス図、ユースケース図（代替）、ER図、フォルダ構成図の書式を収録。
📁 必読: references/phases/00_prep.md
| ステップ | 名前 | 概要 |
|---|---|---|
| 1.1 | メインメニュー | 図の種類を選択（9項目）。起動時に意図が明確なら自動スキップ |
| 1.2 | 対象情報の入力 | 図にする対象の情報を入力（必須）。おまかせの場合は図種を自動提案 |
📁 必読: references/phases/01_design.md
| ステップ | 名前 | 概要 |
|---|---|---|
| 2.1 | 粒度の確認 | 粒度レベルを確認（AIおすすめ＋具体例を表示、要素数警告付き） |
| 2.2 | 構成の提案 | 図の要素・構成を提案。要素数超過時はセクション分割を提案 |
| 2.3 | 構成の確認 | ユーザーが構成をレビュー・修正。ループ可能 |
📁 必読: references/phases/02_create.md
| ステップ | 名前 | 概要 |
|---|---|---|
| 3.1 | 図の作成 | mermaid/plaintext/アスキーアートで図を生成。コメント・ノート付き |
| 3.2 | 図の確認 | 作成した図をユーザーに確認してもらう（必須） |
| 3.3 | 次の粒度へ深掘り | より細かい粒度が必要な場合、対象セクションを選んで深掘り |
📁 必読: references/phases/03_output.md
| ステップ | 名前 | 概要 |
|---|---|---|
| 4.1 | 出力先の提案 | 出力先を理由付きで提案（カレントDir / tmp / readme / docs分割 等） |
| 4.2 | ファイル出力 | 図をファイルに出力 |
| 4.3 | 次のアクション | 続けて別の図を作成（→1.1）/ 編集（→5.1）/ 終了 |
📁 必読: references/phases/04_edit.md
| ステップ | 名前 | 概要 |
|---|---|---|
| 5.1 | 既存図の読み込み | ファイルパス指定 or コード貼り付けで読み込み・解析 |
| 5.2 | 改善提案 | 可読性・コメント・構造・要素数等の改善点を提案 |
| 5.3 | 編集・確認 | Before/After比較で確認 → 出力フェーズ（4.1）へ |
詳細は references/mermaid_reference.md を参照。
| 図の種類 | デフォルト方向 | 備考 |
|---|---|---|
| クラス図 | 縦（TB） | クラス数が多い場合は横（LR）も可 |
| シーケンス図 | 横 | mermaidのsequenceDiagramは常に横 |
| フロー図 | 縦（TD） | |
| ユースケース図 | 横（LR） | flowchartで代替 |
| ER図 | - | mermaid自動レイアウト |
%% コメントでセクション区切りと説明を入れるnote / note for X でアノテーションを付与する# でコメント