mcpField
8
8-bit-orbit-video-template

8-bit-orbit-video-template

github.com/nexu-ioクリエイティブ・メディア104.6k2.9k 回インストール今日更新
リポジトリ

8-bit-orbit-video-template について

8-bit-orbit-video-template は、単一の HTML テンプレートからレトロなピクセル調の動画構成を作る Hyperframes 向けスキルです。3 シーン構成、時間制約、検証手順を定めています。

主な機能

  1. 013 シーンの動画構成
  2. 02レトロなピクセル調
  3. 03単一 HTML での出力
  4. 04決定的なタイムライン動作
  5. 05テンプレート検証チェックリスト

活用シーン

  1. 01レトロなピクセル動画の作成
  2. 02タイトルと配色のカスタマイズ
  3. 03テンポを保った3シーン構成の制作

インストール

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

$npx skills add https://github.com/nexu-io/open-design --skill 8-bit-orbit-video-template

インストール後、Claude Code で/8-bit-orbit-video-templateを入力して読み込まれたか確認します。

同梱ファイル

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

example.html
assets/
template.html
references/
checklist.md

詳細

Hyperframes ビデオテンプレート

すぐに使えるデフォルトのショーケースと決定論的なタイムライン動作を備えた、プレミアムなテンプレートモードの Hyperframes コンポジションを作成します。

リソース一覧

8-bit-orbit-video-template/
├── SKILL.md
├── assets/
│   └── template.html
├── references/
│   └── checklist.md
└── example.html

example.html で使用されるレンダリング済み MP4 ショーケースは、次の場所でホストされています。 https://repo-assets.open-design.ai/resources/videos/skills/8-bit-orbit-video-template/default-showcase.mp4

ワークフロー

  1. assets/template.html を index.html にコピーします。
  2. ユーザーからペースの変更を明示的に求められない限り、3 シーン構成とトランジションのリズムを維持します。
  3. レトロなピクセル美学を保ちながら、タイトル、サブタイトル、ラベル、配色をカスタマイズします。
  4. タイミングの制約を守ります。各シーンの表示時間は 3 秒以内にします。
  5. 生成されるコンポジションの決定論的な動作を維持します（シードなしのランダム性や、無限に繰り返す GSAP ループは使用しません）。
  6. すべてのコードをインライン CSS／JS とともに、1 つの HTML ファイル内に収めます。
  7. 成果物を出力する前に、references/checklist.md に照らして検証します。

出力仕様

成果物の前に短い文を 1 つ出力し、その後に単一の HTML 成果物を出力します。

<artifact identifier="8-bit-orbit-video-template" type="text/html" title="8-Bit Orbit Video Template">
<!doctype html>
<html>...</html>
</artifact>

コメント

Markdown 対応