Remotion

Remotionのモノレポに新しいパッケージを追加する際に、ひな形の作成から各所への登録、ドキュメント、使用例、ビルド設定までを整えるスキル。

• 新しい@remotionパッケージの作成
• モノレポ内の登録箇所を整えたいとき
• ドキュメントと使用例の追加

Remotionのコマンドラインや設定に新しいオプションを追加し、型定義、値の読み取り、設定用メソッド、ヘルプとドキュメントまで整えるスキル。

• 新しいCLIフラグを追加したいとき
• 既存フラグを共通の定義に移したいとき
• Configの設定用メソッドとの接続

Remotionのドキュメントサイトをローカルで起動し、Codex内蔵ブラウザで開くスキル。依存関係の準備とビルドから、変更したページのプレビューまで扱います。

• Remotionの解説サイトを起動したいとき
• Docusaurusで変更を確認したいとき
• Codex内でプレビューを開きたいとき

Remotion Studioで文字や図形、動画の各要素を選び、位置・サイズ・色・動きを画面上で編集できるように、Reactのコード構造を整えるスキル。

• Studioで文字や色や位置を変えたいとき
• シーンやクリップの時間を個別に編集
• キーフレームや動きの緩急を調整

Remotionの機能やAPIに関する最新ドキュメントを検索し、該当ページをMarkdownで取得して、現在の仕様に沿った実装を進めるためのスキル。

• Remotionの機能を調べたいとき
• 実装前に現在のAPI仕様を確認したいとき
• ドキュメントをMarkdownで取得

動画や音声の文字起こしから字幕の表示・アニメーション、SRTの取り込みまでを案内し、Remotionで使う字幕データを共通のJSON形式で扱うスキル。

• 動画や音声から字幕を作りたいとき
• 動画に動きのある字幕を表示したいとき
• 既存のSRT字幕を取り込みたいとき

プロジェクト内のRemotionと関連パッケージを更新し、バージョンを揃えます。依存関係やロックファイル、導入済みスキルも確認し、更新後の差分を点検します。

• Remotionと関連パッケージの一括更新
• ワークスペース間のバージョン統一
• 更新時に補助パッケージも調整

Remotionで動画のシーンやアニメーション、映像効果を実装するスキルです。Studioで個別に編集しやすい構造や、動画・音声・画像素材の扱い方を案内します。

• タイトルをフェードインさせたいとき
• 編集可能なテロップを重ねたいとき
• 複数シーンのタイムライン整理

Remotionで作った動画や静止画を書き出すスキルです。指定した複数フレームをまとめて画像にする方法や、背景が透明な動画を出力する際の参照先も案内します。

• 完成した動画を書き出したいとき
• 構成を静止画として保存したいとき
• 指定フレームのPNG一括出力

Remotionの動画に地図や地形のアニメーションを取り入れるスキルです。衛星画像、地球表示、地理情報への注釈、山間の飛行映像など、作りたい場面に合う手法を選びます。

• 衛星画像に動きを重ねたいとき
• Mapboxで地球や3D建物の表示
• APIキー不要の地図を使いたいとき

ブラウザで音声・動画を扱うMediabunnyを使い、音声と動画の長さ、動画の幅と高さを取得する方法を案内します。メディアファイルの基本情報を調べるためのスキルです。

• 音声の長さを秒単位で調べたいとき
• 動画の長さを秒単位で調べたいとき
• 動画の幅と高さを確認したいとき

Remotionの動画制作中にStudioを起動し、ブラウザでプレビューを確認するスキルです。変更を見ながら制作を進め、起動先やポートも指定できます。

• 動画制作の早い段階で確認したいとき
• 編集中の変更を画面で見たいとき
• アプリ内ブラウザでのプレビュー

Remotionでの動画制作や字幕、地図表現、書き出しなど、依頼に応じた専門ガイドへ案内し、プレビューで確認しながら作業を進めるためのスキル。

• プレビューを見ながら動画を作りたいとき
• 字幕や動く地図の手順を探したいとき
• 完成した動画を書き出したいとき

Remotionで新しい動画を作るために、既存ファイルを確認してプロジェクトを準備し、Studioでプレビューを見ながらシーンやクリップを組み立てるスキル。

• 新しい動画プロジェクトを準備したいとき
• 既存プロジェクトに動画を追加
• 複数シーンの動画を作りたいとき

フォーム入力からの動画生成や動画エディターなど、Remotionを組み込むアプリの開発に向けて、テンプレート選び、プレビュー表示、動画の書き出し方法を案内するスキル。

• フォーム入力から動画を生成したいとき
• Reactアプリに動画プレビューを追加
• 動画の書き出し先を選びたいとき

Best practices for Remotion - Video creation in React

日本語の概要は準備中です。原文の説明を表示しています。

Upgrade Remotion, and related packages

日本語の概要は準備中です。原文の説明を表示しています。

Content, animation and effects best practices

日本語の概要は準備中です。原文の説明を表示しています。

Create a new Remotion video

日本語の概要は準備中です。原文の説明を表示しています。

Router for all Remotion skills

日本語の概要は準備中です。原文の説明を表示しています。

Search Remotion documentation

日本語の概要は準備中です。原文の説明を表示しています。

Structure Remotion markup for interactivity

日本語の概要は準備中です。原文の説明を表示しています。

Interacting with Mediabunny

日本語の概要は準備中です。原文の説明を表示しています。

Export a Remotion video

日本語の概要は準備中です。原文の説明を表示しています。