amir-motion は何をしますか?
Amirのプロダクトフィルム用ハウスルール。このフィルムは、非技術系の意思決定者に対して、30〜60秒でプロダクトを説明します。各ステップは一文で、プロダクトが語り、サウンドは映像にロックされ、すべてのフォーマットと言語でクリーンなカット、そして私たちのものでないものは一切含まれません。
<skill-dir> はこのファイルのフォルダです:Claude Codeでは ~/.claude/skills/amir-motion、Piやその他のエージェントでは ~/.agents/skills/amir-motion です。
「スキルを呼び出す」とは、Claude Codeの Skill ツール、Pi の /skill:<name>、または <skills folder>/<name>/SKILL.md を読んでそれに従うことを意味します。
3つのスキルで1つのフィルム。 amir-motion はルール、テンプレート、サウンド、ゲートを所有します。以下の固定ステップで2つのスキルを呼び出します:
| スキル | 所有するもの | 呼び出しタイミング |
|---|---|---|
stageshow | プロダクトUIの見え方:抑制、フレーミング、クロップ、フォーカルオブジェクト、カーソルのストーリー、ポスターフレーム | ステップ 1, 4 |
remotion-best-practices | Remotionの使い方:プロジェクト、マークアップ、Studio、レンダリング、キャプション、アップグレード (remotion-* にルーティング) | ステップ 2, 5, 8 |
どちらかが以下のルールと矛盾する場合、ルールが優先されます(例:stageshowの時間ベースの Act APIは決してフィルムに登場しません:ルール6)。
10のルール(拘束力あり)
| # | ルール | ハードリミット |
|---|---|---|
| 1 | 少ない言葉 | 各ステップ一文、最大10単語、意思決定者にわかりやすい平易な言葉。一度に動くものは一つ。合計30〜60秒。 |
| 2 | 読む時間 | 各センテンスは画面に 1.5秒 + 単語あたり0.3秒以上表示。毎秒17文字以下(実際の秒数、ペーシング後)。読みながらテキストは動かない。 |
| 3 | 見せる、書くな | プロダクトが説明する;キャプションはステップに名前を付けるだけ。プロダクトUIはReactで再構築(スクリーンショットは不可)。統合機能=ロゴ。数字=カウンターまたはチャート、実データのみ。 |
| 4 | テーマに合ったタイプ | 最大3ファミリー(ディスプレイセリフ、UIサンセリフ、モノ)。theme.ts から3テキストサイズ(ディスプレイ、キャプション、ラベル)。キャプション 48px以上、ストーリーが指すUIの文字は30px以上、またはカメラで近づける。 |
| 5 | 赤なし、アクセントは一つ | 赤はエラーまたは破壊的操作のみ(ブランドカラーの場合を除く)。アクセントカラーは一つ、そしてそれは何かを意味する(結果、変化)。色は theme.ts のみに配置。 |
| 6 | 一つの時計 | すべてのビートは、そのシーンの独自の時計における数値。映像、キャプション、サウンドは同じ数値を読む。すべてはフレームから派生:CSSアニメーション、タイマー、Math.random、Date、stageshowの Act ランタイムは禁止。 |
| 7 | 移動、溶解しない | シーンは一つのカメラのように動く(上昇、下降、押し込み、引き戻し)、グレーのクロスフェードは禁止。イーズイン・アウト(トークンのみ)、出口は入口の約半分、フィルムあたり一つのヒーローモーメント。 |
| 8 | サウンドはフィルムの半分 | 一つのキーでタイムライン上に構築されたオリジナルシンセサイザースコア。到着、クリック、見返りの各キュー、アイドルモーションにはなし。マスターは -14 LUFS 統合、ピーク ≤ -1 dBFS。 |
| 9 | 各フォーマットは別のカット | 16:9 マスターと再構成された 9:16(クロップではない)、FRとENは一つのコピーファイルから。フレーム0は実際のサムネイル。ミュートでも読める。テキストはフレームの80%以内。 |
| 10 | 私たちのものでないものはない | 以前のクライアント、内部ツール、サードパーティブランドはコード、コピー、ファイル名、画像、メタデータのどこにも存在しない。すべてのアセットは ASSETS.md にソースを持つ。でっち上げの数字、ロゴ、推薦文は禁止。 |
詳細と数値:references/rules.md。由来:references/source.md。
ワークフロー
- Doctor.
node <skill-dir>/scripts/doctor.mjs。Node (22.18+) を確認し、stageshowと Remotionスキルを公式ソースからインストール(不足している場合)。Claude Code と Pi 用にインストール;他のエージェントには--agent <id>。何かをインストールした場合はその旨を伝える:新しいスキルは次のセッションで読み込まれる;それまでは直接SKILL.mdファイルを読む。 - Brief. ユーザーと一緒に
BRIEF.mdを記入:目標、視聴者、約束(8単語以内)、フォーマット、長さ、ブランドとそのソース、プルーフ。次にビートシート:ステップごとに一行(キャプション、プロダクトの表示内容、サウンド)。ストーリーアークと例:references/brief.md。各プロダクトシーンについて、stageshowの方法で計画:stageshowを呼び出し、シーンごとに、フォーカルオブジェクト、アクション、見返り、除外するもの、最も近いゴールド例(hero-demo,payout-flow,choreography,table-edit,loading…)を書く。ビートシートを表示し、シーンに入る前に承諾を得る(Amirが内容を決定)。 - Scaffold.
remotion-best-practicesを呼び出し、ビルド全体を通してそのルーターを開いたままにする。次に:テンプレートはルーターの「新規プロジェクト作成」ステップを置き換えます;その「プレビューを開く」ステップ(node <skill-dir>/scripts/new.mjs <folder> --name "Product" --forbid "Former Client,internal.host" --install cd <folder> && npm run score && npm run devremotion-studio)に従い、ユーザーがビルドを監視できるようにします。Windows では短いパスを使用(C:/Users/<me>/<name>-motion):ヘッドレスChromeは260文字を超えると失敗します。テンプレートのマップ:references/architecture.md。 - Brand. プロダクトのパレット、ディスプレイフォント、ロゴを
theme.tsとpublic/に配置し、それぞれのソース行をASSETS.mdに記述。stageshow のreferences/looks.mdのように、プロダクト自身のトークンをマッピング。ブランドソースがない?尋ねること。決してでっち上げない。 - Product scenes (stageshow). プロダクトを表示する各シーンについて:ステップ1で指定したゴールド例(
<stageshow>/examples/<gold>/)を開き、stageshow のreferences/craft.md(抑制、タイプ、スペーシング、アイコン)、references/framing.md(クロップ、ガター、レイアウト)、references/motion.md(ストーリー、カーソル、変化する値)を読む。theme.ts、AppWindow、cursorAt、toStageを使用してRemotionで構築し、references/faux-ui.mdのテーブルで stageshow の動きをすべて変換。ゴールドの構造と比率をコピーするが、プロダクトのアイデンティティはコピーしない。 - Remotion markup. シーンコードを書く前に、ルーターを通じて
remotion-markupを読み込む;remotion-captionsを単語レベルの字幕に、remotion-multimediaを実際の映像に、remotion-mapsを地図に、remotion-interactivityをStudioでプロパティを公開するために使用。これらのルールに従う。 - Sound. 同じビート番号で
cues.tsにキューを書き、scripts/score.mtsでアレンジを設定し、npm run scoreを実行。詳細:references/sound.md。 - Dailies.
npm run stillsでカットごとに1枚のコンタクトシートをレンダリング(各シーンが着地した後、その中間、離れる前、さらにフレーム0)。PNGを開いて確認、stageshow のレビュー視点(そこのreferences/review.md)で:目が最初にどこに留まるか、それが結果か、何かがボックス状、フラット、または空でないか。修正して繰り返す。モーションを減らしたマシンのブラウザでモーションを判断してはならない。 - Gate and render.
npm run lint、次にnpm run audit。すべてのFAILを修正し、各WARNを評価。その後npm run finish(レンダリングオプション:ルーター経由でremotion-render)し、再度npm run audit:各MP4のラウドネス、サイズ、fpsを測定。ルール1、3、4、7は人間の目が必要:references/checklist.md。 - Review and deliver. 何かを送り出す前に、シートとブリーフをクリーンコンテキストのレビュー担当者に渡す。MP4、シート、残ったWARN、チェックされなかったものを納品。フォーマットと命名:
references/delivery.md。
赤旗、停止して修正
- 10語を超えるキャプション、または視聴者が一度に読まなければならない2つのキャプションが画面に表示されている。
- プロダクトが実行することで示せることを説明しているセンテンス。
- プロダクトのスクリーンショット、実際の顧客名、実際のチケット番号、私たちのものでないロゴ。
- stageshow の
Act、a.click()、setTimeoutが、ビートに変換されずにシーンに貼り付けられている。 - 名前付きのstageshowゴールド例なしで構築されたプロダクトシーン。
- シーン内に直接入力された16進数値またはフォントサイズ。
- 開始または停止時にイージングのない
interpolate();すべてが一緒にフェードインしている。 Soundtrack.tsx内に直接入力されたフレーム番号、または2つのビートの間に挟まったサウンド。- 2つの暗いウィンドウ間のクロスフェード(グレーの霧)。
- 16:9をクロップして作られた9:16カット。
- 空白または半分描かれたフレーム0。
- 「Studioでは問題なく見える」:コンタクトシートと監査が完了するまで何も完了していない。