| name | sample-pptx-v3 |
| description | Your Companyの共通スタイルでプレゼン資料(.pptx)を作成するスキル(v3: ロゴ運用の厳格化)。 v2の洗練デザインを継承しつつ、ロゴの過剰使用を排除。ロゴは表紙と最終スライドのみに限定し、 30%以上のアイソレーションエリアを必ず確保する。全ページへのロゴ配置は禁止。 「プレゼン作って」「営業資料を作成」「企画書をスライドにして」「提案書を作って」「pptxを作って」 「自社テンプレートでスライド作成」「ピッチデック作って」「スライド作成」などのリクエストで起動する。 プレゼンテーション、ピッチデック、営業資料、提案書、企画書のスライド作成時には必ずこのスキルを使用すること。 pptxファイルの作成が必要な場面では、汎用pptxスキルよりもこちらを優先して使用する。 Use this skill when the user asks to create a presentation, pitch deck, sales material, or proposal slide deck. Always prefer this skill over the generic pptx skill for creating .pptx files.
|
| metadata | {"version":"3.2.0","author":"Your Company"} |
自社共通スタイル プレゼン資料作成(v3 — ロゴ運用厳格化)
このスキルは自社のブランドスタイルを定義する ラッパースキル である。
PPTX の生成ロジック(作成・編集・QA)は標準 pptx スキルに委譲し、
デザイン(カラー・フォント・ロゴ)だけ自社仕様で上書きする。
v2 からの変更点:
- ロゴの全ページ配置を禁止。 ロゴは表紙と最終スライドの最大2箇所のみに配置可能。コンテンツスライドにはロゴを入れない。
- ロゴのアイソレーションエリア(余白)を30%以上確保。 ロゴの周囲にロゴサイズの30%以上の余白を設け、他の要素と接近させない。ブランドガイドラインに準拠した品格のある配置を実現する。
v2の洗練デザイン(控えめなフォントサイズ、余白を活かした上品なレイアウト)はそのまま継承する。
🔴 ロゴ運用ルール(v3 最重要・最優先ルール)
全ページロゴ配置の禁止
ロゴを全スライドに配置してはならない。 これはv3の最も重要なルールである。
ロゴの配置が許可されるスライドは以下の 最大2箇所のみ:
- 表紙スライド(タイトルスライド) — プレゼンの顔としてロゴを配置してよい
- 最終スライド(Thank You / お問い合わせスライド) — クロージングとしてロゴを配置してよい
それ以外のコンテンツスライド、セクション区切りスライド、目次スライドなどには ロゴを配置しない。
フッターやヘッダーにロゴを繰り返し入れるパターンも禁止。
理由: ロゴを全ページに入れるとくどく、かえってブランドの品格を損なう。表紙と最終スライドだけに絞ることで、ロゴが目に入る瞬間のインパクトが増し、洗練された印象を与える。
アイソレーションエリア(30%以上)
ロゴを配置する際は、ロゴの周囲に ロゴサイズの30%以上のクリアスペース(アイソレーションエリア) を確保すること。このエリア内には他のテキスト、図形、画像を配置してはならない。
計算方法:
- 横長ロゴ(w: 1.5", h: 0.526")の場合:
- 左右の余白: 1.5" × 30% = 0.45" 以上
- 上下の余白: 0.526" × 30% = 0.16" 以上(ただし実用上は左右に合わせて 0.3" 以上を推奨)
- 正方形アイコン(w: 0.4", h: 0.4")の場合:
- 全方向の余白: 0.4" × 30% = 0.12" 以上
つまり、ロゴの占有領域(ロゴ本体+アイソレーション)は以下のようになる:
| ロゴ種別 | ロゴ本体サイズ | アイソレーション込みの占有領域 |
|---|
| 横長ロゴ (w:1.5") | 1.5" × 0.526" | 2.4" × 1.13"(左右+0.45", 上下+0.3") |
| 正方形アイコン (w:0.4") | 0.4" × 0.4" | 0.64" × 0.64"(全方向+0.12") |
const logoW = 1.5;
const logoH = logoW / 2.85;
const isolationX = logoW * 0.3;
const isolationY = logoH * 0.3;
const logoX = (10 - logoW) / 2;
const logoY = 4.2;
titleSlide.addImage({ data: logoBase64, x: logoX, y: logoY, w: logoW, h: logoH });
contentSlide.addImage({ data: logoBase64, x: 0.4, y: 5.0, w: logoW, h: logoH });
slides.forEach(slide => slide.addImage({ data: logoBase64, ... }));
コード作成時のセルフチェック(ロゴ):
addImage でロゴを配置しているスライドを数えること。表紙と最終スライド以外にあれば削除する。
- ロゴ周辺に他の要素が配置されていないか確認する。30%のアイソレーションエリアを侵害していれば位置を調整する。
🔴 テキストカラーの鉄則(全スライド共通・最優先ルール)
自社のスライドは 全ページ白背景 である(背景画像の中央が白いコンテンツエリアのため)。
そのため、以下のルールを全スライドに例外なく適用すること。
白フォント(color: "FFFFFF")は原則禁止。 白背景の上に白テキストを置くと見えなくなる。
| テキスト種別 | 使用するカラー | HEX |
|---|
| スライドタイトル(全ページ) | ダークブルー | #1B5E8A |
| セクション見出し | プライマリブルー | #2C92D5 |
| 本文テキスト | ダークグレー | #333333 |
| 補足テキスト | ミディアムグレー | #666666 |
| 注釈・キャプション | ライトグレー | #999999 |
白テキスト(#FFFFFF)を使ってよい唯一の場面:
ダークブルー(#1B5E8A)やプライマリブルー(#2C92D5)で 塗りつぶした矩形やオブジェクトの中・上 に配置するテキストのみ。
スライド上に直接(背景の上に直接)白テキストを置くのは、タイトル含め全面禁止。
slide.addText("会社紹介", { x: 1, y: 1, fontSize: 28, color: "FFFFFF", bold: true });
slide.addText("会社紹介", { x: 1, y: 1, fontSize: 28, color: "1B5E8A", bold: true, fontFace: "Noto Sans JP" });
slide.addShape(pres.shapes.RECTANGLE, {
x: 0.5, y: 4.5, w: 9, h: 0.65,
fill: { color: "1B5E8A" }
});
slide.addText("まとめ", { x: 0.5, y: 4.5, w: 9, h: 0.65, color: "FFFFFF", fontFace: "Noto Sans JP" });
コード作成時のセルフチェック: addText を書くたびに color パラメータを確認すること。
"FFFFFF" を指定している場合、その直前に同じ座標範囲にダーク系の fill を持つ矩形(addShape)を配置しているか?
配置していなければ、そのテキストは白背景上で見えなくなるので、ダーク系カラーに変更すること。
必須手順(この順番で実行すること)
Step 1: 標準 pptx スキルを読み込む
最初に必ず 標準 pptx スキルの SKILL.md を Read で読み込むこと。
Cowork環境では /sessions/*/mnt/.claude/skills/pptx/SKILL.md に存在する。
# 以下を読み込む(環境に応じて存在する方を使用)
.claude/skills/pptx/SKILL.md
.claude/skills/pptx/editing.md ← テンプレート編集時
.claude/skills/pptx/pptxgenjs.md ← ゼロから作成時
重要: 標準 pptx スキルの手順(作成フロー、QA、画像変換など)にすべて従うこと。
ただし、デザインに関する指示(カラーパレット、フォント選択など)は
以下の自社スタイルガイドを 常に優先 する。
特に注意: 標準 pptx スキルの「Dark/light contrast」セクション(タイトルスライドにダーク背景を使う等)は
完全に無視 すること。自社では全スライドをライトテーマ(白背景)で統一する。
Step 2: 自社スタイルとアセットを適用する
以下のスタイルガイドに従ってデザインする。標準 pptx スキルのカラーパレットやフォント指定より こちらを優先 すること。
アセットはこの SKILL.md と同じディレクトリの assets/ 配下にある:
assets/background.jpg ← 背景画像 (1920x1080, 16:9)
assets/logos/_white/logo_white_Primera.png ← 白ロゴ(ダーク背景用, 456x160px, 横長)
assets/logos/_black/logo_black_Primera.png ← 黒ロゴ(ライト背景用, 456x160px, 横長)
assets/logos/_white/icon_white_Primera.png ← 白アイコン(512x512px, 正方形)
assets/logos/_black/icon_black_Primera.png ← 黒アイコン(512x512px, 正方形)
⚠️ 背景画像の構造の理解(最重要)
background.jpg の構造を正確に把握すること。この画像は以下のように構成されている:
- 外周: グレー〜ブルーのグラデーション装飾枠
- 中央: 白いコンテンツエリア(角丸の白い矩形)
つまり、コンテンツを配置するエリアは 白背景 である。
⚠️ 背景画像の適用方法(必須)
背景画像は 必ず base64 エンコードして slide.background に設定 すること。
addImage で背景を配置してはならない(要素の重なり順の問題が起きるため)。
const fs = require("fs");
const bgPath = "<この SKILL.md と同じディレクトリ>/assets/background.jpg";
const bgBase64 = "image/jpeg;base64," + fs.readFileSync(bgPath).toString("base64");
slide.background = { data: bgBase64 };
🚫 絶対にやってはいけないこと
- 全面ダークオーバーレイの禁止 — 背景画像の装飾枠が潰れる
- ダークテーマスライドの禁止(タイトルスライド含む) — 全スライドをライトテーマで統一
- 白テキスト(
#FFFFFF)をスライド上に直接配置する禁止 — ダーク塗りつぶしオブジェクト上のみ
- ロゴの全ページ配置禁止(v3) — 表紙と最終スライドのみ。コンテンツスライドにロゴを入れない
- ロゴのアイソレーションエリア不足(v3) — ロゴ周囲に30%以上のクリアスペースを確保
⚠️ タイトルスライドのテンプレート(推奨パターン — v3)
タイトルスライドは以下のパターンで作成すること。白テキストは使わない。
ロゴは表紙に1つだけ配置し、アイソレーションエリアを確保する。
const titleSlide = pres.addSlide();
titleSlide.background = { data: bgBase64 };
titleSlide.addText("プレゼンテーションタイトル", {
x: 1.0, y: 1.8, w: 8.0, h: 1.2,
fontSize: 28, fontFace: "Noto Sans JP", bold: true,
color: "1B5E8A",
align: "center"
});
titleSlide.addText("サブタイトルや日付", {
x: 1.0, y: 3.0, w: 8.0, h: 0.5,
fontSize: 14, fontFace: "Noto Sans JP",
color: "666666",
align: "center"
});
const logoBase64 = "image/png;base64," + fs.readFileSync(logoBlackPath).toString("base64");
const logoW = 1.5;
const logoH = logoW / 2.85;
titleSlide.addImage({ data: logoBase64, x: (10 - logoW) / 2, y: 4.2, w: logoW, h: logoH });
⚠️ コンテンツスライドのタイトル(推奨パターン)
各コンテンツスライドのページタイトルは 20pt を基本とする。
コンテンツスライドにロゴは配置しない。
slide.addText("ページタイトル", {
x: 0.7, y: 0.4, w: 8.6, h: 0.7,
fontSize: 20, fontFace: "Noto Sans JP", bold: true,
color: "1B5E8A",
align: "left"
});
⚠️ 最終スライドのテンプレート(推奨パターン — v3)
最終スライド(Thank You / お問い合わせ)にはロゴを配置してよい。
const lastSlide = pres.addSlide();
lastSlide.background = { data: bgBase64 };
lastSlide.addText("ご清聴ありがとうございました", {
x: 1.0, y: 1.5, w: 8.0, h: 1.0,
fontSize: 26, fontFace: "Noto Sans JP", bold: true,
color: "1B5E8A",
align: "center"
});
lastSlide.addText("お問い合わせ: info@example.com", {
x: 1.0, y: 2.8, w: 8.0, h: 0.5,
fontSize: 13, fontFace: "Noto Sans JP",
color: "666666",
align: "center"
});
const logoW = 1.5;
const logoH = logoW / 2.85;
lastSlide.addImage({ data: logoBase64, x: (10 - logoW) / 2, y: 4.0, w: logoW, h: logoH });
⚠️ ロゴの配置方法(必須 — アスペクト比の保持 + カラー選択 + アイソレーション)
ロゴ画像の縦横比を 絶対に変えてはならない。
ロゴカラーの選択ルール:
- 背景画像の中央エリアは白いので、デフォルトは黒ロゴ(
_black/)を使用
- 白ロゴ(
_white/)を使うのは、ダークブルー(#1B5E8A)などの濃い色の矩形の上に配置する場合のみ
横長ロゴ(logo_black_Primera.png / logo_white_Primera.png)
- 元画像: 456 × 160 px(アスペクト比 = 2.85 : 1)
- スライド上の推奨サイズ: w: 1.5", h: 0.526"
- 計算式:
h = w / 2.85
- アイソレーション: 左右 0.45" 以上、上下 0.3" 以上
正方形アイコン(icon_black_Primera.png / icon_white_Primera.png)
- 元画像: 512 × 512 px(アスペクト比 = 1 : 1)
- スライド上の推奨サイズ: w: 0.4", h: 0.4"
- アイソレーション: 全方向 0.12" 以上
ルール: ロゴ・アイコンのサイズを変更したい場合は、w のみを変更し、h は必ずアスペクト比から算出 すること。
アイソレーションエリアも w に連動して再計算すること(w × 30%)。
Step 3: QA を実施する
標準 pptx スキルの QA 手順に従う(markitdown によるテキスト確認 + サブエージェントによるビジュアル検証)。
追加QAチェック:
- 生成したコードの中で
color: "FFFFFF" または color: "ffffff" を検索し、ダーク塗りつぶし矩形の上かどうか確認。
- v3 ロゴ配置チェック: 生成したコードの中で
addImage によるロゴ配置を検索し、以下を確認:
- ロゴが配置されているスライドが表紙と最終スライドのみであること
- ロゴの周囲に30%以上のアイソレーションエリアが確保されていること
- コンテンツスライドにロゴが入っていないこと
- フォントサイズチェック: 表紙タイトル ≤ 30pt、コンテンツスライドタイトル ≤ 20pt。
自社 スタイルガイド(オーバーライド)
標準 pptx スキルにあるカラーパレット・フォント・Design Ideas セクションの代わりに、以下を使用する。
詳細は references/style-guide.md も参照。
カラーパレット(必須)
| 用途 | カラー | HEX |
|---|
| プライマリブルー | メインの強調色・見出しテキスト | #2C92D5 |
| ダークブルー | セクション帯の背景・タイトル強調 | #1B5E8A |
| ライトブルー | 装飾・サブアクセント | #7FB8DB |
| 薄いブルー | カード背景・表ヘッダー | #EAF3FB |
| オレンジ | アクセント(警告・注目) | #E8913A |
| グリーン | アクセント(成功・成長) | #5AAE61 |
| レッド | アクセント(課題・注意) | #D45B5B |
| ダークグレー | 本文テキスト(メインテキスト色) | #333333 |
| ミディアムグレー | 補足テキスト | #666666 |
| ライトグレー | 注釈・キャプション | #999999 |
コンテンツ配置の安全エリア
- 左マージン: x ≥ 0.5"
- 右マージン: x + w ≤ 9.5"
- 上マージン: y ≥ 0.3"
- 下マージン: y + h ≤ 5.3"
フォント(必須 — v2 洗練サイズを継承)
- 見出し: Noto Sans JP(太字)
- 本文: Noto Sans JP
| 要素 | サイズ | 備考 |
|---|
| 表紙タイトル | 26-30pt | 品のある表紙に |
| 表紙サブタイトル | 14-16pt | 控えめに |
| コンテンツスライドのタイトル | 18-20pt | v3.2で縮小。余白をさらに活かす |
| セクション見出し | 16-20pt | スライド内の小見出し |
| カード見出し | 14-16pt | カード内の見出し |
| 本文 | 13-15pt | やや小さめに |
| 注釈・免責 | 9-11pt | 控えめに |
| KPI数値 | 36-48pt | インパクトは残しつつ抑える |
| KPIラベル | 12-14pt | 数値とのバランス |
| 日付 | 12pt | 控えめに |
スライドサイズ
16:9 ワイドスクリーン(10" × 5.625")
資料タイプ別の推奨構成
営業の個別提案書
タイトル → 目次 → 課題整理と理想状態(Before/After) → 提案概要・KPI → 提案詳細 → スケジュール → 費用 → FAQ(16)
※ それぞれ複数Pageあっても問題ない。
その他
お任せ
注意事項
- 日本語で資料を作成する
- プレースホルダーテキスト(〇〇〇、XXXなど)が残っていないか必ず確認する
- テンプレートのスライドを編集する際は、既存のデザイン要素を壊さないよう注意する
- テキストの追加・変更時はフォントとサイズのルールを守る
- 標準 pptx スキルの「Design Ideas」セクションのレイアウトは活用してよいが、カラーとフォントは本スキルの指定を優先
- 標準 pptx スキルの「Dark/light contrast」は完全に無視
- v3特有の注意: ロゴは表紙と最終スライドの最大2箇所のみ。コンテンツスライドにロゴを入れない。ロゴ周囲に30%以上のアイソレーションエリアを確保。
禁止事項まとめ(チェックリスト)
スライド生成コードを書く前に、以下を必ず確認すること: