日産 LEAF スペシャルサイト

映像主導型UIの設計

本サイトは映像コンテンツを主軸とした構成が前提として定められており、UIはその体験を支える役割を担いました。

過度な装飾や強いCTAによって映像の没入感を損なうことがないよう、インターフェースはあくまでフレームとして設計。EVが持つ先進性や静粛性といった印象を壊さないよう、トーンや余白設計にも一貫性を持たせました。

一覧性と遷移設計の両立

動画本数が多い構成の中で、サイトが冗長にならないことも重要なテーマでした。

VLPへの遷移や各動画の閲覧率を高めるため、コンテンツの一覧性と選びやすさをどう担保するかを検討し、複数のUIパターンを提案・比較。構成がある程度定まっている状況下でも、見せ方の幅を提示することで、体験の可能性を広げました。

"シーンが移る"スクロール体験

スクロール時には画面が急激に切り替わるのではなく、

前の映像や背景の余韻が残りながら次の要素が現れる設計としました。

映像で感覚的に魅力を伝え、テキストはその理解を補助する役割に徹する。

主従関係を明確にすることで、情報を詰め込むのではなく、体験としてのリズムを整えています。

また、視線が迷わないよう中央軸を揃え、要素の出現位置を整理するなど、細部のUI設計によって没入感を支えました。

ブランド体験を、途切れさせないために

CMの余韻を損なわずに次の接点へとつなぐ。

その目的に対し、本プロジェクトでは「映像を主役とするUIの在り方」を検討しました。

構成が定まった条件下でも、見せ方に複数の選択肢を提示し、体験としての最適解を比較できる状態で提案したことは、本案件の重要なプロセスの一つです。

結果として、動画本数の多い構成においても情報の羅列に終わらせず、ブランドの世界観を保ったまま遷移を成立させる設計としています。

本プロジェクトは、ローンチフェーズにおける"映像主導型UI設計"の一つの実践例となりました。