My Selection of 100 Website

Webデザインの勉強用に集めた、好きなWebサイト100選です。

2018-05-01から1ヶ月間の記事一覧

No. 18 Nos Menus

ビールの雫が滴り落ちたり、湯気の動きがある。 ページをスクロールすると線がスライドで出てくる。 SNSアイコンにマウスを載せると回転する。

No. 17 THE PARFAIT STAND

商品説明のページに動画で食材の説明がしてあって美味しそう。 次のページへ動くアイコンを使って誘導している。 メニューにマウスを載せた時の動き、SNSアイコンの色使い。

No. 16 artless craft tea & coffee

トップページの写真がとてもゆっくりスライドしている 無機質な感じがいい 商品のページもシンプルだけど写真の背景がグラデーションになっていて洗練されている

No. 15 Event Studio

動きが豊富。 パステルカラーの色遣いで柔らかいイメージ。

No. 14 Nordicaphotography

トップページのムービーがよかった。 写真の連写を使って動いているように見える。 写真にマウスを当てるとゆっくり前に浮き出てくる動き。

No. 13 From_somewhere

シンプルな構図。 トップページの写真のアニメーションが印象的。 By Categoryのイラストが好み。

No. 12 Noen Hoshinowa

背景がエンボス紙になっていて、それに合わせてインクもかすれた感じになっている。 アニメーションが豊富。 切手風の見出し。

No. 11 Mamechishiki LOGOS

イラストが時間差で出てくる。 メニューにマウスを当てると写真が拡大して見える。 メニューの背景の丸が手書きのように不揃いになっている。

No. 10 Plants for thought KIDORI

ページ毎にメイン画像が左右に交互している。 ロゴがカッコいい。 常に写真が4枚並んでいて安定感がある。

No. 9 Halekulani

トップページをスクロールした時のコンテンツの動きが絶妙。 メニューバーのConnectを押すとボタンがスライドして出てくる。 四角いコンテンツをあえて少し重ねて見せている。

No. 8 Chocolu.net – Design & Front-end development

デザイナーの方のポートフォリオサイト。 ロゴや記事などのデザインの参考になる。 タイトルにマウスを当てた時の動き。

No.7 シャルキュトリーのお取り寄せ petit ACCUEIL(プティ アクイーユ)

ファーストページの動画で雰囲気が伝わってくる。 商品メニューが美しい。 複数の商品があるメニューはシンプルにお店のロゴが入っているお皿で代用している。

No. 6 Konnichiwa Japan Before visiting Japan, let's know a little essence of Japan.

画像が画面いっぱいに広がっていて迫力がある。 和紙など写真素材の質感が伝わってくる。 画面をスクロールしても背景は固定されたまま。

No. 5 100本のスプーン Family Restaurant

異なったデザインで2店鋪をよく紹介している。 メニューの見せ方が画面全体に広がっていてインパクトがある。 こども用へ言語切り替えがある。

No. 4 ANDY H-WEI Narrator Artist

シンプルで作品をよく魅せている Sketchesのページの写真の載せ方がいい。 縦のメニューバー。

No. 3 Be ahead of YOUR TIME. VIENNESE MODERNISM 2018

モノクロで洗練されたデザイン。 シンプルな線なのに表現の仕方がたくさんある。 ピアノの鍵盤をデザインに取り入れている。

No. 2 Ice cream parlour cosmetics 資生堂

パステルカラーの色使いと背景の古ボケた感じがいい。 文字がシースルーになっている。 動きが豊富。

No. 1 Do Wonders 株式会社 明治

絵のインパクトがすごい。 ペンで書いた繊細さが伝わってくる。 体系を一面に表してからページが進む作りがおもしろい。