WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

しかけ絵本を見ているかのようなサー・トーマス・リプトンのストーリー

      2016/11/09

%e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-1

リプトンのプレミアムシリーズ「サー・トーマス・リプトン」のホームページです。

リプトンの黄色いイメージとは打って変わって、黒を基調とした高級感のあるデザインになっています。
トップのスライダーの背景には茶葉の写真を使ったり、アクセントにロゴカラーの濃い黄色を使っています。

フォントとビジュアルが合うようにタイトルのフォントを少し特殊なものにしたり、スライダーの文字やボタンは光沢感のあるデザインにしたりと、世界観が統一されています。また、ボタンを横並びにしたり、コンテンツを画面幅いっぱいに表示させて区切る役割も果たしていたりと、とても参考になります。

「サー・トーマス・リプトンストーリー」のページでは、イラストと共にストーリーを体感することができます。パララックス効果を使って奥行きを出すことで、まるでしかけ絵本を見ているかのような楽しいページになっています。

 - キャンペーンサイト, 絵で表現, 色で表現 , , ,

  関連記事

時間帯によって背景が変化するアニメーション

燃料販売やガス供給などを行っている企業「株式会社 吉田石油店」のホームページです …

不思議な写真をファーストビューに使うことで、「不思議なレストラン」の世界観を演出したデザインがすごい!

2017年の1月28日から5月21日まで日本橋茅場町にある特設会場で行われる「食 …

万華鏡のようにクルクル変わるタイトルが綺麗!なアートイベント

2016年7月30日から東京ミッドタウン・ホールで開催されている「FLOWERS …

おにぎりを使用したプロモーション

毎年10月16日は「世界食料デー」ということで、おにぎりを食べようというプロモー …

「富山の上質な暮らし」を体感できる情報発信拠点

6月に東京都中央区日本橋にグランドオープンした「日本橋とやま館」のホームページで …

電車の形を使ってデザインされた「相模鉄道株式会社新卒採用サイト」のサイトが、ポップで可愛い!

「相模鉄道株式会社」の2019年度新卒採用サイトです。 ロゴカラーを使った、ポッ …

企業サイトのデザインが、赤と黒の配色でカッコいい!

愛知県名古屋市にある「Y.W.C株式会社」のホームページです。 ファーストビュー …

どんな環境でも見やすい

  横浜にあるレストラン&ショップのサイトです。トップページに施設の外 …

文字の色を少し薄めのグレーにすることで全体的に優しい色合いに

沖縄県の春・夏・秋・冬の季節ごとの魅力を紹介するキャンペーン「しゅんおき!旬香周 …

ニュース一覧を見やすくした大学のサイトがかっこよくてオシャレ!

宮城県仙台市にある福祉大学「東北福祉大学」のホームページです。 ファーストビュー …