cathrynlavery/diagram-design

外部のオープンソース リポジトリを紹介するページです。HDATFの製品ではありません。

何をするか

Claude Code、Codex、Piなどskill対応の環境で使うagent skillで、アーキテクチャのスケッチからフローチャートまで、エディトリアル調の図を自己完結したHTMLとSVGで作ります。draw.io、Mermaid、Excalidrawのソースを描き直すこともできます。

ATFへの役立ち方

ATF WorksのwikiページやLabChinの最終レポートで、AIアシスタントが一貫したスタイルで図を描く機能の参考になり得ます。視覚的な成果物を作るskillの設計としても比較する価値があります。

ライセンス

MIT 寛容なライセンスです。著作権表示を残せば商用利用と改変ができます。

同じ分野のリポジトリ

• lnkiai/m3e-canvas
  M3E Canvasは、ブラウザ上でパーツをドラッグ&ドロップしてMaterial 3 Expressiveの画面をスケッチするツールです。画面同士をつないでタップで確認でき、そのデザインをAI coding tool向けのpromptとしてコピーできます。
• CoreBunch/Instatic
  Instaticは、キャンバスエディター、コンテンツエンジン、メディア、認証、フォーム、プラグイン、公開機能がSQLiteまたはPostgresを使う1つのBunサーバーで動くセルフホスト型のビジュアルCMSです。出力はシンプルなセマンティックHTMLとコンパクトなCSSです。
• shadcn-ui/lint
  ESLintとOxlintで使える、Tailwindデザインシステム向けのlinterです。チームが許可する範囲を定めておくと、agentがルールに違反したとき、エラーが問題を説明し、プロジェクトのコンポーネント、variant、themeに沿った修正方法を提案します。
• Nutlope/hallmark
  Hallmarkは、Claude Code、Cursor、Codex向けのデザインskillで、AIが作ったようなありきたりな見た目を避けてUIを作ります。ページ構成とテーマを選び、出力前にslop testのチェックを行います。既存デザインのaudit、redesign、studyも行えます。
• wide-trace/open-higgsfield
  一つのプロンプト入力欄、モデル別の設定、完了した処理のギャラリーを備える画像と動画の生成スタジオです。

Trendshiftのランキングに入ったリポジトリだけを載せ、リストは候補を探すためだけに使いました。順位の数字は転載していません。説明、ライセンス、スター数は各GitHubリポジトリで確認しました。解説は私たちの判断です。これらを試験したわけではなく、上昇リストに載ったことは品質の証明ではありません。