速すぎる、遅すぎると感じるモーション動画を直す方法
20秒の動画でも、果てしなく長く感じることがあります。1分の動画でも、もっとゆっくり進んでほしいと思うことがあります。どちらの体験も、再生時間だけではほとんど説明できません。大切なのは、次のことが起きるまでに、視聴者がどれだけの作業をする必要があるかです。
だからこそ、「20%速くして」は、高くつく修正指示になりがちです。すべての出来事の間隔を狭め、すでに余裕が必要だった瞬間まで圧縮します。ロゴの演出はきびきびしても、製品の結果は読めなくなります。印象を直す一方、その原因を特定しにくくしているのです。
動画のペースとは、時間の中で注意をどう配置するかです。対象を認識し、情報を読み、操作と結果を結び付けるために、どれだけの時間を与えるかということです。動きは、その一部です。ラベルが読めるようになる瞬間、操作と結果の間隔、次に起きることを予想するだけの情報がそろう時点も含まれます。ペースの改善は、これらのどの関係が機能していないかを見つけることから始まります。
理解が追い付かなくなる瞬間を見つける
架空の経費アプリのデモを考えます。領収書が届き、アプリが合計額を抽出し、誰かがプロジェクトを選び、レポートが更新されます。最初の版では、各出来事に2秒ずつ割り当てます。ストーリーボードでは整然としています。しかし再生すると、領収書は慌ただしく、最後のダッシュボードは妙に遅く感じられます。
それぞれに必要な労力は同じではありません。領収書を認識するには、新しいシーンを把握し、金額の場所を見つける必要があります。プロジェクト選択は、ドロップダウンが見えれば、ほとんど説明が要らないかもしれません。レポートでは変化した数値を見つける必要がありますが、見つけた後の周囲の外枠は何も加えません。同じ時間が、異なる体験を作ります。
一度、一時停止せずに流れを見ます。意図された要点を見失う最初の瞬間を記します。「忙しい」とは書かず、何を理解しようとしていたかを書いてください。どの領収書か、どのプロジェクトか、何が変わったか、なぜ合計額が重要か。それぞれ別の問題で、直し方も異なります。
次に、内容を知らない同僚に、その部分を説明してもらいます。「何かが処理された」と答える人の理解は、「領収書が顧客のプロジェクトに割り当てられた」と答える人より浅いものです。確認前に答えを教えないでください。説明後に納得したことは、その説明が役立った証拠であり、動画が機能した証拠ではありません。
四つの時間配分で動画のペースを診断する
一つ目の時計は動きです。要素が移動、拡大縮小、フェードに使う時間です。二つ目は認識で、対象を特定し、関連する部分を見つける時間です。三つ目は読む時間です。四つ目は推論で、操作と結果、主張と裏付けの証拠を結び付ける時間です。
これらの時計は重なりますが、置き換えられるものではありません。パネルが落ち着くまで0.5秒かかっても、ラベルはすでに読めるかもしれません。段落は技術的には見えていても、回転するカメラのせいで、実際には読めない場合があります。結果はすぐ認識できても、前の状態との関係を理解するには、もう少し時間が必要かもしれません。
有用な注記は、「ここから完全に読める」です。最初のピクセルが見えた位置ではなく、読むのを妨げる最後の動きの後に置きます。次の出来事が注意を要求する位置にも注記します。その間の区間が、そのメッセージを理解する実際の機会です。
経費の例で、抽出した合計額が4.0秒に登場し、4.7秒に拡大縮小を終え、5.2秒に置き換わるとします。表示は1.2秒ですが、安定しているのは0.5秒だけです。より優雅にするために登場を長くすると、後の出来事も動かさない限り、使える区間はさらに短くなります。
IBMがリズムについて明示していること
IBMの公開アニメーション指針は、リズムを、時間差のある動作、原因と結果、休止に結び付けています。視覚的に情報の密度が高い構図では、動きの広がりを抑えることも勧めています。これは重要な区別です。混み合った画面は、すべてをゆっくり動かすだけでは理解しやすくなりません。動くものを減らすのが適切な修正である場合もあります。IBM Design Language:ヒントとテクニック
製品動画に応用すれば、一枚の領収書を処理する間、背景のカードは静止させておけます。レポートが変わる前に、抽出した金額を出せます。最後の結果は、装飾的な粒子が絶えず視線を引こうとしない状態で、見せ続けられます。メッセージの優先順位と合った、時間の中の優先順位を作ります。
全体を鈍くせずに、速い部分を直す
ある部分を速く感じるのは、別々の発見が複数含まれるためであることがよくあります。対処は、それらを分けることであり、単に長いディゾルブを足すことではありません。経費のデモなら、領収書の金額、プロジェクトへの割り当て、更新されたレポートが、すべて同じ瞬間に重要になるべきではありません。
金額を一度、明確に見せます。プロジェクトへの割り当ての間、その金額は同じ場所に保ちます。その後、結果のレポートへ注意を向けます。金額の位置や色を再利用すると連続性を保ちやすくなりますが、その関係が本物であることが条件です。装飾的に色をそろえても、変化した値を見せる代わりにはなりません。
発見を一つ減らす方法もあります。承認済みの領収書がレポートに入ることだけが必要なら、プロジェクトの選択まで見せる必要はないかもしれません。すでに割り当てた領収書から始め、承認によってレポートに項目ができる様子を示します。主張は狭まりますが、シーンの筋はより通ります。
不可欠な条件は取り除かないでください。自動処理が承認済みの領収書だけに適用されるなら、承認状態を隠すと、製品の挙動を誇張する可能性があります。速い語りでは、無関係な操作を減らしながら、示した結果を真実にする条件を保つべきです。
重複する時間を取り除いて、遅い部分を直す
遅い部分は、必ずしも長いわけではありません。先が読めすぎる場合があります。タイトルが滑り込み、止まり、待ち、その後、同じタイミングでサブタイトルが滑り込みます。最初の行を読み終えた視聴者は、残りの流れで、すでに理解した情報を待ち続けます。
意味のあるホールドと、空白のホールドを分けるところから始めます。意味のあるホールドでは、変わった結果を調べ、選択肢を比較し、次の操作の意味を判断できます。空白のホールドでは、完成した考えが表示されていても、もう発見することがありません。同じ2秒でも、どちらにもなり得ます。
まず、空白の区間を短くします。短い見出しが登場中に完全に読めるなら、次のシーンの準備を始める前に、独立した提示用の停止は要らないかもしれません。無関係な二つのメッセージを同時に読ませない範囲で、現在の要点を保ちつつ、構図の端で次の文脈を見せ始めることもできます。
長いカメラ移動も、よくある空白の原因です。ダッシュボードが遠景からノートパソコンへ飛び込み、続いてカメラがグラフへ寄ります。グラフが証拠なら、旅の方が証拠自体より多くの時間を使うかもしれません。もっと近くから始めてみます。広がりのある登場は、大きさや環境が、視聴者に必要な何かを伝える瞬間のために残します。
重要なホールドから逆算する
登場のアニメーションは作って楽しいため、編集者は先にそこを磨きがちです。その結果、凝っていくトランジションの間で、情報を見せるホールドが圧迫されます。順番を逆にしてください。何を確認できる状態にする必要があるかを決め、その区間を確保し、登場と退場を周囲に収めます。
架空の12秒の承認シーンなら、5秒から8秒を「awaiting review」と「approved」の安定した比較に割り当てるかもしれません。その上で、両方の状態を理解できるよう、先行するクリックと状態変化を設計します。
使える時間に比較が収まらないなら、ホールドを圧縮する前に比較を単純にします。六つではなく一つの文書を見せます。ワークスペース全体をズームするのではなく、ステータスを大きくします。条件を削らず、説明文を短くします。
ホールドは死んだ時間ではありません。アニメーションを追うために使った注意を、視聴者が理解へとつなげる時間です。静止した瞬間をすべて欠陥として扱うと、勢いはあっても覚えにくい動きになります。
シーン全体ではなく、条件を出す時点を動かす
架空の年間プランを示す6秒のアニメーションでは、タイミングの修復が分かりやすく見えます。両方の版に、月額US$29が出ます。最初の版では、年払いの行が3.8秒に現れ始め、表示し終わるのは、シーンが退場し始める4.8秒です。価格には十分な表示時間がありますが、料金の全条件が共通して安定するホールドはありません。
修正版では、年払いの行を価格と一緒に登場させます。同じ2.4秒時点で、月額換算とともに、年額US$348の一括請求を読めます。どちらも6秒のままです。修正版の料金説明は0.8秒に落ち着き、4.8秒まで安定して残るため、文全体に4秒の区間ができます。
変える必要がなかったものに注目してください。主な数値、背景、総再生時間、退場です。修正の対象は、主張と条件の依存関係です。元の6秒全体を一様に遅くしても、遅い登場は残るため、同じ不均衡を長くしただけになる場合があります。
経費のシーンにも、この確認を適用します。プロジェクト名が領収書の行き先を説明するなら、割り当て後の状態と一緒に見せます。レポートの合計額が結果の証拠なら、金額が変わる間もラベルを保ちます。一つの出来事を理解するために必要な要素を挙げ、そのまとまりに共通のホールドを与えます。すでにある時間を正しい情報へ割り当てているか確かめてから、シーンを延ばします。
音を合図に使い、その後で無音でも試す
音楽は、ペースの弱さを隠すことがあります。一定の拍に合わせた流れは、情報が不均等な速さで届いていても心地よく感じられます。逆に、分かりやすい製品デモでも、曲のフレーズの変化が不適切な場所にあると、不自然に感じる場合があります。
音声を調整する前に、無音で編集を見直します。視聴者は操作と結果を見つけられますか。強調には依然として意味がありますか。ナレーターが「ここ」と言わないと説明にならないなら、映像の流れにもっと明示的な参照が必要です。
次に、音付きで見ます。アクセントは、動くすべてのオブジェクトを区切るのではなく、重要な変化を補強するように使います。パネルを開く、カードを動かす、数値を変える、見出しを出すという四つに音を付けると、本来一つでよい場面に、注意を競う四つの瞬間が生まれることがあります。
物語が機能してから、音楽を変えるのが適切な場合もあります。ただし、重要な結果に十分な時間を与える代わりにしてはいけません。遅い曲でも、読める前に消えた文字を取り戻すことはできません。
異なる仮説に基づく二つの修正版を作る
曖昧な折衷案を磨く代わりに、小さな別案を二つ作ります。修正版Aでは、内容を保ちながら、分かりにくい結果の周囲で安定した区間を増やします。修正版Bでは、長さを保ちながら、競合するメッセージを取り除きます。時間不足か、情報過多かを試しています。
比較を解釈できる程度に、ほかの部分を近いままに保ちます。修正版Bで色、音楽、カメラ、文言まで変えると、好みを聞いてもペースについてはほとんど分かりません。最小限の意味ある変更で判断し、その判断を広いスタイルへ反映します。
想定する表示サイズで、各版を一度ずつ見せます。「承認後に何が変わりましたか」という同じ具体的な問いを使います。どちらがよく感じたかを尋ねる前に、答えを記録してください。優雅でも誤った結果を伝える流れには、好みにかかわらず、さらに修正が必要です。
フィードバックは、出来事に結び付けたままにします。「レポートが変わる前の、プロジェクトへの割り当てをレビュアーが見落とした。」これなら、直すべき区間が特定でき、次の視聴で使える問いも得られます。
タイムラインを依存関係の連鎖として読む
シーンが次の出来事へ進めるのは、アニメーションのプリセットが終わったときではなく、必要な情報がそろったときです。自動生成のモーションを直す場合には、この違いが重要です。生成されたタイムラインは、意味上の役割が異なっていても、すべてのオブジェクトを一定の間隔でずらすかもしれません。
依存関係を直接確認します。実演する操作より先に、結果が出るべきではありません。主張を評価している間、条件が見えているべきです。比較では、両方の選択肢を、比較できるだけの時間一緒に見せる必要があります。行動喚起は、行動する理由を見た後に出すべきです。
修正を頼むときは、この関係を説明します。「領収書を割り当てる間、抽出した合計額は安定して表示してください。割り当ての後でのみ、レポート項目を出してください。結果の場面では、背景の動きを取り除いてください。」「高級感のあるペースにして」より行動につながり、解決できたかも確かめやすくなります。
先に見せることを意図する場合もあります。結果を一瞬見せると、説明前に好奇心を生むことがあります。意識した物語上の選択にし、後で結果へ明確に戻るようにしてください。予告が誤解を招く約束にならないためです。
ペースが問題ではない場合を見極める
停止中のスクリーンショットを理解できないなら、表示時間を延ばしても救えそうにありません。切り取りが広すぎる、関連する値が小さすぎる、文言が抽象的すぎるのかもしれません。秒数を足す前に、構図を直します。
個々のシーンは理解できるのに、なぜそれらがつながるか説明できないなら、問題は順序です。無関係な機能の間でホールドを長くしても、遅い一覧になるだけです。一つの問いを設け、それに答える証拠を示し、別の問いに答える機能は取り除きます。
視聴者がワークフローをすでに知っていれば、新規の人には必要な導入でも、遅く感じる場合があります。別の版を作る理由になるかもしれません。既存顧客向けの更新紹介と、初めて見る人向けの製品紹介では、与えるべき文脈の量が異なります。
有用な最終確認には、三つの問いがあります。探さずに重要な対象を特定できるか。注意が次へ移る前に、重要な変化を理解できるか。残ったすべての時間が、認識、読解、推論、予測を助けているか。これらに説得力ある答えが出れば、そのペースには理由があります。漠然とした速さの感覚を追うのをやめ、それぞれの考えに必要な時間を与える流れを届けられます。