Communitygithub.com

gchalikio/claudius-academy

ブラウザネイティブなプレゼンテーションのためのバニラJSエンジン。テーマに依存せず、Claude CodeスキルによるAIファーストのオーサリング、ビルドステップ不要。

claudius-academy とは?

このスキルは、Vanilla-JSで構築されたブラウザネイティブなプレゼンテーションエンジン「claudius-academy」を提供します。テーマに依存しない設計で、Claude Codeスキルを使用したAIファーストのオーサリングを実現し、ビルドステップが不要なため、迅速にスライドを作成・表示できます。主なユースケースは、開発者やAIエージェントが対話的にプレゼンテーションのコンテンツを生成し、ブラウザ上で直接表示することです。このスキルは、MarkdownやHTMLベースのスライドを動的にレンダリングし、スライド間の遷移やコードハイライトなどの機能をサポートします。使い方としては、Claude Code内でスキルを呼び出し、プレゼンテーションの構造や内容を指示するだけです。コードやファイルパスは自動的に管理され、ユーザーはプレゼンテーションのロジックに集中できます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add gchalikio/claudius-academy

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

claudius-academy は何をしますか?

ブラウザネイティブなプレゼンテーションのためのバニラJSエンジン。テーマに依存せず、Claude CodeスキルによるAIファーストのオーサリング、ビルドステップ不要。

概要

このスキルは、バニラJavaScriptで書かれた軽量なプレゼンテーションエンジンを提供します。静的サイトやビルドツールを必要とせず、Claude Codeのスキルを通じてAIが直接スライドを作成・編集できます。

特徴

  • テーマ非依存: 自由にカスタマイズ可能。CSSやHTMLの構造を制限しません。
  • ビルド不要: そのままブラウザで動作します。npm start や build は不要。
  • AIファースト: Claude Codeのスキルとしてプレゼンテーションの生成・編集が可能。
  • シンプルな構造: スライドは単一のHTMLファイルまたはマークダウンで作成。

使い方

  1. Claude Code で本スキルを有効にします。
  2. claudius-academy コマンドまたはスキル名でプレゼンテーションの作成を指示します(例:「新しいプレゼンテーションを作成して、3枚のスライドで構成して」)。
  3. 生成された index.html または .md ファイルをブラウザで開くと、プレゼンテーションが表示されます。
  4. スライド間の移動は矢印キーまたは画面クリックで行えます。

カスタマイズ

  • スライドのテーマはCSSを追加することで変更できます。
  • コードブロックのシンタックスハイライトを有効にするには、highlight.js などのライブラリをHTMLに追加してください。
  • スライドのトランジション効果はCSSアニメーションで指定可能です。

動作環境

  • モダンなブラウザ(Chrome、Firefox、Edge、Safari)
  • Claude Code 環境(スキルとして利用する場合)

ライセンス

MIT

関連スキル