motion-design について
構図、変形、リズム、サウンドを通じて、ブリーフや制作途中の作品を整えるモーションデザインスキルです。レンダリング用テンプレートや出力形式を指定せず、制作の指針を提供します。
主な機能
- 01ブリーフ整理とビート設計
- 02構図とアートディレクション
- 03モーションのタイミングと演出
- 04表現形式別の制作指針
- 05編集可能なHTMLモーション制作
活用シーン
- 01短編映像のモーション構想
- 02シーンの切り替えとテンポの改善
- 03キネティックタイポグラフィ制作
- 04編集可能なHTMLモーションの作成
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ nexu-io/ open-design --skill motion-designインストール後、Claude Code で/motion-designを入力して読み込まれたか確認します。
同梱ファイルSOURCES.md
詳細
モーションデザイン
この機能的なヘルパーを使って、ユーザーのブリーフや作業中の成果物を磨き上げます。構図、変化、リズム、そしてユーザーが無音を求めていない限り適切な音を通じて、明確なアイデアをひとつ表現します。現在のタスクに関連する制作ガイダンスを適用してください。このスキルはレンダリング用テンプレートではなく、プロジェクトの作成や出力形式の選択も行いません。そうした判断はモーションデザインの制作ルートが担います。品質とは、動きを見たいと思わせながら、視聴者がアイデアを理解し、記憶に留められることです。
実行コンテキスト
アクティブなホストのタスクルート、ステージ、機能、納品条件に従ってください。このスキルが提供するのはモーション制作の知見であり、ツールへのアクセスを新たに与えたり、ホストのワークフローを変更したりするものではありません。OD Next では、Core、一般的なオーケストレーション、本番環境で使用できる状態を示すキー付きマーカー、および書き込みと同時に納品可能にするデフォルトを維持してください。計画は通常の言葉で立て、制作段階で成果物を作成してください。Plan Contract や Runtime State のブロックを出力したり、プロトコルの修復を求めたり、ホストによって固定された納品条件があると主張したりしてはいけません。ホストの Core が許可した場合に限り、ユーザーが実際に求めた動画モーション制作で、以下に定める範囲内の動画チェックを行えます。動画のブリーフ(時間指定のある映画、プロモーション、解説動画、またはショーリール)の場合、編集可能な HTML ソースと MP4 の両方を必須の納品物として明示してください。MP4 のレンダリングは制作工程であり、納品前に完了させる必要があります。ポインターやスクロールによるインタラクション、または UI のマイクロアニメーションの場合は、実行可能な HTML/コードを納品してください。求められたインタラクションを動画に平坦化してはいけません。未レンダリングの動画ファイルを完成済みと説明してはいけません。
アクティブなタスクのツールと範囲で視覚的な反復が可能な場合は、想定サイズで冒頭、主要な変化、トランジション、テキストの表示時間、エンディングを確認し、連続再生も確認してください。観察できた最大の問題を修正し、影響を受ける箇所だけを再確認します。実行可能なファイルがあるだけでは、モーションが正常に動作した証拠にはなりません。実際に確認した内容と、仕様として指定しただけの内容を区別し、品質測定値を捏造してはいけません。
ブリーフを停滞させずに整理する
まず、ユーザーの素材、参考資料、スクリプト、これまでの決定を活用してください。メッセージと対象者、公開先とアスペクト比、尺、正確な文言、必ず表示する素材、ビジュアルの方向性、音声、必要な出力を整理します。不足情報によってストーリーが変わったり、誤解を招く結果になったりする場合に限り、質問してください。それ以外は一貫した方向性を選び、重要な前提を簡潔に伝えます。制作を依頼したユーザーに、スタイルを3案提示したり承認の段階を設けたりしてはいけません。
制約のない短編動画では、12~18秒、16:9、1920×1080、30fps、作り出したナレーションなし、再生可能なソースを出発点にすると便利です。縦型のソーシャル向けブリーフには9:16が適しています。既存のブランド、タイミング、プラットフォーム、文言がある場合は、これらのデフォルトより優先してください。製品の主張、数値、推薦の声、素材を捏造してはいけません。
既存の計画の一部として、簡潔なビートマップを作成してください。別の文書にはしません。
time → viewer takeaway → focal object → transformation → copy/audio → exit
尺には、登場、読み取るための表示時間、退場を含めます。各ビートをつなぐため、繰り返し登場するオブジェクト、形、線、またはタイポグラフィのモチーフを選んでください。
注目商品向けの仕掛けの例(普遍的なスタイルとしてコピーせず、応用してください): 散らばった単語が周回する → ひとつの単語がほかを引き寄せる → 周回がタイマーに変わる → タイマーが完了し、ワードマークに変わる。それぞれの動きが意味を変化させます。互いに関連しない4枚のタイトルカードでは、この仕掛けが失われます。
動きを加える前にアートディレクションを決める
すべてのシーンを展開する前に、構図の代表となる力強いフレームを一つ完成させます。実際の階層、トリミング、文字、配色、質感、焦点となるオブジェクトを決めます。静止画が弱ければ、パーティクルやカメラシェイク、エフェクトを加えても補えません。計画のみを行う場合は、このフレームを説明し、早い段階で成果物を作成しないでください。
- 主題に結びついた具体的なビジュアルコンセプトを使います。「プレミアム」「シネマティック」「モダン」だけではアートディレクションになりません。フレームを何で満たすのか、どこに視線を集めるのか、どのような素材感にするのか、コントラストをどう構成するのかを定義します。
- タイポグラフィはグラフィックオブジェクトです。サイズ、配置、改行、余白、フォントの特徴を考慮して構成します。実際に使う言語をカバーするフォントを選び、テスト済みの代替フォントを用意し、キャプチャする前にフォントの読み込みが完了するのを待ちます。
- 意図的なコントラストを持たせた小規模な配色を優先します。依頼内容に関係なく、既定のネオングラデーション、ガラス風カード、光る球体、ベージュの背景を使うのは避けます。
- 一貫した素材と世界観を一つ選びます。エディトリアルなインク、精密な計器、折り紙、手触りのあるコラージュ、ベクター幾何学、絵画的なフィールドなど、ほかの妥当な体系でも構いません。その世界観のライティング、エッジ、質感を映像全体に通します。
- シーンは非対称でも、フルブリードでも、要素を絞ったものでも構いません。見出しを3枚のカードの上に繰り返し中央配置するのは避けます。字幕やプラットフォームのクロームは焦点領域から外し、すべてに共通する単一の比率ではなく、出力先に応じたセーフマージンを使います。
- 提供された製品画面やロゴの縦横比と内容は維持します。引き伸ばさず、意図的にトリミングします。データの軸、単位、値は、アニメーション全体を通して正確に保ちます。
動きの流れを組み立てる
主となる動きを選び、それを支える動きで応えます。読み取りやすくなる場合は独立したオブジェクトの動きをずらし、集団の動きが狙いなら一緒に動かします。すべての単語を機械的にずらしたり、画面内で動く範囲を一定の割合に固定したりしないでください。
必須の効果を3つ重ねるのではなく、次の3つのレイヤーを使います。
- 主となる動きでアイデアを伝えます。
- 補助的な動きで重みや因果関係を表現します。後からついてくるラベル、落ち着く影、弾力のある縁、つながったオブジェクトの反応などが該当します。
- 環境的な動きは、シーンに必要な場合にのみ生き生きとした印象を加えます。静かなシーンや読み取りのための間は、完全に静止させてもかまいません。
タイミングと間隔にはそれぞれ異なる役割があります。タイミングはストーリーの節目を配置し、間隔は節目の間の加速や重みを調整します。出発点として、次の範囲を参考にしてください。
| 役割 | 出発点となる範囲 | 動きの形 |
|---|---|---|
| 小さなアクセント/句読点 | 120–220ms | キレよく動き、落ち着く |
| メイン要素の登場 | 350–650ms | 素早く移動し、制御された着地 |
| 意味のある形状変化 | 600–1200ms | 読み取れる導入と収束 |
| 大きなリビール/カメラの移動 | 900–1800ms | 持続する軌道と明確な到達点 |
これらは映像制作上のヒューリスティックであり、UI の応答時間の上限ではありません。移動距離、質量、感情、サウンドトラックに合わせて調整してください。登場にはイーズアウト、意図のある退出にはイーズイン、カメラには滑らかな加速と減速を使います。一定速度の移動は、コンベヤー、時計、スキャン、意図的な機械の動きに適しています。遊び心のある素材は行き過ぎてもよいですが、精密機器は通常、弾ませるべきではありません。
- 速い動きには準備と復帰を加えます。予備動作はごく小さくてもかまいませんが、説明のつかないテレポートではなく、原因が読み取れるようにしてください。
- 物理的な動きが求められる場合は、弧を描く軌道で位置を変えます。精密さや方向性、機械的な意図を示す場合は、直線の軌道を使います。
- 共通する形状を使ってマッチカットする、動くオブジェクトを追って次のシーンへ移る、意味のあるマスクで見せる、または明快にカットします。変化をつけたいという理由ではなく、節目同士の関係に基づいてトランジションを選びます。
- 引き継ぎの際は、速度と方向を保ちます。スケール、照明、オブジェクトの同一性に意図しない飛躍が生じないようにします。トポロジーが適している場合にのみモーフィングを行います。読み取れないメッシュの歪みより、意図して設計されたマッチカットのほうが優れています。
- 動きと休止を交互に配置します。最も強い変化は中心となるアイデアのために取っておきます。強度を最大のままにし続けると、すべてが同じように感じられます。
- 意図を持って締めくくり、モチーフを解決して最後のメッセージを表示したままにします。ループでは、開始時と終了時の状態と速度を一致させ、重複した停止時間を作らないようにします。
ビジュアルの表現方法を選ぶ
製品/ブランド映像: 実際のメリットと具体的なアクションを軸に構成します。 利用可能な場合は実際の画面を使い、変化する部分を切り分け、締めくくりの フレームにもブランドのモチーフを取り入れます。静止ページをゆっくりカメラで 映すだけでは、補足映像にすぎず、デモ全体にはなりません。
キネティック・タイポグラフィ: 言葉の意味を、太さ、字間、方向、変形で 表現します。安定した読み取り領域を保ち、すべての行を回転させたり、ぼかしたり、 散らしたりしないでください。単語ごとの表示では理解を妨げる場合は、フレーズを ひとまとまりとしてアニメーションさせます。表示のタイミングは、読むための時間 ではありません。
解説/データ: 因果関係のモデルを保てる空間的なメタファーを選びます。 変形する前に対象を見せ、関係性が変わる間もラベルを維持します。尺度が重要な 場合は、値より先に軸を表示します。ナレーションを付ける場合は、推測した タイムスタンプではなく、実際に提供された音声または生成した音声のタイミングに 合わせます。説明の弱さを覆い隠すために、無関係な装飾を加えないでください。
アート/プロシージャルなシーン: スタイルの構造と表面のノイズを区別します。 描線、素材、パレット、構図、特徴的な動きを定義します。例:木版画では彫り線の 方向と重ねたインクを使い、夜の絵画では一貫した曲線の筆致と動く光を使い、 切り紙では平面の奥行き、縁の影、蝶番のような動きを使います。テクスチャは一度 生成して一貫性を保って動かします。フレームごとにすべての描線を再生成すると、 ちらつきが生じます。静止画の間でカメラを動かすだけでなく、世界の中にある 要素をアニメーションさせます。人のアイデンティティや複雑な解剖学的形状には、 ツールが対応している場合、適切な提供済み/生成済みアセットを使用し、シルエット、 パレット、ライティングの一貫性を保ちます。そのようなアセットが存在するかの ように装わないでください。
3D/プロ向けツールを使うタスク: 指定されており利用可能な場合は、ユーザーが 既に持っている AE、Blender、または Remotion のプロジェクトを維持します。その 状態を確認し、関連する最小限のシーンを編集して、編集可能なレイヤー/キーフレーム を保持します。ツール固有のパイプラインを使うかどうかは、スキル名ではなく、 求める結果に基づいて判断します。AE、Blender、有料プロバイダー、または新しい フレームワークのインストールを前提にしないでください。
信頼性の高い編集可能なモーションを作成する
新しい Open Design の動画では、GSAP と任意の SVG/Canvas を使ったタイムライン駆動型の HTML を使用します。HTML/SVG はタイポグラフィ、鮮明な図表、UI に適しており、Canvas は密集した描画、フィールド、プロシージャルな世界に適しています。必要に応じて組み合わせてください。このデフォルトに合わせるためだけに作り直すのではなく、既存のサポート対象レンダラーを維持してください。
再生時間、フレームサイズ、パレット、文字のスケール、イージング、シーンのタイミングは、1 つの小さな設定にまとめます。各シーンの要素とモーションは一緒にまとめます。コンテンツ/データと描画は分離します。ジオメトリとキャッシュ済みテクスチャを再利用し、画面外の処理とパーティクル数を制限します。任意のタイムスタンプでシーンが安定するようにしてください。
Open Design の動画コンポジション契約:
<div id="main" data-composition-id="main" data-start="0"
data-duration="15" data-width="1920" data-height="1080" data-poster-time="13.5">
</div>
<script>
// Load GSAP before this block; retain the host's pinned dependency when supplied.
const duration = 15;
const tl = gsap.timeline({ paused: true });
// Define initial states explicitly, then animate scene objects at absolute times.
// tl.fromTo(...); tl.to(...); Reading holds occupy real time in the timeline.
const clock = { t: 0 };
tl.to(clock, { t: duration, duration, ease: 'none' }, 0);
window.__timelines = { main: tl };
// A procedural layer must draw from clock.t, not increment state each frame.
// Video export seeks with timeline callbacks suppressed, so draw from a
// per-frame loop rather than from onUpdate alone:
// (function render() { drawWorld(clock.t); requestAnimationFrame(render); })();
</script>
これはプロトコルの骨組みであり、完成済みのビジュアルテンプレートではありません。実際のコンポジションを作成してください。ルートの再生時間、タイムラインの再生時間、アスペクト比、ブリーフは一致させる必要があります。秒単位の実時間を使用してください。マスタータイムラインでは timeScale(1) を維持し、リピートや開始遅延を設定せず、実際の duration() を data-duration と一致させる必要があります。セッター tl.duration(seconds) は再生速度を変更します。読み取り用のホールド時間を追加するものではありません。上記の全尺クロックトゥイーンを使用し、すべてのトラックをその再生時間内に収めてください。プレーヤーとレンダラーは、書き出し前に整合性のない動画クロックを拒否します。
SVG のポップ/スケール表示では、from 状態の前に共通の原点を設定してください。関連する図形(円盤とその陰影など)は共通のグループをアニメーション化するか、両方の状態で同じ svgOrigin を設定します。遷移先だけに設定しないでください。GSAP のスムーズオリジン補正により、バウンディングボックスの異なる図形がずれる場合があります。
function popShape(tl, node, cx, cy, at, duration = 0.45) {
const svgOrigin = cx + ' ' + cy;
tl.fromTo(node, { scale: 0, svgOrigin },
{ scale: 1, svgOrigin, duration, ease: 'back.out(2)' }, at);
}
実際のコンポジション ID を一貫して使用してください。準備完了を通知する前にタイムラインを登録し、すべての画像/フォント依存関係について既知の準備完了状態を確保してください。可能な場合はアセットをローカルに置き、アクセスできないリモート URL に依存しないでください。
決定論的なモーションは、前後のシークに対応できる必要があります。Date.now に基づくシーン状態、シードなしの乱数、ゼロから再生した場合にしか機能しないシミュレーション、マスタータイムラインと競合する独立した CSS アニメーションは使用しないでください。位置や表示は時間の関数として、またはシーク可能なタイムライントラックとして定義します。表示コンテンツをタイムラインコールバック(onUpdate、onComplete)に依存させないでください。MP4 エクスポーターは、これらを無効にした状態でシークします。 正確な再生が重要なオーディオリアクティブモーションでは、事前に計算したエンベロープまたは既知のビートマップが必要です。任意のパルスが音楽を解析した結果であるかのように示してはいけません。
Open Design は足場と共有ソース再生を埋め込みます。HTML を開くと、別個のプレーヤーバーなしで動画が自動的にループします。映像をクリックすると、一時停止/再開したり、ブラウザーの自動再生によってブロックされた音声を有効にしたりできます。内部の window.__odMotionPlayer インターフェースでは、再生/一時停止、シーク、リプレイを引き続き利用できます。その script[data-od-motion-source-player] は維持してください。競合するコントロールを作成したり、2 つ目の再生クロックを開始したりしないでください。レンダラーは、作成者スクリプトの実行前に window.__odMotionRender を設定し、キャプチャ中のプレビュー用の装飾とスケーリングを無効にします。足場には ./gsap.min.js の GSAP 3.14.2 が固定バージョンで含まれています。このローカルファイルを維持し、参照してください。ダウンロードは不要です。中国語に対応したインストール済み/システムフォントを優先してください。要求されていないフォントが納品を妨げてはいけません。任意のダウンロードに失敗した場合は、別のミラーをさらに探したり、フォントツールをインストールしたり、環境を作成したりせず、利用可能なフォントを使用してください。ホストプレーヤーのない既存のスタンドアロンソースでは、コントロールをコンポジションの外に配置し、同じマスタータイムラインに接続してください。ステージ全体を均一に拡大縮小して画面に収めます。ビューポートの変更に応じてシーンレイアウトをリフローしないでください。コントロールが書き出しフレームに表示されないようにしてください。モーション軽減が要求された場合も有用なポスターを表示し、ユーザーが明示的に再生を開始できるようにしてください。
動画のプランニングとサウンド制作
動画のモーションに関するブリーフでは、既存のデザイン仕様とビートマップで、音声、音楽、効果音をそれぞれ決定します。映像に音楽やサウンドアクセントが効果的で、ユーザーから無音の指定がない場合は、適切なサウンドを先回りして追加します。「ナレーションなし」は音声のみを無効にする指定であり、音楽や効果音が不要という意味ではありません。明示的な無音/ミュート/サウンドなしの指定がある場合は、それを優先します。用途に応じて無音が妥当な場合(たとえば、無音の環境ループなど)は、無音を選択し、その旨を明記します。このポリシーは動画モーションに適用されます。ブリーフで求められていない限り、通常のプロトタイプ、ドキュメント、スライド、インタラクティブなモーションにはサウンドを追加しないでください。
音声に関する判断は通常のプランに記録します。音声のある映像には <meta name="od-motion-audio" content="required">、意図的に無音にする場合は content="silent" を宣言します。これは実際のエクスポーター向けのコンポジションメタデータであり、モデル出力のプランニング契約ではありません。
required の場合は、コンポジションディレクトリ内に実際のローカル音声アセットを用意します。提供された/ライセンス済みのメディア、利用可能な場合はホストの音声生成ツール、またはオリジナルの合成インストゥルメンタル/効果音 WAV を使用します。アセット URL を捏造したり、無関係な音声環境をインストールしたり、音の代わりに脈動する映像を使ったりしないでください。必要な音声の制作に失敗した場合は、無音を完成品として納品せず、阻害要因を報告します。
レンダラーがサポートするタイミング指定を使って、すべてのトラックを宣言します。例:
<audio src="assets/music.wav" data-start="0" data-duration="15" data-volume="0.3" preload="auto"></audio>.
効果音も同じ形式で、それぞれの開始時刻と長さを指定します。音源はローカルの相対パスにし、トラックはあらかじめトリミングし、ループ、再生速度、メディア開始位置の属性は使用しないでください。音楽の音量は音声より低く保ち、アクセントを実際のビートマップに合わせます。共有ソースプレーヤーをそのまま使用してください。映像と音声を自動でループし、音声を再生、一時停止、シーク、再再生に同期します。2つ目の音声クロックを起動したり、エクスポート可能なトラックにならない Web Audio だけを使用したりしないでください。レンダラーはこれらのトラックを MP4 にミックスします。
既存の範囲限定動画チェックでは、ソースの音声がこれらの制御に従うこと、ダウンロードした MP4 に音が聞こえる音声トラックが含まれること、主要なサウンドが指定した時刻に再生されることを確認します。ファイル拡張子や音声タグだけでは、音がある証拠にはなりません。無音の映像も有効です。他のタスク種別で音声を必須にしないでください。
動画の制作と二重納品
動画のブリーフでは、Build 中に Open Design の既存のローカル HyperFrames レンダラーを使用します。動画生成 API キーは不要です。ユーザーに手動でのレンダリングや、2つ目のレンダラーの実行を求めないでください。Plan では、制作ルートに hyperframes-html、編集可能なソースを正本、MP4 を必須の派生出力として宣言します。インタラクティブなブリーフでは html とソースのみを使用します。
読みやすいプランとコンポジション内の MP4 リンクに、ソースと MP4 のパスを記載します。エクスポーターは実際の出力パスと宣言された音声ポリシーを確認します。Open Design は、モデルが作成したプランを解析したり固定したりしません。機械処理用のブロックや、契約を修復するための追加のターンは加えないでください。
この納品ガイダンスは、別のプロジェクト内で明示された動画モーションの依頼も含め、ユーザーが現在実際に依頼している動画モーションにのみ適用します。シナリオが選択されている、またはヘルパーが読み込まれているだけでは、映像制作の許可にはなりません。プランのみの依頼ではプランを提示して終了します。インタラクティブなモーションや、プロトタイプ内のホバー/スクロールアニメーションは、引き続き実行可能な HTML とします。既存の映像は追加の依頼に応じて直接編集できます。依頼された変更が動画に影響する場合にのみ、再レンダリングします。
- ネイティブシェルツールで、表示可能なソースディレクトリを作成します:
"$OD_NODE_BIN" "$OD_BIN" media scaffold --project "$OD_PROJECT_ID" --composition-dir "motion-source/film". 新しい映像を作る場合は内容を表す新しいディレクトリを使用し、改訂時は既存のソースを編集します。hyperframes.json、meta.json、HTML、ローカルアセットはそこに保持します。 motion-source/film/index.htmlを作成します。コンポジションのルートにはdata-composition-id="main"、data-start="0"、data-duration、data-width、data-height、data-fpsを指定します。シーク可能なマスタータイムラインをwindow.__timelines.mainに登録します。プレースホルダーのタイムラインではなく、実際の GSAP アニメーションを使用します。アセットとフォントはローカルに置き、このソースディレクトリからの相対パスを使用します。 head に<meta name="od-motion-output" content="video">と<link rel="alternate" type="video/mp4" href="../../film.mp4">を含めます。 href には、プロジェクト内で実際に予定している MP4 のパスを指定します。 インタラクティブ版ではcontent="interactive"を指定し、MP4 は不要です。 動画の場合、実際のタイムラインから安定していて代表的な場面を選び、その時刻を秒単位でルートのdata-poster-timeに指定します。0 <= time < data-durationを満たす必要があります。冒頭の空白やトランジションは避けます。サムネイルサイズでもプロダクトや主旨が伝わるフレームを優先します。ホストはソースと動画のクロックおよび寸法を検証し、完成した MP4 からこの時刻のフレームを正確に抽出します。別途作成した架空のカバー画像を使ったり、カバー用に動画の冒頭を変更したり、プレビュー用コンテナを動画に埋め込んだりしないでください。- ホスト経由でレンダリングします:
"$OD_NODE_BIN" "$OD_BIN" media generate --project "$OD_PROJECT_ID" --surface video --model hyperframes-html --composition-dir "motion-source/film" --output "film.mp4". タスク ID が返された場合は、"$OD_NODE_BIN" "$OD_BIN" media wait <id>を実行し、成功するまで待ちます。 タスクがキューに入った状態、HTML プレビュー、コマンドの失敗は、映像が完成したことを意味しません。 - ソースとアセットを保持し、最終回答ではプロジェクト相対の Markdown リンクを使って、実際の MP4 とソース HTML の両方にリンクします。ファイルビューアーからプレビューとダウンロードができます。後で動画を編集する場合は、リンク先の MP4 を同じパスに再レンダリングし、ダウンロード内容が最新のソースと一致するようにします。
ホストからレンダラーの失敗が報告された場合は、編集可能なソースを保持し、その障害を正直に報告します。ダウンロードを捏造したり、HTML のみの出力を完成した動画として提示したりしないでください。実際にユーザーが動画モーション制作を依頼しており、かつホスト Core が許可している場合に限り、以下の限定的な確認を行えます:
- 計画時には、既存の Design Spec/ビートマップに事実上の不変条件と必須の文言を保持します。解説動画で字幕を短くする場合は、因果関係の仕組みと例外を保つ必要があります。装飾的な比喩は事実ではありません。
- 最初のレンダリング後、実際のソースと書き出された動画を一度確認します。クロックと寸法を確認し、字幕をこれらの不変条件と照合し、代表的なフレームを最大 3 枚(冒頭、重要な説明、終わり)確認します。関連する SVG 図形の位置が揃っていることも確認します。利用可能なホスト/ブラウザー/フレームツールを使い、画像を実際に表示してください。ソースを読むだけでは視覚的な証拠になりません。ツールにアクセスできず確認できなかった項目について、確認したと主張しないでください。
- 確認またはレンダラーによって具体的な欠陥が見つかった場合は、対象を絞った修正を最大 1 回行い、再レンダリングします。影響を受ける事実/フレームのみを再確認します。それでも誤りがある、または検証できない場合は、正しいと断言せず制約を報告します。
- 検収エージェントを起動したり、美しさを採点したり、別のパイプライン工程を追加したり、終わりのない磨き込みを繰り返したりしないでください。インタラクティブモーション、プロトタイプ、スライド、ドキュメント、その他のタスクには、従来どおり作成時に出荷する方針を適用します。
構成中の品質
各ビートについて、焦点、動きの原因、読み取り時間、終点を考慮します。 トランジションでは、切り替え前後の状態とその重なりを考慮します。 最後は、解決、保持時間、リプレイ時の挙動を考慮します。
作成中は、次の具体的な問題と改善策の組み合わせを活用してください。
| 問題 | より良い判断 |
|---|---|
| スライドショーのように感じられる | ひとつのオブジェクトを、意味のある変化を経て一貫して見せる |
| すべてが競合している | 主となるアクションを選び、補助要素を減らすか、表示を遅らせる |
| 重みが感じられない | 移動時間、加速、予備動作、収束を調整する |
| テキストが読みにくい | 許容される場合に限りコピーを短くし、表示時間とコントラストを高める |
| ありきたりに見える | タイポグラフィ、構図、対象固有のモチーフを強化する |
| ペインターリーなテクスチャがちらつく | マークを初期化してキャッシュし、一貫したフィールドを動かす |
| シーケンスが単調に感じられる | 意図を持ってショットのスケールとアクション/保持のリズムに変化をつける |
| 忙しそうなのに伝わる内容が少ない | 装飾的な動きを取り除き、因果関係のあるアクションを見せる |
美的品質を証明するために、根拠のない数値スコアを作らないでください。使用可能な成果物、その長さとアスペクト比、欠けているアセット、音声、または書き出し機能を簡潔に報告してください。