こんにちは、田舎もん坊主です。
皆さんもネットサーフィンでいろんなWebサイトを訪れることがあると思いますが、その際に居心地の良いサイトと居心地の悪いサイトはありませんか。
また、スマホのアプリでも何となく使いやすいアプリと使いにくいアプリがあると思います。
その理由はもしかするとそのWebサイトやアプリのデザインの影響かも知れません。
デザインが人の感情や利便性を左右すると言われてもピンとこないかも知れませんが、デザインには「デザイン人間工学」と言われる研究分野があり、デザインが人間に与える影響を研究し、その効果をデザインに反映させようとする考え方があります。
あなたが心地いいと感じたり、使いやすいと感じるのは他でもないこの「デザイン人間工学」のお陰なのです。
今回はそんなデザインが人に与える影響や、最近主流のマテリアルデザインの魅力や効果について書いてみたいと思います。
- デザインに興味がある方
- 主流のデザインを取り入れたい方
- ブログのデザインを見直したい方
「人はものごとを自分で決めていると思っていながら、実は周りの情報（見せ方）に強く影響を受けている」とダン・アリエリーという行動経済学で有名な方が言っています。
つまり好んで見ているサイトや好んで使っているアプリなどは、もちろん情報の質もありますが、デザイン（見せ方）の影響を受けて、そこに導かれているというわけです。
- なんだか心地いいなあ
- 見ていて疲れないなあ
- とても使いやすいなあ
といった感情は少なからず人に影響を与えます。
これらの感情が直接ストレス軽減に繋がるかどうかはさておき、「良質なデザインはストレスがかからない状況を生み出す」とは言えるではないでしょうか。
では何故良質なデザインが人をこのような感情にさせるのでしょうか。
そもそも心地よいデザインとは何なのでしょうか。
ひとそれぞれ感じ方は違うと思いますが、一般的に心地よいデザインとは下記のようなデザインを指すことが多いと言えます。
まず一つ目のポイントは「違和感を感じさせない」ということです。
例えばメニューの名前やボタンの配置がとてもわかりやすく、アイキャッチなどの視覚的要素を取り入れながら使う人に違和感を感じさせないことが大事です。
例えば道路標識や歩行者信号などが良い例ですが、わかりやすいアイキャッチを使って誰もがその意味を直感で認識できるように工夫されています。
特に道路標識や歩行者信号などは一歩間違えば大きな危険に繋がりますので、その重要性はとても高いと言えます。
他にも皆さんがよく使うSNSのアイコンもそうだと思います。
馴染みのあるアイキャッチがすぐに何のSNSかわかるようにデザインされています。
Webサイトを見たりアプリを使っていて、見るページ毎にデザインが変わってしまうととても違和感を感じ、戸惑うことがあります。
統一性がないと人は疲れてしまうのです。
一貫したコンセプトを持ったデザインで統一されたサイトやアプリはやはり心地良くなるのです。
色にはその色ごとにイメージがあることはご存知だと思います。
赤は情熱的、青は冷静、緑は穏やかなど、人は色によって様々なイメージを抱きます。
上記のような単色で単純なイメージもありますが、より複雑で様々な色味を使うことで、全く違ったイメージを与えることもできます。
例えば道路標識などで危険を知らせる時は、赤や黄色を使ったりしますが、やさしいイメージを与えたい場合は水色やベージュなどの淡い色を使うのが良いと思います。
もうひとつはコントラストです。
コントラストとは対比のことを指しますが、類似色や対比色など異なった色を上手に組み合わせて対比させることで、意図したイメージを伝えることができます。
このように、心地よい良いデザインにはちゃんとした理由や定義があるのです。
このように奥の深いデザインですが、そんな中で今注目されているのがマテリアルデザインです。
マテリアルデザインとは、2014年6月にGoogleが提唱した新しいデザインの概念で、「マテリアル=物質的な」デザイン、つまり「物理的な法則に則ったデザイン」のことを指します。
物理的な法則に則ったデザインとは、現実世界のルールである光や影、奥行き、重なりをフラットなデザインに取り入れることで、現実世界の物が持つ「質量」を表現します。
2013年には、Windows 8 や iOS 7がフラットなデザインを採用したことが有名ですが、この頃からWebデザインのトレンドは、リッチデザインからフラットデザインへと移行していきました。
マテリアルデザインは、このリッチデザインとフラットデザインの良いとこどりのようなデザインと言えるかも知れません。
具体的には、下記のようなイメージのデザインになります。
マテリアルデザインの特徴（要素）は、
- 影
- アニメーション
- 厚み
- ボタン
と言われており、まさに上記のイメージはそれらを体現していると思います。
マテリアルデザインは3Dのような立体的表現を用いて、直感的な操作性とユーザーの利便性を向上させると言われています。
Googleで公開されているマテリアルデザインのガイドラインに沿って作成していくとそれぞれの要素を比較的簡単に取り入れることができると思います。
マテリアルデザインは、Webサイトはもちろん、アプリの開発などにも活用することができます。
Googleのマテリアルデザインのコンセプトは下記のYoutube動画をご覧ください。
なお、Googleではマテリアルデザインのフォントや素材なども提供されているため、これらを活用してみるのもおすすめです。
なお、Google以外にもマテリアルデザインを採用している会社はたくさんあります。
かの有名なアップルも、フラットデザインを進化させた独自のマテリアルデザインをmac os big surで採用しています。
とても洗練されたデザインのOSに仕上がっていると思います。
もちろんmacOS以外でもAndroidをはじめ、iOSやWindowsも呼び名こそ違えどマテリアルデザインを採用しています。
まさに世界中で主流のデザインと言えるでしょう。
何を隠そう、このブログサイトもマテリアルデザインを採用しています。
SANGOというブログテーマを利用していますが、マテリアルデザインを基本としています。
利用してまだ日が浅いので、その魅力を活かしきれていないのが実情ですが、とても配色を含めとても見やすいのが特徴です。
SANGOはカスタマイズもとても簡単で、初心者ブロガーの方でも手軽に美しく心地よいサイトが作れるのが特徴です。
SEO効果も高く、このマテリアルデザインがブログの滞在時間を長くし、さらにSEOを後押ししてくれるかも知れません。
ブログ初心者にSANGOをおすすめする理由については、下記の記事でまとめていますのであわせてご覧ください。
ブログテーマで迷ったら是非SANGOも選択肢に入れることをおすすめします。
今回は、デザインが人に与える影響とマテリアルデザインの魅力について見てきました。
たかがデザインかも知れませんが、デザインは人の心を豊かにし、利便性を高める効果があります。
何気なく観ているサイトや普段使っているアプリもこのような観点でみてみるのも面白いかと思います。
最後までご覧いただきありがとうございました。
