WebGallery

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

*

ロゴマークにマウスをホバーさせるとアニメーションになる仕組み

   

名称未設定 1

東京都台東区にあるランドセル工業会が運営している「ランドセルくらぶ」のホームページです。

全体的にコンテンツの背景を丸く切り取り、優しく暖かいデザインになっています。背景のクリーム色や手書きのイラストがまた良いですね。

画面左側のロゴマークはマウスをホバーさせるとアニメーションに切り替わるようになっており、背景のキラキラ部分が様々な配置になりロゴマークが輝いているようにも見えます。その下にあるメニュー部分は、コンテンツの囲いの上に学校のイラストを載せたり、ホバーさせて点線を表示させることでランドセルの縫い目を連想させるデザインにしたり、学校をイメージさせるデザインだと感じました。

ランドセルを選ぶコツやランドセルのお手入れ方法など、ランドセルについての様々な情報が掲載されており見やすいだけでなくとても面白い情報がたくさんあります。意外と知らない正しいランドセルの使い方など参考になりますね。

 - 動きで表現 , ,

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

大人の京都を演出したデザインで和風と高級感を出す

京都府にある太秦映画村で行われているイベント「江戸酒場」のホームページです。 シ …

グローバルナビよりも目立った言語切り替えボタン

熊本県にある有限会社「球磨川ABC」のホームページです。左側に固定された言語選択 …

浴衣の色合いや金魚を使って清涼感を出した「鈴乃屋ゆかたコレクション2018」のサイトが綺麗!

鈴乃屋ゆかたコレクション2018「2018 YUKATA COLLECTION」 …

折り紙の発想から生まれたオフィスチェア「FLIP FLAP」の特設サイトが、オフィスチェアのデザインを使ったレイアウトでカッコいい!

折り紙の発想から生まれたオフィスチェア「FLIP FLAP」の特設サイトです。 …

アニメーションをゆっくりとした動きにし、筆のようなフォントや落ち着いた配色で重厚感を感じさせるデザイン

北海道沙流郡平取町にある「二風谷アイヌ匠の道」のホームページです。 黒・白・赤の …

まるで本当の雑誌を読んでいるかのようなレイアウト

クラフトタイムズが運営するウェブマガジンです。ビールを題材に取り上げ、様々な内容 …

フラットデザインで見やすい

  大阪経済法科大学のサイト。フラットデザインのイラストがとてもおしゃ …

ジャンプ率の差を大きくしてタイトルを目立たせたツアーサイト

「UNISON SQUARE GARDEN」の6thアルバムツアー「Dr.Izz …

ロゴマークの表示を統一することで、ページにアクセントをつける

福岡県福岡市にある「がんこクリニック」のホームページです。 まず初めに、画面いっ …

「伝統」と「革新」を伝える「廣榮堂 採用サイト」

岡山で160年の歴史を誇る老舗和菓子屋「廣榮堂」の採用ページです。 学生たちをタ …