工藤拓真 スケジュール＆予算スライド生成スキル¶
概要¶
クライアント提案用のスケジュール＆予算スライドを、kudoテンプレのダークBG仕様でPPTX出力するスキル。 基本形は2枚構成：①スケジュールのみ（ガントチャート）→ ②スケジュール＋予算（同じガントに金額を重ねたもの）。 プレゼンの流れで「まずスケジュールを見せて→次に予算を重ねて説明する」ことを想定した設計。
最重要ルール：いきなり作らない。必ずヒアリングから始める。
ワークフロー¶
STEP 1: ヒアリング¶
聞くべき項目（チェックリスト）¶
以下の情報がすべて揃うまで、生成に進まない。 既に会話中で判明している情報はスキップしてよい。 一度に全部聞かず、自然な対話の流れで2〜3問ずつ聞く。
A. 案件の基本情報¶
- クライアント名
- 案件の種類（ブランディング / 事業開発 / マーケ戦略 / その他）
- 初回提案か、継続案件か
- X-DAY（IPO、ローンチ、発表日など）の有無と時期
- X-DAYが未確定の場合は「？」付きで扱う
B. プロジェクト構造¶
- PJの数と名称（例：「会社の箱」「既存サービスの箱」）
- PJ間の依存関係の有無（「PJ1の結果がPJ2に影響する」等）
C. 各PJのステップ¶
- ステップの数と名称（デフォルトは①傾聴と分析→②コンセプト開発→③デザイン開発→④COM展開）
- 各ステップの大まかな時期（「4月〜」「5月〜6月」等）
- 各ステップで特に論点になりそうなこと（ガントバー内テキスト用） → 「何を聞くべきか」「何が争点か」を問いの形で
D. 予算¶
- 月額フィーの有無と金額（「300 or 600万/月」等）
- 各PJの予算項目と金額
- デフォルト項目：名称開発 / コピー開発 / ロゴ開発 / キービジュアル / 制作費+α
- 案件によって項目は変わる。必ず確認する
- 特殊コスト（店舗内装、撮影費など）の有無
ヒアリングの聞き方ルール¶
- 推測で埋めない。分からないことは聞く
- 選択肢を出す。「ステップは4つですか？それとも増減ありますか？」
- 前回の案件パターンを参照して提案する。「SmartNewsの時と同じ4ステップ構成でいいですか？」
- 情報が足りなくても一部だけ先に作ることは可能と伝える。「スケジュールだけ先に作って、予算は後から足すこともできます」
ヒアリングの順序¶
第1問: 案件の基本（クライアント名、種類、初回/継続）
第2問: PJ構造（いくつの箱があるか、名称、依存関係）
第3問: X-DAYと時間軸（いつからいつまでか、マイルストーン）
第4問: 各ステップの中身（論点・争点）
第5問: 予算の項目と金額
第4問と第5問は情報量が多いので、PJごとに分けて聞いてもよい。
STEP 2: 構成確認¶
ヒアリング完了後、生成前に以下を工藤に提示して確認を取る。
【スケジュール＆予算スライド構成案】
- タイトル：ReBRANDING スケジュール（イメージ）※初回ヒアリングで大きく変更
※初回提案の場合のみ上記。継続案件は「（イメージ）」を外す
- 時間軸：3月〜2027年〜
- X-DAY：IPO?（10月付近、破線マーカー）
- 月額CDフィー：300 or 600万/月（スライド上部に小さく表記）
- PJ1（赤）：会社の箱 ── コーポレートブランド
①傾聴と分析（4月〜）論点：... 予算：─
②ブランドコンセプト開発（5月〜）論点：... 予算：名称500万 / コピー300万
③デザイン開発（7月〜）論点：... 予算：ロゴ500万 / KV1000万ー
④COM展開（9月〜）論点：... 予算：制作費+α
- PJ2（青）：...
- PJ間依存：PJ1②→PJ2②（点線矢印）
工藤から「OK」「いいよ」等の承認が出たら、STEP 3に進む。 修正指示があれば反映してから再提示。
STEP 3: PPTX生成¶
使用するツール¶
pptxスキル（pptxgenjs.md）を読んで、Node.jsで生成する。 テンプレート編集（editing.md）ではなく、スクラッチ生成が基本。
デザインルール¶
→ 詳細は references/design-spec.md を参照
共通仕様¶
- 背景：ダーク（一次ソース参照：Layer 1 Ink または Jet）
- フォント：ハードコードしない。一次ソース（tokens.json / CLAUDE.md §6 / 個人設定項目8）から Pattern B 3モードをロード
- スキル固有の運用：スケジュール・予算は情報密度が高いため 基本 UI モードを主用、スライドタイトルのみ DISPLAY、長文解説がある場合のみ READING を使う
- スライドサイズ：16:9（LAYOUT_16x9）
基本形＝3枚構成¶
スライド1：スケジュールのみ 純粋なガントチャート。金額情報は一切載せない。 読み手が「いつ・何を」に集中できるスライド。
スライド2：スケジュール＋予算 スライド1と同じガントチャートに、金額情報を重ねたスライド。 読み手が「この月のこの作業にこれだけかかる」と一目でわかる。
スライド3：設計ポイント解説（ガントチャート＋注釈オーバーレイ） スライド2と同じガントチャート＋予算をベースに、設計の肝をポイント別に注釈として重ねるスライド。 テキストだけの別レイアウトにはしない。読み手がスライド1-2で見慣れた構造の上に解説が乗る形。 ガントチャートの該当箇所を指し示す形で「なぜこの順序か」「ここが論点」「予算の重点はここ」を添える。
この3枚をセットで生成する。プレゼンでは「スケジュール → 予算を重ねて → 同じ図の上で設計意図を補足」の流れ。
スライド1（スケジュールのみ）のレイアウト： - 左にPJラベル（PJ名＋サブタイトル＋PJカラーの細いアクセントバー） - 上部に月ヘッダー - ガントバーはPJカラーで塗り、中にタスク名＋論点テキストを入れる - 金額情報は載せない。月額CDフィーも載せない - X-DAYは赤破線で縦に貫通＋ラベル - PJ間依存は点線矢印 - 初回提案はタイトルに「（イメージ）※初回ヒアリングで大きく変更」 - フッター：「CreativeDirector 工藤 ｜ AD...」
スライド2（スケジュール＋予算）のレイアウト： - スライド1と同一のガントチャートをベースにする - ガントバーの下（または右横）に金額を小さく添える ← 予算統合の核心 - 例：ガントバー「②コンセプト開発」の下に「名称500万 / コピー300万」 - 金額テキストは #C89932（黄）、5-6pt、控えめに - 月額CDフィーはスライド上部右寄せで小さく表記（黄） - 該当ステップに紐づかない費用もスライド上部に小さく表記 - X-DAY、PJ間依存、フッターはスライド1と同じ
スライド3（設計ポイント解説＝ガントチャート＋注釈オーバーレイ）のレイアウト： - スライド2と同じガントチャート＋予算テキストをそのまま再利用する（同一のベース） - タイトル：「スケジュール＆予算 設計ポイント」（12-14pt、白） - ガントチャートの上に、設計ポイントを注釈として重ねる - 注釈は小さな半透明カード（背景 #161616、角丸、薄いボーダー）で表現 - 注釈のフォント：見出し7-8pt Bold白、本文6-7pt Regular #C9C5BD - ガントチャートの該当箇所（PJやステップ）の近くに配置し、何を指しているか明確にする - 注釈の引き出し線（細い線 #888888）でガント要素と繋げてもよい - 注釈の内容例（ヒアリング内容に応じて自動生成する）： - PJ間の依存関係と順序の意図（例：PJ1のコンセプトが固まってからPJ2のデザインへ） - X-DAYに向けた逆算ロジック - 予算配分の重点（どこに厚く投資するか） - 段階ごとの論点や判断ポイント - リスクや留意点 - 注釈は4〜6個程度。1注釈あたり1〜2行。簡潔に - ガントチャート自体は見えるが、注釈が重なるので情報密度が高くなる → ガントバーを少し透過（opacity下げ）にするか、注釈カードを目立たせることで視認性を確保する - フッター：スライド1・2と同じ
予算が2枚目に収まらない場合（例外）¶
予算項目が非常に多い、または金額の条件分岐が複雑でガントバーに添えきれない場合のみ、 スライド2の代わりにエクセル表のような整理された表形式の別スライドにしてよい。 ただしこれは例外であり、基本はスケジュールのみ→スケジュール＋予算の2枚。
フォントサイズの指針¶
情報密度の高いスライドなので、フォントサイズは全体的に抑える。 - タイトル：12-14pt（大きすぎない。主役はガントチャート） - 月ヘッダー：6-7pt - PJラベル（PJ名）：8-9pt - PJラベル（サブタイトル）：6-7pt - ガントバー内テキスト（タスク名）：6-7pt - ガントバー内テキスト（論点）：5-6pt - 金額テキスト：5-6pt - フッター：5-6pt - X-DAYラベル：6-7pt
タイトルや見出しを大きくしすぎると、ガントチャートの面積が圧迫される。 「読めるが主張しすぎない」サイズを心がける。
カラーの使い方¶
色は「意味があるときだけ」使う。装飾目的の色は不要。
意味のある色の使用： - PJの識別 → PJ1赤、PJ2青、PJ3緑（必要な場合のみPJ4黄） - X-DAYマーカー → 赤 - 金額テキスト → 黄 #C89932（予算情報であることを示す） - 月額フィー → 黄テキスト
意味のない色の使用（避けるべき）： - ステップごとに色を変える（PJ内のステップは同一PJカラーで統一） - 背景のグラデーション - 装飾的なアクセントカラー - タイトルや見出しへの不必要な着色
基本パレット（これ以外の色は原則使わない）： | 用途 | コード | |------|--------| | ダークBG | #1F1F1F | | カード背景 | #161616 | | 白テキスト | #FFFFFF | | グレーテキスト | #C9C5BD | | PJ1 | #BC002D | | PJ2 | #003F6B | | PJ3 | #2D5A3A | | PJ4（必要時のみ） | #C89932 | | 金額・注目情報 | #C89932 | | グレー補助 | #888888 |
編集しやすいPPTXにするための配慮¶
工藤がPowerPoint上で直接テキストを修正することを前提に設計する。
- テキストは図形に直接書き込む。図形＋別テキストボックスの重ね置きはしない
- ガントバーのタスク名・論点 → バーの矩形にaddTextで直書き
- 注釈カード → 1つの角丸矩形にタイトル＋本文をまとめて書く（段落分けで対応）
- PJラベル → 1つのテキストボックスにPJ名＋サブタイトルを段落で
- 図形とテキストの1:1対応。1つの要素＝1つのオブジェクト。テキストを編集してもレイアウトが崩れない構造にする
- 重なりを最小限に。オブジェクト同士がなるべく重ならないように配置する。重なると選択・編集が困難になる
- autoFit: trueは使わない。テキスト量が変わってもボックスサイズが勝手に変わらないようにする
- グループ化は最小限に。ガントバー＋金額テキストなど密接な要素のみ。過剰なグループ化は編集の障壁になる
STEP 4: レビュー＆修正¶
生成後、LibreOfficeでPDF変換→画像化してClaudeがQAし、工藤に提示。 修正指示があれば反映。
よくある修正パターン¶
- ガントバーの時期をずらしたい
- 論点テキストの追加・修正
- 予算項目の追加・金額変更
- PJの追加・削除
- 金額の表示位置の調整
これらは「どこをどう変えたいか」を聞いてから対応する。
初回提案 vs 継続案件の違い¶
| 項目 | 初回提案 | 継続案件 |
|---|---|---|
| タイトル | 「（イメージ）※初回ヒアリングで大きく変更」付き | 「（イメージ）」なし |
| ステップの時期 | 大まかな月のみ | 具体的な日付OK |
| 判断期限 | 入れない | 入れてよい |
| CRITICAL PATH | 入れない | 入れてよい |
| 論点テキスト | 問いの形で | 決定事項＋残論点 |
| 予算 | 概算のみ | 詳細見積OK |
| 金額表記 | 「or」選択肢 | 確定金額OK |
チェックリスト（生成前の最終確認）¶
- ヒアリングで全項目が埋まっているか
- 工藤の構成承認を得たか
- スライド1（スケジュールのみ）→スライド2（スケジュール＋予算）→スライド3（設計ポイント解説）の3枚が生成されているか
- ガントバーに論点テキストが入っているか
- スライド1には金額情報が一切ないか
- スライド2のガントバーの下/横に金額が添えられているか
- タイトルのフォントが12-14pt以下か（大きすぎないか）
- 意味のない色が使われていないか
- X-DAYが未確定なら「？」付きか
- 初回提案なら「（イメージ）」がタイトルに入っているか
- 金額が「or」表記になっているか（レンジ「〜」になっていないか）
- 合算していないか
- フッターが入っているか
改訂履歴¶
- v1.0（2026-04-24）：初版。提案資料のスケジュール＆予算スライドを PPTX で生成。design-spec.md による SSOT 原則を採用。