404
365

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

2020年流行するであろうwebデザインのトレンド

Last updated at Posted at 2020-01-20

ここ最近はざっくり言ってしまえばフラットデザイン2.0、マテリアルデザインが主流になっていると思います。
視認性もよく操作もしやすいのが好まれる傾向になっています。
そんな中でこれからあるいは、今も流行っているものもありますが2020年で流行するwebデザインを紹介したいと思います。
正直webデザインの流行ってすぐに広まるものでもないと思うのですでに流行っているものも紹介しています。
なるべくサイトも載せていこうと思いますが、ページが更新されて違うデザインになっていたり、サイトがなくなってしまっていたらごめんなさい。

##・ダークモードに対応したデザイン
ios13からiphoneでもダークモードが搭載されました。
すでに対応しているサイトもありますがまだまだダークモードに対応していないサイトが多く見られます。
目に優しいから、かっこいいからなどの理由で利用している人は多いと思いますのでこれからもっと増えてくるでしょう。
ただカラーが変わるのでブランドイメージとかの兼ね合いもあるのでなかなか難しい部分ではありますが…
スクリーンショット 2020-01-20 7.15.19.png
https://www.webcreatorbox.com/tech/dark-mode

##・余白スペースを多く利用したデザイン
最近のwebサイトはフルスクリーンの画像を背景に設定しているページが多く存在しますが、
あえて画像をフルスクリーンサイズにせず、空いた余白をうまく利用することによってその画像や文字を引き立たせ、
伝えたいコンテンツをうまく伝えることができる作り方になっています。

スクリーンショット 2020-01-20 7.00.09.png https://www.crazy.co.jp/ スクリーンショット 2020-01-20 6.58.33.png https://www.rainbow.co.jp/

##・3Dアニメーションを利用したデザイン
アニメーションを利用したサイトが増えてきましたが、
さらにこれからは3Dイラストをアニメーションさせる時代になってくるのではないかと思います。
PCのスペックも昔と比べて格段に上がりwebサイトでも表現できるようになってきたと思います。
もちろんそれでもパフォーマンスの向上も必要にはなりますが…

スクリーンショット 2020-01-20 6.48.31.png https://w-wired.com/ww/pc/

##・イラストを多く使ったデザイン
イラストを使うことで硬いイメージの題材でも親しみのあるものにすることができるのと、とてもわかりやすく物事を伝えることができるのでデザインになります。

スクリーンショット 2020-01-20 6.50.32.png

##・スクロールに合わせてアニメーションが展開されるデザイン
google pixel4 や macbook pro のページが主なところかと思います。
次はどんなアニメーションが起こるんだろうとスクロールしたくなる感情を揺さぶられます。

スクリーンショット 2020-01-20 6.41.48.png https://www.apple.com/jp/macbook-pro-16/ スクリーンショット 2020-01-20 6.42.19.png https://store.google.com/jp/product/pixel_4





##共に働くWebエンジニアを募集しています!
不動産SHOPナカジツでは自社サービスを作っていく仲間を募集しています。
詳しくはWantedlyからお問い合わせください。

404
365
4

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
404
365

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?