次の絵を描きたいなら、なぜ空白のキャンバスから始めるのでしょうか。
以前、ビジュアルコンテンツにAIを使用する際には、よく問題がありました。
モデルは絵を描くことができますが、“なぜ絵を描くのか”はわかりません。
記事を与えれば美しいイラストが生成されるかもしれません製品の流れを描くように頼むとフローチャートのような絵が生成されるかもしれません
しかし、実際にコンテンツ制作シーンに入った後、必要なのは“見栄えの良い画像をランダムに生成する”ことではありません。
しかしながら：
- この記事にはどのような画像が必要ですか？
- 複雑なプロダクトロジックは、フローチャート、アーキテクチャダイアグラム、またはユーザージャーニーダイアグラムを使用するべきですか？
- 6ページの小さな本をどうやって作るのか？
- MarkdownをPPTに変えるには？
- 物語はどのように連続した鏡に分割されるか？
- ブランドはどのような視覚的な方向性から始めるべきか？
- 生成されたコンテンツは、1枚の画像にとどまらず、どのように配信されるのか。
GitHub 上にある。 デザイン·バディ解決しようとしているのはまさにこの問題です。
単独のAI描画ツールではなく、コンテンツクリエイター、プロダクトマネージャー、独立した開発者、デザインコラボレーター向けのツールセットです。 Agent Skills Visual Production Toolbox。
1.“AIドローイング”から“AIデザイン”へ
Design Buddyの最も興味深い点は、呼び出すモデルの数ではなく、ワークフローを変えたことです。
“AIに何を描くかを教える”から、“AIに内容を理解させてから、どう表現するかを決める”に変わります。
例えば、あなたはこう言います：
この記事の公開表紙を作成します。
理想的には、すぐに画像を生成するのではなく、まずトピックを理解してから視覚的な方向性を判断する必要があります。
READMEでの例は以下の通りです。
AI生産性システム/コンテキスト管理 /パーソナルワークフロー
次に、さまざまなデザインの方向性を示します。
- Conceptual + Warm Editorial
- Blueprint + Technical Schematicについて
- フラットベクトル+高コントラスト
ようやく確定した。
16 9表纸+タイトル読み取り可能。
このプロセスはとても重要です。
本当のデザインは“絵を描く”ほど簡単ではありません。
デザインはまず。情報の判断。。
デザイン·バディとは何でしょう？
プロジェクト構造の観点から、Design Buddyは複数の独立したスキルで構成されるビジュアル制作システムです。
現在、倉庫には、画像生成、チャート、ブランドデザインからスライドショー、公開番号タイポグラフィ、ストーリーボードなど、さまざまな方向のスキルが含まれています。
例えば：
| Skillの | 主な用途 | 輸出する。 |
|---|---|---|
space-gemini-image |
Gemini 文生図、図生図 | 写真はこちら |
space-logo-generator |
ロゴの検索方法 | ロゴの写真。 |
space-chart-html |
フローチャート、図、ER図など | HTML |
space-chart-html-plus |
より複雑なインフォグラフィック | HTML |
space-architecture-diagram |
システムアーキテクチャ、導入トポロジ | HTML / SVG |
space-text-logic-diagram |
文章の論理可視化 | HTML / SVG |
space-mermaid-diagram |
テキストからMermaid図へ | Mermaidさん |
space-slide-deck |
Markdownスライドショー | PNG / PPTX / PDF |
space-wechat-layout |
公開記事のレイアウト | HTML |
space-storyboard-generator |
ストーリーボードとストーリーボード | スペクタクル+写真 |
space-markdown-poster |
Markdownはポスターを共有する | PNGとは |
space-generative-art |
P 5.jsアートの生成 | HTMLとJS |
space-image-skill-builder |
カスタムマップの作成Skill | Skillの |
言い換えれば、それは1のようです：
“コンテンツ→視覚表現→成果物”のAI設計パイプライン。
第三に、“どの視覚形態を選ぶか”という問題があります。
AIビジョンツールの多くは以下のように動作します。
イメージへのヒント
Design Buddyはもっと近い：
コンテンツ→理解→視覚的意思決定→世代→配達
プロジェクトREADMEはこのプロセスを4つのレベルに分割します。
レベル1：内容の理解
ユーザーが提供するもの：
- 記事の内容
- 製品の需要
- ストーリー·ストーリー
- データは
- 製品ロジックの定義
- Brand Informationより
そして判断する。
この段落は何を伝えたいのか？
レベル2：視覚的な意思決定
次の決定：
- 写真かグラフか。
- フローチャートかスキーマ図か？
- コンセプトイラストかシナリオか？
- どの割合を使うべきか？
- 情報密度はどれくらい高いか？
- 特定のブランドデザインシステムに従う必要がありますか？
- 最終的にHTML、SVG、PNG、またはPPTを出力しますか？
これが実際には“デザイン”です。
レベル3資産の生成
視覚構造を決定したら、異なるツールを呼び出してコンテンツを生成します。
プロジェクトでサポートされるルートは、次のような非常に多数あります。
- 画像モデルの作成
- GPT-image-2
- ジェミニ
- HTML / SVG
- Mermaidさん
- p5.js
- PPTXの
- PDFの場合
- 公開番号のHTMLテンプレート
だから、“すべての問題を1つの画像モデルに委ねる”わけではありません。
第4段階：配達整理
そして最後に：
生成結果を実際に使用可能なファイルに変換します。
例えば：
Markdownの記事
↓ ↓ ↓
記事の分析
↓ ↓ ↓
地図の作成
↓ ↓ ↓
記事の挿入
↓ ↓ ↓
新しい記事を得る。
または：
Markdownの意味
↓ ↓ ↓
PPTアウトラインの生成
↓ ↓ ↓
ページごとのビジュアルスキーマの生成
↓ ↓ ↓
ページの一括生成
↓ ↓ ↓
PPTXとPDF
これは、Design Buddyと通常のAIマッピングPromptの最大の違いの1つです。
4.最も興味深い使用シーン
1.記事を自動化
5000語の記事を書いたとしましょう。
伝統的なアプローチは：
- 記事を検索する
- 画像を検索
- ダウンロードする
- 寸法の変更
- 記事の挿入
- 画像とコンテンツが一致しない
- 再発見。
Design Buddyのコンセプトは：
AIはまず記事を理解し、各場所に表示されるビジュアルコンテンツを決定します。
例えば：
- 概念図の使用開始
- 中間使用フロー図
- 比較グラフの使用
- 複雑な概念は論理図を使用する
- 最後に、概要ビジョン。
これは実際に“画像検索”を“コンテンツ可視化”にアップグレードします。
複雑な製品ロジックを描く。
これは、プロダクトマネージャーやテクニカルチームに最適なDesign Buddyシナリオです。
例えば、AIに言います。
このシステムをアーキテクチャ図に描きます。
通常の画像を表示するだけではありません。
プロジェクトの内容：
space-architecture-diagram
そして，
space-chart-html
space-chart-html-plus
space-text-logic-diagram
space-mermaid-diagram
様々なツールを使う。
したがって、複雑系は関係の種類に応じて異なる表現を選択できる。
- システムアーキテクチャ図
- デプロイメントマップ
- ネットワークトポロジ
- データの流れ
- ユーザーの旅
- フロー図
- ロードマップROAD MAP
- SWOT
- ERのグラフ
- Mermaidグラフ
- 論理関係図
その背後にある考え方はとてもシンプルです。
異なる情報構造は異なる視覚構造を使用する必要がある。
1つの記事を小さな赤い本に変える。
もう一つの非常に現実的なシナリオは、ソーシャルメディアのコンテンツ制作です。
例えば：
この記事を6ページの小さな赤い本に分割します。
Design Buddyはコンテンツ構造によって分解できます。
- カバー Coverフックの単語。
- 痛みを感じる。なぜ普通の言葉が足りないのか
- フレームワークは：：コア·アプローチ
- ケース·オブ·ケース具体的な使い方
- リスト一覧：：ステップの実行
- 終わり方：行動またはリードを維持する
ここで重要なのは“6枚の写真”ではない。
しかしながら：
まず、長いコンテンツをモバイルで読むのに適したコンテンツ構造に再編成します。
これは、画像生成からコンテンツ編集、ビジュアルオーケストレーションへと広がっています。
MarkdownはPPTに直接変換する
これは、開発者、プロダクトマネージャー、コンテンツクリエイターにとって最も時間を節約できる機能の1つです。
直接提案できます：
Markdownを12ページのPPTにします。
デザイン·バディ。 space-slide-deck 周囲にあります
コンテンツ概要→ページ構造→デザインシステム→シングルページビジュアル→ PPTX / PDF
処置を行う。
また、複数のブランドデザインシステムからの視覚的参照を見つけ、スライドショーを生成することもできます。
これは、
Markdownはもはや読者に渡されるテキストではなく、ビジュアル制作のソースファイルにもなります。
あなたも得ることができる：
一篇文章
直接转换成：
文章 → 信息图 → 幻灯片 → PDF → 分享海报
形成一整套内容资产。
公開番号のレイアウトもワークフローに組み込まれています。
多くのAIツールは記事を生成できますが、Markdownで停止します。
実際に投稿するとき：
- タイトル：Title
- 小見出しは
- パラグラフは
- 写真はこちら
- 引用する。
- 強調する。
- 間隔の間隔
- HTML
- 編集者の互換性
Design Buddyは以下の通り。
space-wechat-layout
目標は、記事をさらにWeChat公開アカウントの公開に適したタイポグラフィページに変換し、コピー可能なリッチHTMLを提供することです。
それだけでなく、
“コンテンツは生成されたのか？
しかしながら：
“コンテンツは出版プロセスに直接入ることができますか？”
ロゴやブランドデザインまでカバーしています。
ただの記事であれば、このプロジェクトは特に新しいものではありません。
さらに興味深いのは、スキルシステム全体にブランドデザインを組み込んでいることです。
例えば：
space-logo-generator
ロゴの方向性を探索するために使用できます。
そして，
space-brand-ui-design
公開されたブランドデザイン仕様と組み合わせることで、UI 生成の視覚的制約をより明確にすることが試みられた。
その背後にある論理は：
“美しいページを作る”だけではなく、デザイン言語を構築し、ページを作成します。
特に独立系開発者には有用です。
過去に製品を作るには、個別に対処する必要があります。
- ロゴはこちら
- Brand Colorシングル
- ランディングページ
- プロダクトUI
- ソーシャルメディアの画像
- PPT
- 製品の説明図
これらのタスクは、エージェントのビジュアルスキルワークフローに統合できます。
通常のPromptとの最大の違いは
通常のAI図面を理解すると：
“テクノロジーのイメージを描くのを手伝ってください。
結果はPromptに大きく依存する。
Design BuddyはPromptの背後にある意思決定プロセスを構造化しようとします。
例えば：
用户需求
↓
内容理解
↓
判断视觉类型
↓
确定比例
↓
选择风格
↓
选择生成工具
↓
生成
↓
检查 / 修改
↓
输出最终文件
これは興味深い傾向を示している。
AIエージェントの将来の競争は、必ずしもモデルの能力だけでなく、スキルやワークフローの競争にもなるかもしれません。
モデルは“生成能力”を担当する。
スキルは以下の通り
いつ、どのように、何を輸出し、どのように納品するか。
11.インストール方法は？
Design BuddyはAgent Skillsプロトコルに基づいており、複数の互換性のあるAIエージェント環境で使用できます。
プロジェクトREADMEの推奨方法は以下のとおりです。
npx skills add SpaceZephyr/design-buddy
Skillをサポートするエージェントをインストールすることもできます。
帮我安装这个 skill：
https://github.com/SpaceZephyr/design-buddy
プロジェクトREADMEにリストされている互換環境には、Claude Code、Codex、Cursor、OpenClaw、Hermes、Gemini CLI、OpenCodeなどがある。
自動インストールを使用しない場合、リポジトリを直接クローンすることもできます。
git clone https://github.com/SpaceZephyr/design-buddy.git
次に、エージェント環境に応じて必要なスキルをロードします。
実際に使うと自然になります。
インストール後、複雑なコマンドを習得する必要はありません。
多くの場合、直接話すことができます：
给这篇文章生成一张封面图
または：
把这个系统画成架构图
把这篇文章拆成小红书 6 页图
帮我设计 10 个 Logo 方向
把这份 Markdown 转成 12 页 PPT
把这篇文章排成公众号格式
特定のスキルを指定することもできます。
用 space-image-studio 做一张小红书封面
この操作方法は、エージェントの使用習慣によく似ています。
ユーザは目標を記述し、エージェントは呼び出す機能を決定します。
しかし、“AIデザイナーの代替”ではありません。
これは、このプロジェクトのREADMEの最も重要な部分です。
デザインバディは境界を明確に定義します。
例えば：
AIは必ずしも完璧な画像を作成できません。
テキスト、複雑な構造、中国語のタイポグラフィ、キャラクターの詳細などにはまだ問題があります。
グラフは事実と等しくない
入力されたデータやロジックが間違っていれば、AIは間違った情報を非常に美しいグラフに変換する可能性があります。
だからこそ、
視覚的品質は情報を正当化しない。
ロゴは商標登録に等しくない。
AIはロゴの方向性を探るのに役立ちますが、商標の近似、業界の競合、法的なユーザビリティはまだ独立して処理する必要があります。