メニュー
ローカルサーバーで起動している Marp スライドを視覚的に検証し、レイアウト問題を自動修正するスキル。「スライドをレビュー」「Marp スライドの視覚的チェック」「スライドのレイアウトを確認」「プレゼン資料の見た目を検証」などのリクエストでトリガーします。テキストの切れ目、重なり、配置問題、コントラスト不足、はみ出し、余白不足などの視覚的問題を検出・修正します。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
AIコーディングエージェント向けの指示書「AGENTS.md」を作成するスキル。プロジェクトにAIエージェントが作業するための文脈と指示を集約するファイルを作成したい場合に使用します。「AGENTS.mdを作成」「AIエージェント用の指示書を作る」「エージェント向けREADMEを作成」などのリクエストでトリガーします。OpenAI Codex、Claude Code、GitHub Copilot、Cursorなど、複数のAIエージェントで共通利用できるオープンな標準フォーマットです。
PRDと機能設計書に基づいてアーキテクチャ設計書を作成するスキル。docs/prd.md と docs/functional-design.md が存在する場合に、テクノロジースタック、レイヤードアーキテクチャ、データ永続化戦略、パフォーマンス要件、セキュリティ設計等を含むアーキテクチャ設計書を作成します。「アーキテクチャ設計書を作成して」「技術仕様書を書いて」「architecture design を作って」等のリクエストで使用してください。
コードレビューを実施するためのスキル。ユーザーがコードの品質、セキュリティ、テスト、パフォーマンス、アーキテクチャの観点からコードレビューを依頼した場合に使用します。「コードレビュー」「コードをチェック」「PRをレビュー」「このコードを確認して」などのコードレビュータスクに言及した場合にトリガーします。セキュリティ脆弱性、ロジックエラー、テスト品質、パフォーマンス問題を優先順位付けして指摘し、具体的な改善提案を行います。
ドキュメントレビューを実施するためのスキル。提案書、設計書、PRD、技術仕様書などのドキュメントをレビューする際に使用します。「ドキュメントをレビュー」「提案書をチェック」「設計書を確認」「この文書をレビューして」「ドキュメントの品質を確認」などのドキュメントレビュータスクに言及した場合にトリガーします。ビジネス・戦略観点、論理構造、技術的妥当性、リスク管理、表現の正確性を多角的に評価し、建設的な改善提案を行います。
ドキュメント執筆をサポートするスキル。ユーザーがPRDに基づいてドキュメントを作成、編集、または更新したい場合に使用します。このスキルは、docs/prd.md に記載されたプロダクト要求仕様書を参照しながら、技術ドキュメント、設計ドキュメント、ユーザーガイド、APIドキュメントなどの執筆を支援します。「ドキュメントを書く」「仕様書を作成」「ガイドを作る」などのドキュメント作成タスクに言及した場合にトリガーします。
PRDに基づいて機能設計書を作成するスキル。docs/prd.md が存在する場合に、システム構成、データモデル、コンポーネント設計、アルゴリズム設計等を含む機能設計書を作成します。「機能設計書を作成して」「PRDから設計書を作って」「functional design を書いて」等のリクエストで使用してください。
| name | marp-slide-reviewer |
| description | ローカルサーバーで起動している Marp スライドを視覚的に検証し、レイアウト問題を自動修正するスキル。「スライドをレビュー」「Marp スライドの視覚的チェック」「スライドのレイアウトを確認」「プレゼン資料の見た目を検証」などのリクエストでトリガーします。テキストの切れ目、重なり、配置問題、コントラスト不足、はみ出し、余白不足などの視覚的問題を検出・修正します。 |
このスキルは、Marp スライドの視覚的な品質を検証し、問題を自動修正します。
http://localhost:8080/slide.md のような形式{BASE_URL}#1, {BASE_URL}#2 でアクセス可能（1始まり）URL が提供されていない場合、必ずユーザーに質問する：
スライドの URL を教えてください（例:
http://localhost:8080/slide.md）
重要: URL が不明な状態では処理を開始しないこと。
各スライド（1〜N）に対して以下を実行：
{BASE_URL}#{SLIDE_NUMBER} にアクセス| 問題 | 説明 |
|---|---|
| テキストの切れ目 | ヘッダーバー、図形、スライド端でテキストが切れている |
| テキストの重なり | テキストが他のテキストや図形と重なっている |
| 配置の問題 | コンテンツが境界や他要素に近すぎる |
| コントラスト不足 | テキストと背景のコントラストが不十分 |
| はみ出し | コンテンツがスライド領域からはみ出している |
| 余白の不足 | 要素間の余白が不十分で窮屈に見える |
問題が見つかった場合：
--- で区切られた箇所）修正テクニックの詳細は references/fix-techniques.md を参照。
検証・修正完了時、以下の形式で報告：
# スライドレビュー結果
## 検証サマリー
- 検証 URL: {URL}
- 総スライド数: {N} 枚
- 問題検出数: {M} 件
- 修正完了数: {X} 件
## 検出された問題と修正内容
### スライド {番号}
- **問題**: {問題の説明}
- **修正内容**: {修正の説明}
（問題があったスライドごとに記載）
## 最終確認
すべてのスライドの視覚的な問題が解消されました。
このスキルを実行するには、以下の能力が必要です：
| 能力 | 説明 |
|---|---|
| ウェブページナビゲーション | 指定 URL へのアクセス、ページ遷移 |
| スクリーンショット撮影 | 表示中のページの画像キャプチャ |
| 画像分析 | スクリーンショットの視覚的問題検出 |
| ファイル読み書き | Markdown ファイルの読み込みと編集 |
このスキルは Playwright MCP を使用して実装できます。
| 能力 | Playwright MCP ツール |
|---|---|
| ウェブページナビゲーション | mcp_playwright_browser_navigate |
| スナップショット取得 | mcp_playwright_browser_snapshot |
| スクリーンショット撮影 | mcp_playwright_browser_take_screenshot |
その他のブラウザ自動化ツール（Selenium、Puppeteer など）でも同様の実装が可能です。