こんにちは！
今年から花粉症デビューしたかもしれないツボです。
まだ信じたくないので、事実から目をそらしています。
早速ですが皆さんはWEBデザインにも流行があることをご存知でしょうか。
今回は３種類のWEBデザインと、現在の傾向についてご紹介します。
【フラットデザイン】
最近よく目にするのがこのようなぺったりとしたデザイン。
こちらは「フラットデザイン」と呼ばれ、近年主流になっています。
特徴としては下記のような感じです。
・質感や立体感がほとんどない
・エフェクトは最小限
・文字も最小限
・目的や商品が一目でわかる
・部品の機能が一目で分かる
・各要素がくっきりしている
・グラデーションを使わない
・シンプルなタイポグラフィ
・シンプルなグリッドレイアウト
出典
絶対おさえておきたいフラットデザインのまとめ | 株式会社LIG
http://liginc.co.jp/web/matome-web/19271
個人的には今っぽくて大好きなデザインなのですが、手を出そうとするたび「初心者が使いこなすのはなかなか難しい」と学校の先生に言われたのを思い出して一瞬躊躇してしまいます。笑
具体的に例を出すと、できるだけ余分なデザインをそぎ落としスッキリと仕上げないとならないため、失敗するとどこがクリックできるのかが分かりにくくなってしまうという事態になりかねません。
おしゃれも足し算より引き算が難しいのと同じですね。
まだまだツボも技術が足りないので、ちょっとずつ挑戦していこうと思います。
【マテリアルデザイン】
続いて「マテリアルデザイン」です。
さっきとなにが変わったの？という読者の方はボタンの下の方をよく見てみてください。
ほんのりと影がついているのが見えますでしょうか。
マテリアルデザインは直訳すると「物質的なデザイン」です。
特徴は下記のようなものがあげられます。
・シャドウなどを用いることで、オブジェクトに面を持たせることで、奥行きなど伝えやすく、それが触れる（タップ/クリック）ことができるものだとユーザーに直感的に認識できるようにする。
・光、面、奥行き、動きを利用することで、各オブジェクトがどのように作用しあうかをユーザーに直感的に伝えやすい。
・リアルなライティングにより、オブジェクトを本物らしさを高める
・遷移と現在いる場所を意識させるアニメーション
・質感をなくし、統一感のある配色を用いる
・余白を意識する重要性
出展
アプリ・Webデザインにマテリアルデザインを意識して用いる手法 | Swwwim
http://swwwim.net/technique-for-material-design/
このように、マテリアルデザインにはユーザーが直感的に操作しやすいような工夫が盛り込まれています。
こちらもフラットデザインと同様、近年多く採用されているデザイン手法です。
【リッチデザイン】
このような立体的なデザインもまだよく目にするかもしれないですね。
こちらは「リッチデザイン」と呼ばれ、ちょっと前まで主流だったデザイン手法です。
特徴は下記のようなものが挙げられます。
・シャドウやテクスチャを使用しディティールにこだわった奥行きが感じられるデザイン
・立体的なデザインのためボタンなどの認識に有利
・直感的な操作が可能
・高級感を演出できる
・制作にはスキルと時間が必要
数年前はこのテクニックを使用してたくさんのホームページが作られていたので、今この手法をモリモリにしてデザインすると下手をすると「なんか古臭い。。」と思われてしまう恐れのあるデザインです。
授業の中でも、「ベベルとエンボス」「シャドウ」の効果の使い方には、先生にも「くれぐれもさりげなく！」と厳重に注意されてきました。
時代とともに流行は移り変わる
フラットデザインやマテリアルデザインの手法は、今や生活に欠かせないスマホのアイコンやアプリの中のデザインに多く見られるので、身近に感じて頂けたのではないでしょうか。
WEBデザインの流行を調べていて感じたのは、ファッションのトレンドにも通ずるものがありますが、私たちのライフスタイルの変化が大きく関連しているのだなということです。
今後はさらにどんなデザインが生まれていくのでしょうか。
想像するだけで楽しみですね！
ではまた。
by ツボ