WebGallery

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

*

自分が本を選んでいるかのようなスクロール

   

名称未設定 1

 

丸善出版株式会社とジュンク堂書店が佐賀県とコラボレートした「ほんのひととき」という企画のホームページです。灰色の背景に昔の絵本の様な絵柄で描かれた少年と犬のアニメーションが可愛らしく、シンプルに構成されています。右側にあるボタンをクリックすると本を探しているような目線の移動の仕方をしていて面白いです。そして、おすすめの本を中央に配置するのではなく少ししか見せなかったり、物と一緒に置いてあったり、本がなかったり。選んだ理由が書いてある文章をを中央に配置して本が気になる!というレイアウトにしてスクロールすると横にスライドする構成は凄いと感じました。一つ一つに社員さんのセレクトした理由がイラストと共に書いてあるのも可愛らしいです。

本だけでなく棚に一緒に置いてある物もクリックすると詳細が分かり、お勧めの本と一緒に買う人もいるのかな?と思いました。

 - 動きで表現 ,

Message

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

  関連記事

今後の参考に!スタイリッシュなアニメーション効果を使ったサイトをご紹介!

コーディングをしているときに「どんなアニメーションをつけようか」と考えるのが1つ …

ユーザーごとにデザインを切り替える

ヤマト運輸株式会社の公式ホームページです。 個人・法人・行政や自治体ごとのページ …

各コンテンツに飛ぶボタンを作り、読む側に優しいデザイン

  東京都にある留学サポートを行っている会社です。全体的に色をあまり使 …

下から泡を出して、見ている人が水族館にいるような気分に

大分県大分市にある水族館「大分マリーンパレス水族館 うみたまご」のホームページで …

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

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

猫!

  サイトを開けた途端猫がお出迎えしてくれます。しかもこの写真、日替わ …

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

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

豆苗についてもっと知りたくなる!「豆苗研究会」

広島県広島市にある豆苗やブロッコリースプラウトなど、スプラウト野菜を生産・販売し …

ついついボタンを押したくなる「伊勢丹新宿店 食品フロアのツボ」

伊勢丹新宿店の食品フロアガイド「伊勢丹新宿店 食品フロアのツボ」のホームページで …

花火のアニメーションを使って、夏限定のパッケージデザインを表現したシャンドンの特設サイト

「CHANDON」の2018年夏限定サマーボトルの特設サイトです。 大きな花火や …