메뉴
deck.jsonの品質検証を行う。Playwrightで全ページスクリーンショットを撮影し、スキーマとの突き合わせで未使用・欠損フィールドを検出、修正提案する。 デッキ検証、JSON検証、バリデーション、スライドチェック、validate、check deck と言われたら必ずこのスキルを使う。 /slide-generator で deck.json を作った後に実行するのが標準フロー。
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | validate-deck |
| description | deck.jsonの品質検証を行う。Playwrightで全ページスクリーンショットを撮影し、スキーマとの突き合わせで未使用・欠損フィールドを検出、修正提案する。 デッキ検証、JSON検証、バリデーション、スライドチェック、validate、check deck と言われたら必ずこのスキルを使う。 /slide-generator で deck.json を作った後に実行するのが標準フロー。 |
| argument-hint | [deck.jsonのファイル名（省略時: deck.json）] |
| disable-model-invocation | true |
| allowed-tools | Read, Write, Glob, Grep, Bash(node *), Bash(npx playwright *) |
deck.json の各スライドを検証し、Playwrightで全ページスクショを撮ってレビューする。
$ARGUMENTS のファイル名（省略時: deck.json）を使い、以下のスクリプトで撮影する：
const { chromium } = require('playwright');
const fs = require('fs');
const path = require('path');
const deckFile = process.argv[2] || 'deck.json';
fs.mkdirSync('output/screenshots', { recursive: true });
(async () => {
const browser = await chromium.launch();
const page = await browser.newPage({ viewport: { width: 1920, height: 1080 } });
await page.goto(`http://localhost:5173/?deck=${deckFile}`);
await page.waitForTimeout(2000);
const items = await page.locator('div[style*="cursor: pointer"]').all();
for (let i = 0; i < items.length; i++) {
await items[i].click();
await page.waitForTimeout(500);
const el = await page.locator('[data-slide-index]').first();
await el.screenshot({ path: `output/screenshots/slide-${String(i+1).padStart(2,'0')}.png` });
}
await browser.close();
})();
撮影後、各スクショを Read で確認し視覚的問題もチェックする。
deck.json を Read し、reference.md のスペックと突き合わせる：
## Validation Report
### Slide 1 (#1 title)
📸 output/screenshots/slide-01.png
- ✅ 問題なし
### Slide 3 (#28 statistics)
📸 output/screenshots/slide-03.png
- ❌ stats[0].value が欠損 → 補完必要
- ⚠️ title が25字（目安11字）→ 短縮を提案
### Summary
- 📸 スクショ: output/screenshots/ に {N}枚
- ✅ 正常: N / ⚠️ 要確認: N / ❌ 要修正: N
ユーザーの承認を得てから修正を適用する。
slide-plan.mdまたはユーザーの情報からdeck.jsonを生成する。44種類のレイアウトから最適なものを選び、コンテンツスキーマに従ってJSONを出力する。 スライド生成、deck.json作成、JSON生成、generate slides、プレゼンをJSONにして と言われたら必ずこのスキルを使う。 /slide-planner の出力を入力として受け取ることが多い。
大量の情報からプレゼンテーションの骨格を対話的に設計する。情報整理→核心の引き出し→取捨選択→構成設計→slide-plan.md出力の5ステップ。 プレゼン作りたい、スライド作りたい、資料まとめたい、発表準備したい、アウトライン作りたい、構成考えて、プレゼン企画、presentation plan と言われたら必ずこのスキルを使う。 素材やメモを渡された場合も、まずこのスキルで構成を設計してから /slide-generator でJSON化する。
データと「何を主張したいか」からChart.jsのチャート設定を生成する。主張に合わせた色のintentを自動選択し、deck.jsonに組み込む。 チャート作りたい、グラフ作りたい、データを可視化したい、chart作成、棒グラフ、円グラフ、折れ線グラフ と言われたら必ずこのスキルを使う。 データの見せ方について相談された場合もこのスキルが適切。
Playwrightでスライドをスクリーンショットし、PDFまたはPNG画像として出力する。html2canvasより確実で表示通りの出力が得られる。 PDF出力、画像出力、エクスポート、スライドをPDFにして、PNGで出力、export slides と言われたら必ずこのスキルを使う。 ワークフローの最終ステップとして使う。
deck.jsonの画像・動画プレースホルダーから、画像生成AI用のプロンプトMDファイルを1件1ファイルで生成する。 画像プロンプト作って、image prompt、画像生成依頼、プレースホルダーの画像を用意して と言われたら必ずこのスキルを使う。 /validate-deck の後に実行するのが標準フロー。