どうも！アルジュナ広報ノダです！

 

僕は普段ウェブディレクターとして働いているんですが、

世の中のウェブサイトのトレンドやユニークな表現を知るためにたくさんのウェブサイトを観るようにしています。

 

多くのウェブサイトを観ていると、特にファーストビューで自分では到底思いつけないような表現や

コーダーさんが頭を抱えてしまうような複雑なプログラミングを見かけます。

 

ファーストビューはいわば「つかみ」のようなものです。

ファーストビューで心を掴むことができればその先のコンテンツまで進んでくれます。

 

今回はそんな制作者の一番の力の入れどころ

「ユニークなファーストビュー」を集めてみました！

 

 

 

 

カメラのファインダーをモチーフにしたファーストビュー

 

最初に紹介するサイトは海外の動画制作会社AODさんです。

https://theartofdocumentary.com/

 

動画制作という会社の事業をファーストビューで表現する手段としてファインダー越しに複数の画像をスクロールさせ、ピックアップされた画像をクローズアップする表現を使っています。

ファーストビューの演出は長くなりすぎると閲覧者にとってストレスになりますが、AODの表現はユニークかつスマートだな〜と感じました。

 

 

 

 

カーソルをつかった面白い表現のファーストビュー

 

つづいてはGIATSという会社のサイトです。

https://giats.me/

 

今は知る人も少ないFLASHという技術が全盛の頃のような表現をされています。

縦長の長方形がランダムに動く独特なファーストビューにアイコンを合わせると、アイコンに人魂のような軌跡が付加されます（笑）

動き、ビジュアルともにとても気持ちの良い作り込みでUXとして価値の高い表現だと感じました。

こういった「動きの気持ちよさ」はプログラミングができるだけではなくデザイン的な考え方も必要となるので実装できる人は少ないだろうなと感じます。

 

 

 

 

常識を覆す造形のファーストビュー

 

3サイト目に紹介するのは多摩美術大学彫刻学科研究室のサイトです。

https://sculpture.tamabi.ac.jp/home

 

「彫刻」をモチーフにメインコピーや学校名、写真の形がズンズン変化します。

正直「見易さ」の観点から考えると見にくいファーストビューになりますが

そもそもサイトのターゲット的に求めるものは学科に対する魅力だと思うので見易さを犠牲にしてでも個性や魅力を表現しユニークなファーストビューにしたのは正解だと思います。

とはいえ実際に提案してGOが出るまで大変だったろうなぁ〜と思いました（笑）

 

 

 

 

思い切りのいいインパクトのあるファーストビュー

 

こちらのUNDさんのサイトはこれまで紹介したサイトと比べると動きはシンプルです。

https://und-ny.com/

 

しかし、ビジュアルとロゴの大胆な配置は日本のサイトではあまり見かけないデザインです。

導入も単色の背景色にビビットな配色のロゴをヌルっとスクロールさせるシンプルながらも目を引く演出です。

ベースのデザインのインパクトが強い場合、このようなシンプルな演出の方がしつこくならなくて良いですね。

 

 

 

 

かわいさと狙いが刺さるファーストビュー

 

次はカワスイ アクア＆アニマルスクールのファーストビューです。

https://school.kawa-sui.com/

 

中央の女性と魚たちの切り抜きが非常に可愛く目を引くファーストビューです。

グラフィックデザインのように作り込まれたビジュアルが素晴らしいです。

モデルさんのチョイスとファッションのコーディネイトも絶妙な配色、ポーズや視線をしっかりサイトの閲覧者に合わせ中央でコピーと一緒に配置するなど計算されたレイアウトもうまいなぁ〜と感じました

 

 

 

 

意味が分かると衝撃のファーストビュー

 

游藝舎さんのファーストビューは衝撃的でした。

https://www.yugeisha.com/

 

一見何を表現しているのか分からないビジュアルなんですが、

セカンドビューの文章でわかります。「筆跡」を表現しているんです。

出版社として後世に残すという思いのモチーフとして筆跡を選択するセンスに脱帽です。

 

わかりやすさだけが全てではなく、こういった粋な表現も記憶に残り心に響くファーストビューの表現だと思います。

 

 

 

 

狂気的な作り込みのファーストビュー

 

最後は普段から仲良くさせていただいているモンブランさんのブランディングサイトです。

https://monf.jp/

 

イラストから現実のビジュアルに変化するインパクトはありそうでなかった表現です。

しかも、そのイラストから現実のビジュアルまで完全オリジナルというのが衝撃的。

オリジナルの気ぐるみを作成したと聞いた時は狂気すら感じました（笑）

イラスト、コピー、絵の作り込み、写真、世界観。

圧倒されるファーストビューです。

 

 

 

 

進化するウェブサイト

 

僕がこの業界に入ったのは15年ほど前ですが、こうして様々なウェブサイトを観ていると時代に合わせて様々な進化をとげているなと感じます。

携帯サイトが生まれ、FLASHが使えなくなったり、スマートフォンが登場し気づけばメインストリームになったり。

その度に制作者たちは新しいことを学び、工夫しウェブサイトを作り上げています。

今回はファーストビューに焦点を当てましたがLPや問合せフォームなんかも取り上げると面白そうですね！

それではまた！