引用:http://jp.louisvuitton.com/jpn-jp/homepage

 

今回はルイヴィトンのホームページです。

世界に名を轟かすファッションブランドなので、奇抜な雰囲気の画像がちらほらとあります。

しかし現在のトップページの画像は白黒写真の市川海老蔵さん。何かと思ったら、新作の時計「ターンブル・ホライゾン」の宣伝だったのですね。このページが面白いです。トップページのこの画像をクリックすると特設サイトへ飛ぶのですが、しばらくすると世界の俳優さんたちが自国の言葉でセリフをしゃべる動画が自動再生されます。時を刻むということをモチーフとした試みのようです。

ページ全体にアニメーションや動画を多様し、インパクトを与えるページ作りの工夫がされています。

引用:http://brand.lipton.jp/leaf/fruits_in_tea/?ad=banner1394

 

今回はリプトンのFruits in Teaのページをご紹介します。

大きな一枚広告、という感じのページ構成です。ページの背景にフレッシュなフルーツの画像が使われているので、甘い香りがこちらまで漂ってきそうな感覚になります。

リプトンのロゴの色である黄色に、赤い文字がふんだんに使われています。赤は強調食なのでこれだけ赤が使われていると目にきそうだと思いがちですが、文字と文字の隙間が程よく空いていることと丸みがかったフォントを使っていること、フォントが細いことによって全くうるささがありません。

これだけの画像と色を使っているのにごちゃごちゃせず、むしろすっきりしています。デザインを勉強する上でとても参考になるページです。

フルーツティーの作り方を見て、思わず真似して作りたくなってしまいました。

引用:https://www.apple.com/jp/

 

今回は、我らがAppleさんのホームページです。いつもお世話になっております。

(余談ですが、私はiPhoneとiMacを使っています。iMacは型が古いので、そろそろ買い換えないとアップデートができなくなってきました…)

Appleのページを見ていつも思うのが、商品の見せ方が上手いということです。大きい1枚画像で異なる大きさの製品を並べていたり、製品の角度を変えたり。スマートなデザインなので、思わずこの商品いいなと欲しくなってしまいます。

あとは、OSのページのキービジュアルの画像がすごく綺麗です。以前は動物で最近は山ですが、画像の迫力に圧倒されます。まるで吸い込まれてしまいそうなぐらい綺麗ですよね。鮮やかさがお見事です。

Appleのページは、テキストやデザイン以上に画像でのアピールの大切さがわかるページだと思います。

引用:https://olympus-imaging.jp/

 

今回はオリンパスのホームページを見ていきましょう。

オリンパスのページは、基本的なホームページの構成(上にロゴがあり、メニューがあってその下にキービジュアル、さらに下にはコンテンツ)なのですが、製品がかっこよく見えます。ページ中央の製品紹介が黒背景で、製品バナーが白背景なのでそのせいでしょうか。

メニューにカーソルを合わせるとさらに細かいリンクメニューがキービジュアルにかぶさるように出てきます。製品のバナーをクリックすると、外観はトップページの仕様のまま、キービジュアルと製品バナー、製品紹介の部分などがその商品の種類の画像に入れ替わります。

独自のWebデザインを追求していく前に、基本的なページの構成を学べるいい見本のページだと思いました。

引用:http://www.harrywinston.com/ja

 

今回は言わずと知れた高級ジュエリーブランド、ハリーウィンストンのホームページを紹介します。

目が飛び出るほど高級なブランドなのでホームページも思わず身構えてしまったのですが、全くそんな心配はなく馴染みやすいページです。

トップページはスクロールなしのページで、全画面の背景がスライドで入れ替わります。上部のメニューにカーソルを合わせるとさらに細かく区分されたメニューが出てきます。

ジュエリーの紹介ページは商品にカーソルを合わせると周りの画像は暗くなり、そこだけ浮き出たように画像が明るくなります。宝石の輝きの表現でしょうか。

ところどころアニメーションを多様していますが、全くしつこさがありません。ジュエリーの高級感よりも、ウェディングなどの幸福感などが表れているホームページだと思いました。