動画が再生されない環境でも伝わるFVにする。動きと操作の設計メモ。

動画の完成と、Web上の体験の完成は別。再生・停止・静止画・ボタンの位置を、同じメッセージを届けるための設計として振り返ります。

実践記録：2026.09.17記録・編集：株式会社オーシャン

この記事の考え方

映像だけを見ていると、ボタンを忘れる

オーシャンのFVでは、映像の流れ、手書きの文字、ロゴ、最後のメッセージを調整しました。しかし動画単体が良くても、サイトに載せた画面で相談ボタンが見えなければ、次の行動につながりません。映像の仕上がりと、Web上の配置は別に確認する必要がありました。

PCでは見えていた要素が、スマートフォンではブラウザのメニューに近づく。横長の画面で余裕があっても、縦の高さが小さいと下部が隠れる。こうした状態を、動画の問題として一括りにせず、表示領域と操作の問題に分けます。

再生されるかどうかを、制作者側の一つの環境だけで判断しないことが大切です。再生が始まらない場合にも、何の会社で、何を相談できるかが伝わる画面を残す。手動で再生する導線も、分かる位置に置きます。

動画を見終えた人には、最後のメッセージと相談の導線が同時に見えるようにする。途中で止めたい人には、止める操作を用意する。動画を見せることを優先しすぎて、利用者が自分のペースで情報を読む余地をなくさないようにしています。

動きが苦手な人や、静かに内容を読みたい人もいます。演出を弱めたときに重要な文章まで消えてしまうなら、情報と演出が結び付きすぎています。見出しや説明の役割を整理し、動かなくても主題と導線が分かることを確認します。

また、フェードインが速ければ分かりやすいとは限りません。文字を読む間を残し、ロゴとコピーが競わないようにする。一つの演出を強くするより、表示する順番と滞在する時間を整える方が、印象が落ち着く場面もありました。

確認項目は、動画ファイルが読み込めるかだけにしない。最後の画面でボタンが見えるか、再生できない状態で内容が伝わるか、停止や再開が操作できるかを含めます。ブラウザや画面サイズの違いは、可能な範囲で実際に確かめます。

映像にこだわるほど、利用者が映像を見ない場合の設計も必要になります。これは演出を弱くするためではなく、どの状態でも同じ会社の価値を届けるためです。次の動画制作でも、公開画面での確認を最後の工程に残します。

TALK WITH OCEAN

まだ仕様や依頼内容がまとまっていなくても、まずは経営や現場で気になっていることからお聞かせください。

オーシャンの社内備忘録を、人とAIで整理・編集して公開しています。クライアントを特定できる情報、実際の数値や非公開の画面は掲載していません。

公開：2026.09.28。記録の日付は題材となった取り組み・検討の時点です。