WebGallery

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

*

サイト全体の装飾を抑えてコンテンツに動きをつけることでさらに魅力的なデザインに

   

名称未設定 1

KinKi Kidsのオフィシャルサイト「KinKi Kids 20th Anniversary」です。

20周年を記念した特設サイトに使用されているロゴがとてもかっこいいサイトです。
ロゴ自体はとても重みを感じるようなデザインなのですが、サイト全体の雰囲気が重くなってしまわないようにフォントや線はとてもシャープなデザインになっています。
ファーストビューで使用されているジャケット写真もピンク系のピンクから水色のグラデーションになっているので、淡く優しい印象を受けます。

下にスクロールすると、グレーの背景色に明るい茶色を使用した落ち着いた雰囲気になります。
ひし形のタイトルや、斜めに切り取られたコンテンツやボタンはサイト全体に動きが出ています。さらにタイトルにはボックスシャドウをかけることでコンテンツに奥行きが出ています。
他のページに移動するときもコンテンツが斜めに切り替わって表示されてカッコいいです!

サイト全体の装飾は抑えている分、コンテンツが表示されるときやページが切り替わるときに動きをつけることで、ひと味違ったデザインになりますね!
スマホ版ではメニュー部分も斜線を使ったデザインになっていて、さらに動きのあるサイトになっています。

 - 色で表現 , ,

  関連記事

ヘッダー・コンテンツ・フッターで背景を分けメリハリを付けたデザインに

千葉県野田市にある美容室「mimpi」のホームページです。 ヘッダー・コンテンツ …

イラストをたくさん使って可愛らしさを演出したサイトがおしゃれ!

東京台東区に本社をかまえる「株式会社 正栄デリシィ」のホームページです。 ファー …

スマートフォンからでも情報が伝わりやすい

  コガノイベイホテルの公式サイトです。全体的に情報量が多いのですが、 …

落ち着いた和の雰囲気と、黒を基調とした色合いで50年という歴史を感じる渋いデザイン

島根県松江市にある塗装会社「ポインテリア」のホームページです。 落ち着いた和の雰 …

カラフルだけどまとまり感のあるトランクルームのサイトが可愛い!

大阪にあるトランクルーム「大阪のトランクルーム レナンド」のホームページです。 …

黒い色を使ったデザインがカッコいい!化粧品ブランドのサイト5選!

未だにこういった化粧品のメーカーって、どこを選んだらいいか迷ってしまいます… 結 …

工場のようなイラストが可愛い!バレンタインのキャンペーンサイト

2017年の東急ハンズのバレンタイン「楽しまなくっちゃ、バレンタイン」の特設サイ …

猫のためのオシャレな爪とぎソファーが欲しくなるショップ

猫のためのおしゃれな爪とぎソファー「カリカリーナ」を販売しているにゃんこ家具の公 …

スライダーとメニューが歯の形になっている特徴的なデザイン

石川県金沢市にある歯科医院「ハッピー歯科医院」のホームページです。 トップのスラ …

イラストレーションでイラストを使用し、分かりやすく可愛らしく

一級建築士事務所「朝日リビング」のホームページです。賃貸物件のリノベーションや個 …