WebGallery

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

*

建物の外観を連想させる背景のアニメーション

   

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

東京都千代田区にある「有楽町マリオン」のホームページです。

背景のアニメーションやレイアウトがとても特徴的なサイトです。
有楽町マリオンの外観を連想させる背景のアニメーションはとてもインパクトがあって、サイト全体がとても綺麗な雰囲気になっています。

また、右側のコンテンツ部分はファーストビューで「ショップリスト」が表示されるようになっており、表示される瞬間にバーコードがロゴになっていくアニメーションを使っています。
スマートフォンで閲覧した際には、コンテンツに背景が埋もれてしまわないように、縦長の1ページではなく、各コンテンツのページに移動するようになっています。
画面下部にメニューが固定されているのも、タイトルがメニューに重ならないように工夫されています。

 - 色で表現

  関連記事

女性をメインターゲットにした、可愛らしい「塗装業」のサイト3選!

現在勤めている会社では、塗装業のサイトを新規作成・リニューアルすることが多いです …

多彩なアニメーションを使ったサイト

  私が言っていいものかどうか分かりませんが、懐かしきCyndi La …

1つの場所に複数のコンテンツを掲載し、スクロールを減らす

NPO法人「夢職人」のホームページです。 子供や若者を対象としたイベントを企画・ …

いちはらで開催しているアートイベントのサイトがシンプルでおしゃれ!

2017年4月8日の土曜日から5月14日の日曜日まで千葉県市原市で開催されている …

情報が増えてもいいようにあらかじめ左側にボタンをつけておく

スクールクラフトの商品紹介ホームページです。 ページを表示してまず使用例がアニメ …

「KAWAII文化」独特の世界観を大切にしたデザイン

原宿にある「カワイイモンスターカフェ」のホームページです。 ファーストビューのイ …

就活生に語りかけるキャッチコピーがインパクト大!兼松株式会社の新卒採用サイト

「兼松株式会社」の2019年度新卒採用サイトです。 ファーストビューの動画がとて …

黒と白を使ってカッコよさを演出したガレージハウス

山梨県北杜市にあるリゾート型賃貸ガレージハウス「八ヶ岳ガレージハウス」のホームペ …

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

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

トップページの写真や映像が幻想的な世界に誇る「水の山」プロジェクト

2014年に南アルプス地域がユネスコエコパークに登録されたのをきっかけに、世界に …