Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
386
Help us understand the problem. What is going on with this article?
@sugar_tk

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

More than 1 year has passed since last update.

ここ最近はざっくり言ってしまえばフラットデザイン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からお問い合わせください。

386
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
sugar_tk
今まではDTPや動画編集、WEBデザイン、フロント側のコーディングなどやってきていましたが、今はもっぱらUI/UXに関してや、フロントエンドの領域で頑張っています。
nakajitsu
普通じゃない革新と挑戦を続ける会社ナカジツ。不動産業界の既存モデルにとらわれず、本当にお客様に喜ばれるサービスを目指す会社です。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
386
Help us understand the problem. What is going on with this article?