remotionlisted

# Remotion Video Skill Reactで動画を生成する Remotion を使い、動画コンテンツを制作する汎用スキル。 ## ★ 品質原則 (Anti-Template) > **「全部ちゃんとやる」がAI生成感の正体。「何を捨てるか」がデザイン。** Remotionファイルの実装時、以下の原則に従うこと。 詳細チェックリスト: `references/anti-template-checklist.md` ### 絶対に避ける6つのパターン | # | アンチパターン | 代替 | |---|--------------|------| | 1 | 全要素が同じspring configで入場 | 要素の重さ別にdamping/massを変える (重:20/1.2, 軽:8/0.3) | | 2 | translateY+opacity の1パターンのみ | マスクリビール、単語スタガー、ハードカット等を混ぜる | | 3 | `delay={i * 8}` の均等ディレイ | `[0, 5, 13, 21]` のような有機的間隔 | | 4 | 全シーンがセンター配置 | 最低1シーンは非対称レイアウト | | 5 | 同じトランジション3回以上 | Wipe, Scale, Hard cut, Crossfade を混ぜる | | 6 | 8秒以上構図が変わらないシーン | 途中でscale/position/ズームを変化させる | ### フック・ペーシング - **最初の3秒**: パターンインタラプト（静寂→爆発、極端ズーム→引き等） - **BPM同期**: カット位置を拍に合わせつつ、**毎拍で切らない**（cut-cut-hold-cut-hold-hold-cut-CUT） - **SFX必須**: トランジション前にwhoosh、テキスト出現にimpact音、フック前に6-10f無音 - **30秒プロモにはSocial Proofビート必須**（「Free」「★4.8」等） ### 品質チェック実行 ```bash bash .claude/skills/remotion/scripts/check-quality.sh <target-dir> ``` このチェックはRemotionファイルの Write/Edit 時に自動実行される（hook設定済み）。 --- ## ブランド設定について > **カラーパレット、フォント、マスコットキャラクターの仕様は、各プロジェクトの `CLAUDE.md` で定義すること。** > このスキルにはブランド固有の情報を含めない。 > プロジェクト側に以下のようなセクションを用意する想定： > > ```markdown > ## Video Branding > - Primary: #XXXXXX > - Accent: #XXXXXX > - Background: #XXXXXX > - Font Heading: ... > - Font Body: ... > - Mascot: （キャラ名、デザイン仕様、アニメーションパターン等） > ``` ## クイックスタート ```bash # 1. プロジェクト初期化（スキル付属スクリプト） bash <path-to-skill>/scripts/init-remotion.sh <project-name> # 2. プレビュー cd <project-name> &&