概要

AI Draw.ioは、自然言語の記述からdraw.io（diagrams.net）形式の図を自動生成するツールです。Claude Code向けに設計されており、ユーザーが「フローを示す」「AWS構成図を描いて」「マインドマップを作成して」といった指示を入力すると、AIが適切な図要素とレイアウトを決め、ブラウザ上で即時プレビューを表示します。出力はdraw.io互換のデータなので、ダウンロードして編集したり、既存テンプレートへ組み込むことも容易です。ドキュメント作成や設計レビューのスピードアップに寄与します。（約300字）

リポジトリの統計情報

スター数: 23
フォーク数: 3
ウォッチャー数: 23
コミット数: 5
ファイル数: 5
メインの言語: 未指定

主な特徴

自然言語からdraw.io互換の図を生成（フローチャート、アーキテクチャ図、マインドマップ等）
diagrams.net ビューアでのブラウザプレビュー機能を自動提供
AWS/GCP/Azureなどクラウドアーキテクチャ用アイコンに対応するテンプレート群
Claude Codeプラグインとしての統合でワークフローに組み込みやすい

技術的なポイント

このプロジェクトは「自然言語 → 図データ（draw.io形式）」のパイプラインを中心に設計されています。Claude Code（Anthropicのコード向けワークフロー）を呼び出して、ユーザー指示を構造化された図仕様に変換する役割を担う想定です。生成される図はdiagrams.netが扱うXML/JSONベースのフォーマットへマッピングされ、ノード（矩形・円・クラウドアイコン等）、エッジ（矢印、接続線）、レイアウト情報（座標・整列・階層）を含みます。ブラウザプレビューはdiagrams.netのビューアを埋め込む形で実現されており、生成結果の即時確認と簡単な修正が可能です。

リポジトリ構成を見ると、.claude-pluginフォルダでプラグインメタ情報やエンドポイント定義を持ち、skillsディレクトリに図種ごとの処理ロジック（プロンプトテンプレートや生成ルール）がまとめられている設計が伺えます。こうしたモジュール化により、プロンプト改善やテンプレート追加が容易で、例えば新しいクラウドベンダーアイコンや特殊なダイアグラムタイプを追加しやすくなっています。

注意点として、自然言語から図を生成する際の課題（モデルの解釈差やレイアウト最適化、接続関係の曖昧さ）に対処するため、明示的な指示テンプレートや検証ステップ（ノード重複チェック、閉路検出、依存関係検証など）を導入することが推奨されます。また、出力の互換性確保のためにdraw.ioのフォーマット仕様に沿った厳密なシリアライザが必要です。将来的にはSVG/PNGなどのエクスポート、共同編集対応、カスタムアイコン管理や細かなスタイル編集の対応が期待されます。（約700字）

プロジェクトの構成

主要なファイルとディレクトリ：

.claude-plugin: dir
.gitignore: file
LICENSE: file
README.md: file
skills: dir

まとめ

自然言語で設計図を素早く作れる実用的なツールで、ワークフロー改善に有用です。（約50字）

リポジトリ情報：

名前: ai-drawio
説明: AI-powered draw.io diagram generator for Claude Code. Generate flowcharts, architecture diagrams, mind maps from natural language with browser preview.
スター数: 23
言語: null
URL: https://github.com/GBSOSS/ai-drawio
オーナー: GBSOSS
アバター: https://avatars.githubusercontent.com/u/240244068?v=4

READMEの抜粋：

AI Draw.io

AI-powered draw.io diagram generator for Claude Code. Generate flowcharts, architecture diagrams, mind maps, and technical illustrations from natural language descriptions with browser preview.

Features

Natural Language to Diagram: Describe what you want, get a professional diagram
Browser Preview: Automatically renders diagrams using diagrams.net viewer
Multiple Diagram Types:
- Flowcharts & Process diagrams
- AWS/GCP/Azure architecture diagrams
- Mind…

AI Draw.io — Claude Code向けAI図生成ツール