Webサイト制作の参考にしてみたい最近見たサイトまとめ

こんにちは、けーすけです。
毎日のようにギャラリーサイトを見てデザインやコーディングの勉強をしています。その中でも最近見て個人的に気になったものをまとめてみました。
それではいってみましょう!

アロマで空間をデザインするアットアロマ株式会社

アロマで空間をデザインするアットアロマ株式会社のWebサイトスクリーンショット

https://www.at-aroma.com/

アロマの効果を表現されているような、ゆったりさを感じました。全体の統一感といい、細かなアニメーションまで統一されておりとっても雰囲気のあるサイトですね。

レスポンシブでの表示もPC版と差がなく、スマホ1つでしっかりと情報がわかります。ページ遷移のアイデアがとても素晴らしいので今後参考にさせていただきます。

500色の色えんぴつ TOKYO SEEDS

500色の色えんぴつ TOKYO SEEDSのWebサイトスクリーンショット

http://www.500.gifts/

500色もの色えんぴつ1つ1つに名前があるようです!すごい。。。
こんなにもカラフルなのにまとまっているのが不思議でたまりません、一体なにがこの統一感をだしているのか、、、もっと細かくみたいと思います。

ローディングのアニメーションが面白いです、ちょっと長い気もしますがついつい見てしまいます。ところどころのアニメーションがすっごい気になりますが、それよりもフォントがとっても綺麗ですね、FuturaとNotoSansをローカルフォントで指定していました。結構読み込みが重くなると思うのですが軽量化だったりローディング画面などで綺麗に表示しているみたいです。私も見習ってもっとフォント周りについて勉強しなければ、、、、

Do! earth & green

Do! earth & greenのWebサイトスクリーンショット

http://hanagokoro-do.jp/

植物の持つチカラに少しでも多くの人が気づいて、
人と植物との距離がもっと近くなったらいいな、と考えています。

コンセプトが素晴らしすぎます!

植物のある生活が想像できてしまうようなデザインと、写真のクオリティが高い!
レスポンシブには対応していませんでした。。。

B.Y|バックヤード特化型メディア

B.Y|バックヤード特化型メディアのWebサイトスクリーンショット

https://crossbackyard.com/

バックヤードってなに?と一瞬思いましたが、Eコマースのバックヤードのことみたいです。飲食店で働いていた私的にはでっかい冷凍庫が一番最初にでてきました。

PCでのナビゲーションが面白いですね、初めて見ました。左右に分かれたレイアウトも今っぽくてクールなデザインですね。こんなデザインしてみたい。

スマートフォン表示では、バッサリと変わっていますね。勉強になります!
若い方向けのサイトな印象でした。

Tinker Watches

Tinker WatchesのWebサイトスクリーンショット

https://tinkerwatches.com/

余白が多めで、すっきりした色使いで清潔感がとても感じられます。
思わずこの時計を買ったらすごく、ミニマルでスマートな生活を送れそうな気がしてきます。

まとめ

いかがでしたでしょうか?今回は、1つのテーマではなく別々のポイントが気になったサイトをまとめてみました。
当たり前のように見ているWebサイトでも、本当に色々なものがありますね。すっごく勉強になります!!
私もいつかギャラリーサイトに載るようなサイトを作りたいものです。。。とかいいながら未だに記事下のリンクを修正してないです。笑

さてまた次回の記事でお会いしましょう。けーすけでした。