初心者Webデザイナーが「素人から脱却」する為の"3"つの意識改善

先輩デザイナーに「やっちゃってるな」と思われない為の「3つの意識改善」をあげさせていただきます。主にWebアプリ・サイトでの意識改善の為の3つの提言です。

使い過ぎない

・色を使い過ぎない
・フォントの種類を使い過ぎない
・フォントのサイズを使い過ぎない

初心者にありがちなのは、「統一感」に欠けるということです。その原因となっているのは、基本的な「デザインの四原則（近接・整列・反復・対比）」が守られていない事が多くのケースで考えられます。そこに加えて上記で上げた「色の使い過ぎ」「フォントの種類・サイズの使い過ぎ」が散見されます。

例えば、テーマカラーやアクセントカラー以外にも複数色をデザインに取り入れてしまう。もちろん、グノシーやスマートニュースのような複数色をテーマにしているWebサービスは存在していますが、それ以外のほとんどの場合では、色の使い過ぎはユーザーの注意の妨げになり兼ねません。

また、フォントについても同じように種類・サイズともに使い過ぎは避けましょう。フォントの種類も最高でも2種類、サイズはジャンプ率を考慮しながら例えば1px違いのフォントは使わないなどあらかじめルールを決めると良いかもしれません。

[ 練習 ]
1. 色
まずは、白と黒だけのモノトーンでデザインを作成してみましょう。その後、テーマカラーとアクセントカラーを取り入れて全体のバランスと強弱を確認していきます。
2. フォント
まずは1種類のフォントのみを使用し、フォントのサイズはあらかじめ何種類必要か決めた上で使いすぎないように注意していきましょう。デザインカンプとは別に「デザインガイドライン」を同時に作成していくと良いでしょう（特に運用が絡む案件や大規模サイト・アプリは必須）。

Webデザインのスタイルガイドの作り方

やり過ぎない

・文字装飾をやり過ぎない
・ボタン装飾をやり過ぎない

特にWebスクールや専門学校を出て間もないデザイナーにありがちなのは「やり過ぎる」事です。PhotoshopやIllustratorなで覚えた装飾技術などをありったけ使いたがる現象が起こります。これは誰しも経験があるかと思います。それだけ、「いいものが作りたい」「いいデザインを完成させたい」という思いが強い結果なのです。

そんな時は、力を抜いてみましょう。「強弱をつける」というテーマのもと、目立たせなくてもいい部分にはできる限り時間をかけずに、装飾を行わないまたはわずかな装飾にとどめる事が肝心です。

私も過去のデザインを振り返ると、全部100％で作ろうとしていた痕跡を確認できます。全くそんな必要はなかったと気づく場合があります。
一番重要なのは、「ユーザーに対して何を伝えたいのか」「ユーザーに何をしてほしいのか」を第一優先に考え、UIに落とし込む事なのです。

詰め込み過ぎない

・情報を詰め込み過ぎない
・要素を詰め込み過ぎない

これは、新人のWebディレクターに言える事かもしれません。情報量や要素が多い事は決して悪い事ではありません。ニュースサイトやメディアサイトでは、記事を沢山見せる事や選択肢を多く持たせる事が良い場合もあります。

まず最初のアプローチとして、以下の3点に注意してみましょう。

①ユーザーが迷子にならないか？
②何が言いたいのかわかるか？
③ゴールにたどり着けるか？（見つけられるか？）

この3点に注意すると、デバイスの1画面単位に入れる情報・要素の詰め込み過ぎは自然と改善していくと思います。

最後までお読みいただきありがとうございます。

なるほどデザイン