スキル

design-doc-mermaid:Claude Code で Mermaid と設計文書を描く

活動図を描く、またはコードから Mermaid を出したい人向け。公式どおり ~/.claude/skills へクローンし、先に会話で図を出してからファイルを書く。

公式ソース · design-doc-mermaid

インストール

git clone https://github.com/SpillwaveSolutions/design-doc-mermaid.git

誰向けか

Claude Code で Mermaid 図を描き、設計文書を書きたい人に向きます。公式には、必要時に載せるガイド、コードからの図生成、Python ツールで Mermaid 図と設計文書を作る強力な Claude Code 技能一式だとあります。

すでに流れ(登録とメール確認など)がある人、またはコードがあり先に図を見たい人により向きます。リポジトリを ~/.claude/skills へクローンする準備がない人には向きません。

始める前に git clone を使え、公式のこの一本の手作業導入経路を受け入れる必要があります。初回から別の市場コマンドを混ぜないでください。

3分で最初の試し

原文のクローン導入だけを使います。初回は会話で図を出し、先にリポジトリへ設計文書を書かないでください。

前提:手元に git があり、Claude Code が ~/.claude/skills から技能を載せること。初回は本番文書を上書きしないでください。

インストール先:先に技能ディレクトリへ入り、公式リポジトリをクローンします。

cd ~/.claude/skills
git clone https://github.com/SpillwaveSolutions/design-doc-mermaid.git

公式リポジトリ頁:

https://github.com/spillwavesolutions/design-doc-mermaid

低リスクの起動:導入後、会話で原文の例文を使います。Create an activity diagram for user registration with email verification。先に会話内だけに Mermaid を求め、ファイルは書かないでください。公式は SKILL.md を決定木付きの主調整ファイルとして書いています。助手が名指しされていないスクリプトを呼び始めたら、先に副作用を確認してください。

成功の合図:~/.claude/skills/design-doc-mermaid があり SKILL.md を含み、会話に活動図の Mermaid が出ること。文書として残すなら、書く前にパスを確認してください。

使い方の例

例1:公式の例で活動図を描く。助手に Create an activity diagram for user registration with email verification と言います。登録とメール確認の流れを述べたい人に向きます。証拠はこの利用者文だけであり、ガイドファイル名はありません。先に会話で図を見て、ディスクへ書くかを決めてください。

例2:既存コードから図を出す。公式能力には code-to-diagram generation があります。すでにコードがあり先に図を見たい人に向きます。証拠は対応言語やソース変更の有無を書いていません。自分のコードだけを読み取り専用で生成し、Python ツールがファイルを書くなら先に出力位置を確認してください。

使える範囲

主経路は ~/.claude/skills へのクローンです。原文には skilz install SpillwaveSolutions_design-doc-mermaid/design-doc-mermaid もあります。初回は両方を同時にせず、書いていない環境へ市場コマンドを当てないでください。

名指しファイルは SKILL.md(主調整、決定木付き)だけです。他のガイド名、スクリプト名、技能パスを自分で足さないでください。

必要時ガイドと Python ツールは言及されますが、目録はありません。Mermaid 実行環境の自動導入や文書の送出を仮定しないでください。

公式はこの技能一式を Claude Code 技能としてだけ書いており、他環境の手順はありません。