pitch-deck-visuals

belt CLI スキルをインストール： npx skills add belt-sh/cli

ピッチデッキのビジュアル

inference.sh CLI を使って、投資家向けのピッチデッキのビジュアルを作成します。

クイックスタート

inference.sh CLI（belt）が必要です。インストール手順

belt login

# Generate a slide background
belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1920px;height:1080px;background:linear-gradient(135deg,#0f0f23,#1a1a3e);display:flex;align-items:center;padding:100px;font-family:system-ui;color:white\"><div><p style=\"font-size:24px;color:#818cf8;text-transform:uppercase;letter-spacing:3px\">The Problem</p><h1 style=\"font-size:72px;margin:16px 0;font-weight:800;line-height:1.1\">Teams waste 12 hours/week on manual reporting</h1><p style=\"font-size:28px;opacity:0.7\">Source: Forrester Research, 2024</p></div></div>"
}'

12 枚のスライド構成

#	スライド	時間	内容
1	タイトル	15s	会社名、タグライン、氏名
2	課題	45s	データで示す課題
3	ソリューション	45s	製品を一文で説明
4	デモ／製品	60s	スクリーンショットまたはライブデモ
5	市場規模	30s	TAM → SAM → SOM
6	ビジネスモデル	30s	収益を得る方法
7	トラクション	45s	成長指標、顧客
8	競合	30s	機能一覧ではなく、ポジショニング
9	チーム	30s	なぜあなたたちが勝てるのか
10	財務	30s	売上予測、ユニットエコノミクス
11	資金調達のお願い	15s	必要額と使途
12	連絡先	10s	メールアドレス、次のステップ

合計：約6分。 20 枚を超えないでください。

スライドのデザインルール

タイポグラフィ

要素	サイズ（1920x1080）	ルール
スライドタイトル	48-72px	最大6語
主要な数値	96-144px	該当する場合、1枚につき1つ
本文	24-32px	箇条書きは最大6項目
キャプション／出典	16-20px	データソースを記載
フォント	サンセリフのみ	Inter、Helvetica、SF Pro など

1-6-6 ルール

• スライド1枚につきアイデアは1つ
• 箇条書き1項目は最大6語
• スライド1枚につき箇条書きは最大6項目

文章を増やす必要がある場合は、スライドを増やしてください。

色

要素	指針
背景	ダーク（ネイビー、チャコール）またはクリーンな白のどちらかを選び、統一する
アクセントカラー	強調にはブランドカラーを1色だけ使う
テキスト	暗い背景には白、明るい背景にはダークグレー（#333）
チャート	最大2～3色。自社を表す色にはブランドカラーを使う
避けるもの	テキストへのグラデーション、ネオンカラー、4色以上の使用

レイアウト

ルール	理由
余白を統一（80-100px）	プロフェッショナルですっきりした印象
テキストは左揃え（本文は中央揃えにしない）	内容を把握しやすくする
スライド1枚につきビジュアルは1つ	注目を集める
スライド番号を付ける	投資家が特定のスライドを参照しやすくする
角にロゴを配置	さりげなくブランドを印象づける

スライドごとのビジュアルガイド

1. タイトルスライド

belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1920px;height:1080px;background:#0f0f23;display:flex;align-items:center;justify-content:center;font-family:system-ui;color:white;text-align:center\"><div><h1 style=\"font-size:80px;font-weight:900;margin:0\">DataFlow</h1><p style=\"font-size:32px;opacity:0.7;margin-top:16px\">Automated reporting for data teams</p><p style=\"font-size:22px;opacity:0.5;margin-top:40px\">Seed Round — Q1 2025</p></div></div>"
}'

2. 課題スライド

大きな数値を1つと、1文を1つ。

belt app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1920px;height:1080px;background:#0f0f23;display:flex;align-items:center;padding:100px;font-family:system-ui;color:white\"><div><p style=\"font-size:24px;color:#f59e0b;text-transform:uppercase;letter-spacing:3px;margin:0\">The Problem</p><h1 style=\"font-size:144px;margin:20px 0;font-weight:900;color:#f59e0b\">12 hrs/week</h1><p style=\"font-size:36px;opacity:0.8;line-height:1.4\">The average data analyst spends 12 hours per week<br>building reports manually</p><p style=\"font-size:20px;opacity:0.4;margin-top:30px\">Source: Forrester Research, 2024</p></div></div>"
}'

5. 市場規模（TAM/SAM/SOM）

円グラフではなく、同心円を使います。

belt app run infsh/python-executor --input '{
  "code": "import matplotlib.pyplot as plt\nimport matplotlib\nmatplotlib.use(\"Agg\")\n\nfig, ax = plt.subplots(figsize=(19.2, 10.8))\nfig.patch.set_facecolor(\"#0f0f23\")\nax.set_facecolor(\"#0f0f23\")\n\ncircles = [\n    (0, 0, 4.0, \"#1e1e4a\", \"TAM\\n$50B\", 40),\n    (0, 0, 2.8, \"#2a2a5a\", \"SAM\\n$8B\", 32),\n    (0, 0, 1.4, \"#818cf8\", \"SOM\\n$800M\", 28)\n]\n\nfor x, y, r, color, label, fontsize in circles:\n    circle = plt.Circle((x, y), r, color=color, ec=\"#333366\", linewidth=2)\n    ax.add_patch(circle)\n    ax.text(x, y, label, ha=\"center\", va=\"center\", fontsize=fontsize, color=\"white\", fontweight=\"bold\")\n\nax.set_xlim(-5, 5)\nax.set_ylim(-5, 5)\nax.set_aspect(\"equal\")\nax.axis(\"off\")\nax.text(0, 4.8, \"Market Opportunity\", ha=\"center\", fontsize=36, color=\"white\", fontweight=\"bold\")\nplt.tight_layout()\nplt.savefig(\"market-size.png\", dpi=100, facecolor=\"#0f0f23\")\nprint(\"Saved\")"
}'

7. トラクションスライド

数値だけでなく、成長を示します。 右肩上がりのチャートを使います。

belt app run infsh/python-executor --input '{
  "code": "import matplotlib.pyplot as plt\nimport matplotlib\nmatplotlib.use(\"Agg\")\n\nfig, ax = plt.subplots(figsize=(19.2, 10.8))\nfig.patch.set_facecolor(\"#0f0f23\")\nax.set_facecolor(\"#0f0f23\")\n\nmonths = [\"Jan\", \"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\"]\nrevenue = [8, 12, 18, 28, 42, 58, 82, 120]\n\nax.fill_between(range(len(months)), revenue, alpha=0.3, color=\"#818cf8\")\nax.plot(range(len(months)), revenue, color=\"#818cf8\", linewidth=4, marker=\"o\", markersize=10)\nax.set_xticks(range(len(months)))\nax.set_xticklabels(months, color=\"white\", fontsize=18)\nax.tick_params(colors=\"white\", labelsize=16)\nax.set_ylabel(\"MRR ($K)\", color=\"white\", fontsize=20)\nax.spines[\"top\"].set_visible(False)\nax.spines[\"right\"].set_visible(False)\nax.spines[\"bottom\"].set_color(\"#333\")\nax.spines[\"left\"].set_color(\"#333\")\nax.set_title(\"Monthly Recurring Revenue\", color=\"white\", fontsize=32, fontweight=\"bold\", pad=20)\nax.text(7, 120, \"$120K MRR\", color=\"#22c55e\", fontsize=28, fontweight=\"bold\", ha=\"center\", va=\"bottom\")\nax.text(7, 112, \"15x growth in 8 months\", color=\"#22c55e\", fontsize=18, ha=\"center\")\nplt.tight_layout()\nplt.savefig(\"traction.png\", dpi=100, facecolor=\"#0f0f23\")\nprint(\"Saved\")"
}'

8. 競合スライド

競合との比較に機能マトリックスは使わないでください。 2x2 のポジショニングマップを使います。

# See the competitor-teardown skill for positioning map generation
belt app run infsh/python-executor --input '{
  "code": "import matplotlib.pyplot as plt\nimport matplotlib\nmatplotlib.use(\"Agg\")\n\nfig, ax = plt.subplots(figsize=(19.2, 10.8))\nfig.patch.set_facecolor(\"#0f0f23\")\nax.set_facecolor(\"#0f0f23\")\n\ncompetitors = {\n    \"Us\": (0.6, 0.7, \"#22c55e\", 300),\n    \"Legacy Tool\": (-0.5, 0.5, \"#6366f1\", 200),\n    \"Startup X\": (0.3, -0.4, \"#6366f1\", 200),\n    \"Manual Process\": (-0.6, -0.6, \"#475569\", 150)\n}\n\nfor name, (x, y, color, size) in competitors.items():\n    ax.scatter(x, y, s=size*5, c=color, zorder=5, alpha=0.8)\n    weight = \"bold\" if name == \"Us\" else \"normal\"\n    ax.annotate(name, (x, y), textcoords=\"offset points\", xytext=(15, 15), fontsize=22, color=\"white\", fontweight=weight)\n\nax.axhline(y=0, color=\"#333\", linewidth=1)\nax.axvline(x=0, color=\"#333\", linewidth=1)\nax.set_xlim(-1, 1)\nax.set_ylim(-1, 1)\nax.set_xlabel(\"Manual ← → Automated\", fontsize=22, color=\"white\", labelpad=15)\nax.set_ylabel(\"Basic ← → Advanced\", fontsize=22, color=\"white\", labelpad=15)\nax.set_title(\"Competitive Landscape\", fontsize=32, color=\"white\", fontweight=\"bold\", pad=20)\nax.tick_params(colors=\"#0f0f23\")\nfor spine in ax.spines.values():\n    spine.set_visible(False)\nplt.tight_layout()\nplt.savefig(\"competition.png\", dpi=100, facecolor=\"#0f0f23\")\nprint(\"Saved\")"
}'

9. チームスライド

# Generate professional team headshots/avatars
belt app run falai/flux-dev-lora --input '{
  "prompt": "professional headshot portrait, person in business casual attire, clean neutral background, warm studio lighting, confident friendly expression, corporate photography style",
  "width": 512,
  "height": 512
}'

レイアウト：写真を横一列に並べ、それぞれに名前、役職、実績を1つ添えます。

人物	形式
CEO	名前、役職、「元[会社名]、[実績]」
CTO	名前、役職、「[会社名]で[成果物]を構築」
その他	名前、役職、関連する実績を1つ

チームスライドに載せるのは最大4人です。 それ以上では焦点がぼやけます。

チャートのガイドライン

チャートの種類	使用する用途	使用しない用途
折れ線グラフ	時間経過に伴う成長（トラクション）	カテゴリ間の比較
棒グラフ	数量の比較	時系列データ（折れ線グラフを使用）
同心円	TAM/SAM/SOM	その他すべて
2x2 マトリックス	競争上のポジショニング	機能の比較
大きな数値1つ	主要指標の強調	複数の指標
円グラフ	絶対に使わない	すべて（読みにくく、プロらしくありません）

チャートのデザインルール

ルール	理由
チャート1つにつき最大2色	明瞭さを保つ
自社は緑またはブランドカラーで表す	ポジティブな印象につながる
チャート上に直接ラベルを付ける	独立した凡例が不要になる
グリッド線を削除するか、ごく薄くする	見た目のごちゃつきを抑える
Y軸は0から始める	誤解を招かないようにする
データソースを記載する	信頼性を高める

投資家が注目するポイント

スライド	投資家が本当に知りたいこと
課題	「お金を払って解決したいと思う、本当の課題ですか？」
ソリューション	「現状より10倍優れていますか？」
市場	「重要な規模の市場ですか？」
実績	「実際にうまくいっていますか？」
チーム	「この人たちに実行できますか？」
資金調達の依頼	「妥当な条件ですか？」

よくある間違い

間違い	問題点	改善策
スライドが多すぎる（20枚以上）	注意が散漫になり、焦点がぼやけます	最大12～15枚にします
文字だらけのスライド	誰も読みません	1-6-6ルール：アイデア1つ、単語6つ、箇条書き6項目
競合との機能比較表	防御的に見えます	2×2のポジショニングマップを使います
円グラフ	読みにくく、プロらしくありません	棒グラフや大きな数字を使います
データソースの記載がない	捏造に見えます	必ず出典を記載します
8人以上を載せたチームのスライド	焦点がぼやけます	最大4人に絞り、関連する経験に重点を置きます
デザインに一貫性がない	素人っぽく見えます	すべてのスライドで色、フォント、余白を統一します
「資金調達の依頼」のスライドがない	投資家に希望内容が伝わりません	金額、資金の使い道、スケジュールを明記します
見栄えだけの指標	「訪問数100万件」も、コンバージョンがなければ意味がありません	売上、アクティブユーザー数、継続率を示します
製品デモに時間をかけすぎる	これは事業のピッチであり、デモではありません	製品のスライドは最大2枚にし、事業に重点を置きます

関連スキル

npx skills add inference-sh/skills@competitor-teardown
npx skills add inference-sh/skills@data-visualization
npx skills add inference-sh/skills@ai-image-generation

すべてのアプリを閲覧：belt app list