東京都府中市、九段下のWEB制作会社Maromaroのブログです

2020.06.22

chie

ビギナー向け!そのデザインちょっとまった!

こんにちは。MaromaroのChieです。
今回はノンデザイナーさんや、初心者デザイナーさんに起こりがちな、デザイン手法のNGパターンをまとめてみました。

デザインにはざっくり二つに分けると感覚的デザイン理論的デザインがあるかと思います。
感覚的デザインとは、目にするデザインをどう感じたか?とユーザー目線で感覚的に感じたものが感覚デザイン。
理論的デザインとは、デザインの基礎を基になぜその配置にしたのか?どうしてその色彩なのかを言語化、説明できるものが理論的デザイン。
と私は考えています。

とはいえ、感覚や理論は学んでいく内に身に付くものだとは思いますので、デザインを始めたばかりの場合は、どちらもまだ未完成の状態からのスタートになることが多いかと思います。
割と効果に頼り難ちなだったりもしますので、まずは陥りがちなNGパターンに気づくだけでもグッとデザインの質は上がるかもしれないですね!

色がキツイ

多くの初心者さんにありがちなのが、デフォルト色を使用したり、蛍光色を使用したデザイン。
デフォルト色を使用すると、どしてもエクセルっぽくなってしまい、デザイン感が損なわれがち。

NG

カラーを使用するときは、デザインに対してハレーションが起きていないかを気をつけて、デフォルト色から少し色を調整したカラーを使用するようにしてみましょう。

ドロップシャドウがキツイ

こちらもよくありがちなドロップシャドウ強すぎる問題。

NG

それこそ15年くらい前であれば、ドロップシャドウが強めな時代もありました。
今も使い方によっては、かっこいいデザインになるのですが使い所を間違えるとかなりオールドスタイルなイメージになりがち。

ドロップシャドウをつけるときは、本当にそのドロップシャドウが必要かどうかを考え、つける際は控えめくらいがイマドキっぽいですよ。

縁つけちゃえ問題

文字を目立たせたいからなのか、縁付けちゃいがちですが、付け方によってはやはりオールドタイプ感が出てしまいがち。

NG

デザインによっては、縁がアクセントになってよい場合もありますが、縁の扱いは要注意!

囲み過ぎ/余白がない

要素を分けたい場合や、目立たせたいなどにありがちなのが囲みすぎ問題。
囲みすぎると何か重要なのかもわかりづらくにり、かつ目線がばらけるため、囲みでない要素を使うことも意識しましょう。
また囲みすぎ問題にも付随するのですが、囲った際に余白が無いと窮屈で余裕がなくデザインとしてはNG。
余白を設けることで、要素と要素を見やすくしたりもできるので、ついちゃった余白ではなく、デザインされた余白を心がけましょう。

NG

囲みの変わりにラインを使用してみたり、背景色を薄く敷いたりすると囲みが減って見やすくなります。

装飾が多すぎる

なんだか寂しい?と思うと装飾を増やしがちだったりしますが、その装飾本当に必要?
装飾が増えれば増えるほど、見せたい要素への集中は減ります。

NG

装飾を増やす場合は、装飾の意味をよく考えながら配置しましょう!
ただ寂しいからと意味の無い装飾を増やすのだけはやめましょう。

NG

要素がバラバラ
見出し、小見出し、リード、画像・・・塊で見せる要素がバラバラしちゃってることがありませんか?

NG

なんだかごちゃごちゃしてる?と思ったら、まずは要素をまとめてみましょう。

要素をまとめるには理論的デザインの基礎グルーピング、整列、コントラスト、反復を意識すると良いですよ!

まとめ

6つのNG集いかがでしたか?
なんだかデザインがパッとしない、なんだかダサい?と思ったとき、上記の点を見直してみてくださいね。