Details

企画 / 構成

写真展のLPであるため、ビジュアルをメインに、最小限の情報量で世界観や展示写真の雰囲気を感じられる構成を意識しました。
FVでは、写真が過去・現在・未来へと移り変わるアニメーションを取り入れ、都市の変化や時間の流れを表現しています。
ギャラリーではZ型のレイアウトを取り入れ、過去から現在、未来へと順番に視線が流れるよう構成しました。

デザイン

全体をモノトーンで統一し、余白を活かすことで、写真やビジュアルに自然と視線が集まるようなデザインにしました。
また、美術館のようなミニマルなデザインをベースにしながら、CTAなどの重要な要素にはデジタル感のあるカラーやデザインをアクセントとして使用し、世界観を維持しながら視認性も意識しています。

コーディング

FVでは、過去・現在・未来でそれぞれ異なるレイアウトを組み、一定時間ごとに写真が切り替わるアニメーションを実装することで、都市の変化や時間の流れを表現しました。
また、FVの写真演出を本サイトのメインコンテンツとして考えていたため、レスポンシブでもレイアウトが崩れないよう調整しています。
ギャラリーでは、スクロールに合わせて写真が下から表示されるアニメーションを実装し、展示写真を順番に見ていくような没入感を演出しました。
さらに、追従CTAを設置することで、世界観を維持しながらチケット購入へ自然に誘導できるよう工夫しています。