mcpField
D
dokie-ai-ppt

dokie-ai-ppt

github.com/myzy-aiドキュメント70984 回インストール34 週間前に更新
リポジトリ

dokie-ai-ppt について

Dokie AI PPT Skillは、プレゼンテーションやHTMLのショーケースコンテンツを作成・修正するためのスキルです。要件確認、テーマ選択、アウトライン作成、HTML生成、プレビューを段階的に進めます。

主な機能

  1. 01対話形式の段階的ワークフロー
  2. 02CLIによるテーマ一覧と詳細確認
  3. 03HTMLスライド生成
  4. 04チャートとアニメーションの指針
  5. 05プロジェクトのローカルプレビュー

活用シーン

  1. 01確認済みの要件からプレゼンを作成
  2. 02HTMLのショーケースコンテンツを制作
  3. 03レイアウトを保ちながらスライドを修正
  4. 04生成したスライドプロジェクトをプレビュー

インストール

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

$npx skills add https://github.com/myzy-ai/dokie-ai-ppt --skill dokie-ai-ppt

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

同梱ファイル

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

README_CN.md
README.md
assets/themes/art-education/
page_05.html
page_02.html
page_03.html
page_01.html
page_04.html
meta.json
page_06.html
page_07.html
page_09.html
page_08.html
page_10.html
assets/themes/dokie-vibe/
meta.json
page_01.html
page_04.html
page_03.html
page_02.html
page_05.html
page_06.html
page_12.html
page_09.html
page_13.html
page_10.html
page_07.html
page_15.html
page_14.html
page_11.html
page_08.html
assets/themes/simple-blue-business/
meta.json

詳細

Dokie AI PPT スキル

これは Dokie AI PPT スキルです。プロフェッショナルなプレゼンテーションデザインのスキルです。PPT を生成したり、プレゼンテーションを作成したり、HTML でショーケースコンテンツを構築したりする際に使用します。

ウェブ技術を基盤としており、ミニマルなビジネススタイルから Awwwards レベルのクリエイティブなモーションまで対応します。従来の PPT では実現できない表現を可能にします。

前提条件

npx dokie-cli themes    # Verify CLI is available

ワークフロー

⚠️ 重要：これは対話型のステップごとのワークフローです。各ステップの作業を始める前に、参照先のルールファイルを必ず読んでください。結果をユーザーに提示し、次のステップに進む前にユーザーの返答を待ってください。1 回の応答で複数のステップを急いで進めないでください。

新規プロジェクト
Collect requirements → User confirms → Select theme → User confirms → Generate outline → User confirms → Generate HTML → Preview → User feedback
プロジェクトの変更
Understand intent → Minimal changes → Preserve original layout

詳細については、rules/workflow.md を参照してください。

主な仕様

項目仕様
解像度1280 × 720
グラフChart.js 4.5
アイコンFont Awesome 6.5
アニメーションGSAP（CSS アニメーションは禁止）
禁止事項絵文字、架空の画像 URL

ルール一覧

プロセスと形式
ファイル内容参照するタイミング
workflow.mdワークフロー全体、グループ化のルール、テーマの切り替えタスクを始める前
outline.mdアウトラインの形式（コンテンツ＋デザイン）アウトラインを作成するとき
modify-scenarios.md変更のシナリオ（挿入、削除、分割、統合、スタイル変更など）プロジェクトを変更するとき
quality-check.md生成後の品質チェックリスト生成後、プレビュー前
テーマと生成
ファイル内容参照するタイミング
theme.mdテーマの構成、スタイルの抽出、生成手順HTML を生成する前に必ず読むこと
theme-list.mdテーマの全一覧（ローカル＋オンライン）テーマを選ぶとき
theme-customize.md色、フォント、カスタムテーマの変更ユーザーがカスタマイズを依頼したとき
slide-html.mdHTML の仕様、アイコン、画像のルールHTML を生成するとき
グラフ
ファイル内容
charts/chartjs.md統計グラフ（棒、折れ線、円、レーダー、バブル）
charts/pyramid.mdピラミッド図（HTML＋CSS clip-path）
charts/funnel.mdファネル図（HTML＋CSS clip-path）
charts/timeline.mdタイムライン（HTML＋CSS Flex/Grid）
charts/flowchart.mdフローチャート＋循環図（HTML/AntV/Mermaid）
charts/quadrant.mdクアドラント／SWOT（HTML＋CSS Grid）
アニメーション

シナリオに合わせてスタイルを選択してください。デフォルトは「Balanced」です。

ファイルスタイル用途
animation/minimal.mdMinimalフォーマルなビジネス、投資家向けプレゼンテーション
animation/balanced.mdBalanced汎用、社内トレーニング
animation/creative.mdCreative製品発表、クリエイティブなショーケース

CLI コマンド

npx dokie-cli themes                      # List all themes
npx dokie-cli themes --json               # JSON format output
npx dokie-cli theme <name|id>             # Get theme details (with HTML templates)
npx dokie-cli theme "Dokie Vibe" --json   # JSON format output
npx dokie-cli preview ./my-project/       # Local preview

出力形式

my-project/
├── slide_01.html
├── slide_02.html
├── slide_03.html
└── ...

ファイル名：slide_01.html、slide_02.html … のように連番にします。

主な制約

  1. アウトラインに厳密に従うこと — 変更、拡張、省略をしない
  2. テーマの一貫性 — 色、フォント、スタイルはテーマに厳密に従う
  3. コンテンツの密度 — 1 枚につき 1 つのトピックとし、多すぎる場合は分割する
  4. 画像ソース — ユーザーがアップロードした画像、またはツールで取得した画像のみを使用する
  5. データの整合性 — グラフのデータを捏造しない

コメント

Markdown 対応