>_ DevTrendsja

言語

ホーム

言語

セクション

フロントエンド バックエンド モバイル DevOps AI / ML ゲーム開発 ブロックチェーン 組み込み セキュリティ
JavaScript

AIエージェントをインタラクティブなプレゼンテーション生成ツールに変える方法

ニューラルネットワークでプレゼンテーションを生成すると、通常は同じ結末を迎えます。モデルは文字化けしたテキストを含む画像群を吐き出すか、またはブロックの半分がずれたつまらないPowerPointテンプレートを生成し、グラフは手描きのような見た目のものも珍しくありません。こんな結果をマニュアルで修正するのは、FigmaやKeynoteでゼロからスライドを作るよりも時間がかかります。

最近、chuspeeismという中国のデベロッパーが作成したdashi-ppt-skillに出会いました。このリポジトリはGitHubで急速に6000近いスターを集めましたが、理由は明白です。著者は予期せぬ角度からこの問題に取り組み、バイナリのPPTXを即座に痛苦的にレンダリングする代わりに、このツールは、内蔵のビジュアルエディタを備えた готовый インタラクティブなHTMLページを届け、ワンクリックで完全に編集可能なPPTXまたはPDFに変換できます。

デモ

内部構造と動作原理

本質的に、これはAIエージェント向けのスキルです。Claude Code、Codex、Cursor、またはファイルを読んでターミナルコマンドを実行できる他のエージェントに与えることができます。

アイデアはシンプルです。LLMは構造化テキストやコードとうまく連携しますが、プロプライエタリなフォーマットでの図形の正確な配置には非常に苦労します。そのため、dashi-ppt-skillはプロセスを明確なステップに分解します:

  1. エージェントはドキュメントまたはプロンプトを分析し、12のビジュアルテーマから1つを提案します。
  2. ライブラリから適切なレイアウトを選択し(データベースには異なるスライドタイプ用の1000以上のレイアウトバリエーションが含まれています)。
  3. 各スライドが独自のコントロールパネルを備えたミニアプリのように動作するローカルHTMLデッキをアセンブルします。
  4. ブラウザで開き、スライド上で直接テキストを編集し、グリッドスライダーを調整してから、結果をPPTXにエクスポートします。

PPTXにエクスポートすると、テキストはテキストのまま残り、ラスターのスクリーンショットにはなりません。最終ファイルをPowerPointまたはGoogle Slidesで開いて、そこで編集を続けることができます。

HTMLとPPTXの比較

利用可能なテーマとレイアウト

リポジトリには12の組み込みデザインテーマがあります:厳格なコードやダークな分析ダッシュボードから、ネオングラデーションや雑誌スタイルまで。

| | | |---|---| | theme01
theme01 | theme02
theme02 | | theme03
theme03 | theme04
theme04 | | theme05
theme05 | theme06
theme06 | | theme07
theme07 | theme08
theme08 | | theme09
theme09 | theme10
theme10 | | theme11
theme11 | theme12
theme12 |

各テーマには готовый パターンのセットが含まれています:タイムライン、ファネル、SWOTマトリックス、ポーターの5つの力モデル、PESTマトリックス、ガントチャート。

分析モデル

人気のレイアウト

主な機能 — ブラウザでの直接編集

ほとんどのAIツールでは、ボットに再度依頼する必要があります:「3番目のポイントを短く書き直して」や「3列ではなく4列にして」など。这里では、生成されたHTMLインターフェースで直接解決されます。

見出しや段落をクリックして、オンザフライでテキストを編集し、隣接する要素は自動的に高さを調整します。

| インプレーステキスト編集 | 画像の追加 | |---|---| | テキスト編集 | 画像の挿入 |

画像には готовые スロットが作成されます:フォルダからファイルを単にドラッグでき、エンジンは必要な解像度に変換します。

プレースホルダーの入力

各スライドの右側にスライダー付きのパネルが開きます。3枚のカードではなくしましたか?スライダーをドラッグ — これで4枚のカードになりました。グラフの種類を棒グラフから円グラフに変更する必要がありますか?エージェントを再起動せずにワンクリックで実行できます。

| 要素数のスライダー | レイアウト切り替え | |---|---| | 要素スライダー | レイアウト切り替え |

| グラフ種類の切り替え | パレット設定 | |---|---| | グラフ切り替え | パレット選択 |

スライド遷移アニメーションもそこで設定できます:

遷移アニメーション

グラフツアー

クイックスタートとシステム要件

Node.jsバージョン20以上が必要です。

起動とインストールは単一のコマンドで行います:

npx dashi-ppt-skill@latest

AIエージェントにコマンドを与える場合(例えば、Claude Codeで)、単に書くだけで十分です:

Установи и используй скилл: npx dashi-ppt-skill@latest

エージェントがプレゼンテーション構造をアセンブルするとき、コンソールからエクスポートできます:

npm --prefix ./project run export:pptx -- ./output/presentation.pptx
npm --prefix ./project run export:pdf  -- ./output/presentation.pdf

PPTXへのエクスポート

エクスポートには、内部でヘッドレスブラウザが使用されるため、Chrome、Chromium、またはEdgeがマシンにインストールされている必要があります。必要に応じて、バイナリへのパスを環境変数を介して渡せます CHROME_PATH

プライバシーとセキュリティ

多くの人が社内レポートをサードパーティのSaaSサービスに送信することを警戒しています。 здесьでは、すべてのレンダリングとエクスポートはローカルコンピュータで実行されます。ネットワーク呼び出しは最初のnpmパッケージダウンロードと新しいバージョン番号のバックグラウンドチェックのみで、テキストや画像が外部に送信されることはありません。

ライセンスについては、メインコードはコピーレフトのAGPL-3.0ライセンスで公開されています。ただし、変換モジュール html-deck-to-pptx は作者のproprietaryコンポーネントとしてマークされており、このスキルの一部として使用することが許可されていますが、个別のクローズド製品に抽出することはできません。

このプロジェクト誰が恩恵を受けるか

プロジェクトレポート、競合分析、アーキテクチャレビュー、ミートアップの資料などを頻繁に作成する必要がある場合、dashi-ppt-skillが最も面倒な部分を処理します。エージェントに生のメモやmarkdownドキュメントを与え、クリーンなレイアウトを取得し、ブラウザウィンドウで直接テキストを磨くのに数分かけます。ピクセルパーフェクトなデザインにはこのプロジェクトは向いていないかもしれませんが、作業プレゼンテーションを準備するためのクイックツールとしては、优秀に見えます。

関連プロジェクト