musoyangrigor/scroll-video-website-skill

これは何？

主な機能

• 01動画を最適化済みWebPフレーム列に変換する。
• 02フレームを段階的に読み込み、前後どちらにも滑らかにスクロール再生できる。
• 03隣接フレームをブレンドする、全画面対応のレスポンシブなcanvasを描画する。
• 04視差効果を減らす設定に対応し、既存のプロジェクトスタックを維持する。
• 05ファイルごとのサイズ推定を提示する、対話型のoptimizeコマンドを提供する。

ユースケース

• 短いデモ動画を使ったプロダクトのランディングページを作る。
• 映画やモーションクリップをもとに、スクロール連動のストーリーテリングページを作る。
• 既存のフロントエンドプロジェクトで、スクロール操作に対応した動画セクションを試作する。
• スクロールサイト用に生成済みのフレーム列のサイズを削減する。

クイックスタート

1. 1

   スキルをインストールする

   npx skills add musoyangrigor/scroll-video-website-skill --skill scroll-video-website
2. 2

   エージェントで動画のパスを指定してスキルを実行する

   $scroll-video-website ./media/product-film.mp4

使う前に知っておきたいこと

• !READMEには、動画をWebPフレームに変換するために必要なツールや依存関係が記載されていません。
• !実行にはAgent Skills互換のエージェントが必要です。単体アプリではありません。

トピック

よくある質問

scroll-video-website-skill とは？

動画を最適化済みWebPフレーム列に変換し、スクロールで操作するcanvasサイトを構築するAgent Skill。 Scroll Video Websiteは、動画をスクロールで前後に移動できる全画面ページに変換する、ポータブルなAIエージェント向けスキルです。動画のパスを指定すると、エージェントが動画を最適化済みWebPフレームに変換し、スクロール操作に対応したレスポンシブなページを生成します。

scroll-video-website-skill は無料で使えますか？ライセンスは？

scroll-video-website-skill は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

scroll-video-website-skill は今もメンテナンスされていますか？

半年以内に更新あり。scroll-video-website-skill の最終コミットは 2026年9月4日 です。

scroll-video-website-skill は何に使えますか？

短いデモ動画を使ったプロダクトのランディングページを作る。 映画やモーションクリップをもとに、スクロール連動のストーリーテリングページを作る。 既存のフロントエンドプロジェクトで、スクロール操作に対応した動画セクションを試作する。 スクロールサイト用に生成済みのフレーム列のサイズを削減する。

scroll-video-website-skill のインストール方法は？

スキルをインストールする: npx skills add musoyangrigor/scroll-video-website-skill --skill scroll-video-website エージェントで動画のパスを指定してスキルを実行する: $scroll-video-website ./media/product-film.mp4

scroll-video-website-skill はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/musoyangrigor/scroll-video-website-skill