pptx-generator

PPTX Generator & Editor

概要

このスキルは、既存のプレゼンテーションの読み取り・分析、XML 操作によるテンプレートベースのデッキの編集、PptxGenJS を使ったゼロからのプレゼンテーション作成など、PowerPoint に関するあらゆる作業に対応します。完全なデザインシステム（カラーパレット、フォント、スタイルのレシピ）と、あらゆるスライドの種類に関する詳細なガイダンスを備えています。

クイックリファレンス

タスク	方法
コンテンツの読み取り・分析	python -m markitdown presentation.pptx
テンプレートから編集または作成	プレゼンテーションの編集を参照
ゼロから作成	以下のゼロから作成するワークフローを参照

項目	値
寸法	10" x 5.625"（LAYOUT_16x9）
色	# なしの 6 桁の 16 進数（例："FF0000"）
英語フォント	Arial（デフォルト）、または承認済みの代替フォント
中国語フォント	Microsoft YaHei
ページバッジの位置	x: 9.3"、y: 5.1"
テーマキー	primary、secondary、accent、light、bg
図形	RECTANGLE、OVAL、LINE、ROUNDED_RECTANGLE
グラフ	BAR、LINE、PIE、DOUGHNUT、SCATTER、BUBBLE、RADAR

参考ファイル

ファイル	内容
slide-types.md	5 種類のスライドページ（表紙、目次、セクション区切り、コンテンツ、まとめ）と追加のレイアウトパターン
design-system.md	カラーパレット、フォントのリファレンス、スタイルのレシピ（Sharp／Soft／Rounded／Pill）、タイポグラフィと間隔
editing.md	テンプレートベースの編集ワークフロー、XML 操作、書式ルール、よくある落とし穴
pitfalls.md	QA プロセス、よくあるミス、PptxGenJS の重大な落とし穴
pptxgenjs.md	PptxGenJS API の完全なリファレンス

---

コンテンツの読み取り

# Text extraction
python -m markitdown presentation.pptx

---

ゼロから作成 — ワークフロー

テンプレートや参考となるプレゼンテーションがない場合に使用します。

ステップ 1：調査と要件の確認

ユーザーの要件（トピック、対象者、目的、トーン、コンテンツの深さ）を理解するために調査します。

ステップ 2：カラーパレットとフォントの選択

カラーパレットのリファレンスを使って、トピックと対象者に合ったパレットを選びます。フォントのリファレンスを使って、組み合わせるフォントを選びます。

ステップ 3：デザインスタイルの選択

スタイルのレシピを使って、プレゼンテーションのトーンに合ったビジュアルスタイル（Sharp、Soft、Rounded、Pill）を選びます。

ステップ 4：スライドのアウトラインを計画

すべてのスライドを、5 種類のページのうち必ず 1 つに分類します。各スライドのコンテンツとレイアウトを計画します。ビジュアルに変化をつけ、スライド間で同じレイアウトを繰り返さないでください。

ステップ 5：スライドの JS ファイルを生成

slides/ ディレクトリに、スライドごとに 1 つの JS ファイルを作成します。各ファイルでは、同期的な createSlide(pres, theme) 関数をエクスポートする必要があります。スライド出力形式と、slide-types.mdにある種類別のガイダンスに従ってください。利用可能な場合は、サブエージェントを使って最大 5 枚のスライドを並行して生成します。

各サブエージェントに伝える内容：

1. ファイル名：slides/slide-01.js、slides/slide-02.js など
2. 画像の保存先：slides/imgs/
3. 最終 PPTX の保存先：slides/output/
4. 寸法：10" x 5.625"（LAYOUT_16x9）
5. フォント：中国語 = Microsoft YaHei、英語 = Arial（または承認済みの代替フォント）
6. 色：# なしの 6 桁の 16 進数（例："FF0000"）
7. テーマオブジェクトの仕様に従うこと（テーマオブジェクトの仕様を参照）
8. PptxGenJS API リファレンスに従うこと

ステップ 6：最終 PPTX にコンパイル

すべてのスライドモジュールをまとめる slides/compile.js を作成します。

// slides/compile.js
const pptxgen = require('pptxgenjs');
const pres = new pptxgen();
pres.layout = 'LAYOUT_16x9';

const theme = {
  primary: "22223b",    // dark color for backgrounds/text
  secondary: "4a4e69",  // secondary accent
  accent: "9a8c98",     // highlight color
  light: "c9ada7",      // light accent
  bg: "f2e9e4"          // background color
};

for (let i = 1; i <= 12; i++) {  // adjust count as needed
  const num = String(i).padStart(2, '0');
  const slideModule = require(`./slide-${num}.js`);
  slideModule.createSlide(pres, theme);
}

pres.writeFile({ fileName: './output/presentation.pptx' });

次のコマンドで実行します：cd slides && node compile.js

ステップ 7：QA（必須）

QA プロセスを参照してください。

出力構成

slides/
├── slide-01.js          # Slide modules
├── slide-02.js
├── ...
├── imgs/                # Images used in slides
└── output/              # Final artifacts
    └── presentation.pptx

---

スライド出力形式

各スライドは、実行可能な完全な JS ファイルです。

// slide-01.js
const pptxgen = require("pptxgenjs");

const slideConfig = {
  type: 'cover',
  index: 1,
  title: 'Presentation Title'
};

// MUST be synchronous (not async)
function createSlide(pres, theme) {
  const slide = pres.addSlide();
  slide.background = { color: theme.bg };

  slide.addText(slideConfig.title, {
    x: 0.5, y: 2, w: 9, h: 1.2,
    fontSize: 48, fontFace: "Arial",
    color: theme.primary, bold: true, align: "center"
  });

  return slide;
}

// Standalone preview - use slide-specific filename
if (require.main === module) {
  const pres = new pptxgen();
  pres.layout = 'LAYOUT_16x9';
  const theme = {
    primary: "22223b",
    secondary: "4a4e69",
    accent: "9a8c98",
    light: "c9ada7",
    bg: "f2e9e4"
  };
  createSlide(pres, theme);
  pres.writeFile({ fileName: "slide-01-preview.pptx" });
}

module.exports = { createSlide, slideConfig };

---

テーマオブジェクトの契約（必須）

コンパイルスクリプトは、以下の正確なキーを持つテーマオブジェクトを渡します。

キー	用途	例
theme.primary	最も暗い色、タイトル	"22223b"
theme.secondary	暗いアクセント、本文テキスト	"4a4e69"
theme.accent	中間色のアクセント	"9a8c98"
theme.light	明るいアクセント	"c9ada7"
theme.bg	背景色	"f2e9e4"

background、text、muted、darkest、lightestなど、他のキー名は絶対に使用しないでください。

---

ページ番号バッジ（必須）

表紙を除くすべてのスライドには、右下隅にページ番号バッジを配置する必要があります。

• 位置：x: 9.3"、y: 5.1"
• 現在の番号のみを表示します（例：3または03）。「3/12」は表示しないでください。
• パレットの色を使い、控えめに仕上げてください。

円形バッジ（デフォルト）

slide.addShape(pres.shapes.OVAL, {
  x: 9.3, y: 5.1, w: 0.4, h: 0.4,
  fill: { color: theme.accent }
});
slide.addText("3", {
  x: 9.3, y: 5.1, w: 0.4, h: 0.4,
  fontSize: 12, fontFace: "Arial",
  color: "FFFFFF", bold: true,
  align: "center", valign: "middle"
});

ピル型バッジ

slide.addShape(pres.shapes.ROUNDED_RECTANGLE, {
  x: 9.1, y: 5.15, w: 0.6, h: 0.35,
  fill: { color: theme.accent },
  rectRadius: 0.15
});
slide.addText("03", {
  x: 9.1, y: 5.15, w: 0.6, h: 0.35,
  fontSize: 11, fontFace: "Arial",
  color: "FFFFFF", bold: true,
  align: "center", valign: "middle"
});

---

依存関係

• pip install "markitdown[pptx]" — テキスト抽出
• npm install -g pptxgenjs — ゼロからの作成
• npm install -g react-icons react react-dom sharp — アイコン（任意）