Communitygithub.com

字幕処理・表示・アニメーション

動画の字幕をJSONで処理し、表示・アニメーション化するためのスキルです。

字幕処理・表示・アニメーション とは?

このスキルは、Remotionを使用して動画の字幕(キャプション)をJSON形式で処理・表示・アニメーション化する方法を提供します。字幕は`@remotion/captions`パッケージで定義された`Caption`型(text, startMs, endMs, timestampMs, confidence, pageBreakAfter)に従って構造化されます。主な機能として、動画や音声ファイルからの文字起こしによる字幕生成、字幕の動画内表示、.srtファイルからの字幕インポートがあります。Remotion Studioでの開発ワークフローと連携し、字幕編集のベストプラクティスを適用できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/zoih6/masafat-watan-video/tree/HEAD/skills-docs/remotion-skills/remotion-captions

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

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

ドキュメント

すべての字幕はJSONで処理する必要があります。字幕は以下のCaption型を使用します:

import type { Caption } from "@remotion/captions";

定義:

type Caption = {
  text: string;
  startMs: number;
  endMs: number;
  timestampMs: number | null;
  confidence: number | null;
  pageBreakAfter?: boolean;
};

字幕の生成

動画や音声ファイルを文字起こしして字幕を生成するには、transcribe-captions.mdファイルを読み込んで詳細な手順を確認してください。

字幕の表示

動画内に字幕を表示するには、display-captions.mdファイルを読み込んで詳細な手順を確認してください。

字幕のインポート

.srtファイルから字幕をインポートするには、import-srt-captions.mdファイルを読み込んで詳細な手順を確認してください。

作成後

完了したら、スキル「Remotion ベストプラクティス」を読み込んでください。

まだの場合は、特に指示がない限りRemotion Studioを開いてください。

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

関連スキル