mcpField
P
paw-tools-presentation

paw-tools-presentation

github.com/pawbytesドキュメント115142 回インストール4 週間前に更新
リポジトリ

paw-tools-presentation について

マーケティング計画、戦略、レポートを、SCR／ピラミッド構造のスタンドアロン HTML プレゼンテーションに変換するスキルです。内容に合わせてデザインを調整します。

主な機能

  1. 01取り込み・構成・生成の3段階
  2. 02SCRとピラミッド原則による構成
  3. 03Chart.jsのビジュアライゼーション
  4. 04PDFダウンロードボタン
  5. 05任意のブランド設定

活用シーン

  1. 01マーケティングレポートを資料化
  2. 02構造的なストーリーで戦略を提示
  3. 03チャート付きHTML資料を作成

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/pawbytes/skill-suites --skill paw-tools-presentation

インストール後、Claude Code で/paw-tools-presentationを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

assets/2x2_matrix_template/
code.html
assets/agenda_template/
code.html
assets/data_visualization_template/
code.html
assets/executive_summary_scr_template/
code.html
assets/kinetic_insight_colour_template/
DESIGN.md
assets/pyramid_content_template/
code.html
assets/section_divider_template/
code.html
assets/team_contact_template/
code.html
assets/title_slide_template/
code.html
references/
01-ingest.md
02-outline.md
03-generate.md
chart-patterns.md
html-template.md
mckinsey-scr-guide.md

詳細

プレゼンテーション作成ツール

概要

マーケティング戦略、計画、レポートを、マッキンゼーのピラミッド原則／SCR（状況・複雑化・解決）構成を用いた洗練された HTML プレゼンテーションに変換します。ビジュアルコミュニケーションと経営層向けのストーリーテリングの両方を理解する、プレゼンテーション戦略家として動作します。

機能: マーケティングコンテンツ（paw-mkt-* スキルまたは生の入力）を取り込み、SCR 形式に構成し、Chart.js のビジュアライゼーションとヒーロー画像を含む、プロフェッショナルな HTML ドキュメントを生成します。

仕組み: 取り込み → 構成 → 生成の 3 段階の段階的なフローです。次の段階に進む前に、各段階を完了します。

出力: CSS、Chart.js、PDF ダウンロードボタンを埋め込んだスタンドアロン HTML ファイルを、{project-root}/.pawbytes/tools-output/presentations/ に生成します。各プレゼンテーションは独自のビジュアル特性を備えます。固定テンプレートに従うのではなく、コンテンツの種類、対象者、ブランドのシグナルに合わせてデザインを調整します。

起動時

{project-root}/.pawbytes/config/config.yaml と {project-root}/.pawbytes/config/config.user.yaml から利用可能な設定を読み込みます。設定がある場合は、以下を抽出します。

  • communication_language（デフォルト：英語）
  • document_output_language（デフォルト：英語）

利用可能な場合は、{project-root}/.pawbytes/tools-output/paw-mkt-setup/brand-config.json からブランド設定を読み込み、色、タイポグラフィ、ブランドの声に使用します。

デフォルトの出力先: {project-root}/.pawbytes/tools-output/presentations/（または設定の presentation_output_folder）

ヘッドレスモード

--headless または -H を指定して起動した場合：

  • ユーザーによるアウトラインのレビューを省略します
  • すべての選択に適切なデフォルト値を使用します
  • 対話なしで完全な HTML 出力を生成します
  • 利用可能な場合はブランド設定を読み込み、ない場合はプロフェッショナルなデフォルト値を使用します

段階

段階 1：コンテンツの取り込み

./references/01-ingest.md を読み込みます

入力ソース:

  • paw-mkt-* スキルからのマーケティングコンテンツ（--from-skill <skill-name> として渡されます）
  • Markdown／テキストドキュメントのファイルパス
  • 直接提供された生のテキスト

進行: コンテンツを取り込み、理解したら → 構成に進みます

段階 2：アウトラインの構成

./references/02-outline.md を読み込みます

結果: マッキンゼー SCR／ピラミッド形式のアウトラインを提示し、ユーザーによるレビューを受けます。ユーザーはセクションの編集、追加、削除、再構成ができます。

進行: ユーザーがアウトラインを承認したら → 生成に進みます

段階 3：HTML の生成

./references/03-generate.md を読み込みます

結果: 以下を含む完全な HTML ドキュメントを生成します。

  • ブランドに沿ったプロフェッショナルなスタイル（設定されている場合）
  • データを視覚化する Chart.js
  • ヒーロー画像／表紙画像（Pexels API または Gen AI）
  • window.print() による PDF ダウンロードボタン

使用する外部スキル

  • paw-mkt-setup — ブランド設定のソース（任意の連携）

出力

場所: {presentation_output_folder} または {project-root}/.pawbytes/tools-output/presentations/{slugified-title}.html

ファイル名の規則: プレゼンテーションのタイトルをスラグ化したものです。

画像ソース

以下の 2 つの方法を利用できます。

  1. Pexels API — 無料のストック写真です。設定に pexels_api_key が必要です。
  2. fal.ai — AI 生成画像です。設定に fal_api_key が必要です。

API キーが設定されていない場合は、プロフェッショナルなプレースホルダーを使用するか、画像の提供をユーザーに求めます。

グラフ

Chart.js を HTML 出力に直接埋め込みます。対応する種類：

  • 棒グラフ（比較）
  • 折れ線グラフ（経時的な傾向）
  • 円グラフ／ドーナツグラフ（割合、市場シェア）
  • 散布図（相関関係）

実装パターンについては、./references/chart-patterns.md を参照してください。

コメント

Markdown 対応