世の中には、見やすい資料を書く人と、見づらい資料を書く人がいます。
それを分けるのは、生まれ持ったセンスの違いかと思っていました。
・「わかりやすいデザイン」には、わかりやすい法則がある
『伝わるデザインの基本』という本を読んで気付ました。
どうやら「わかりやすいデザイン」には法則があるようです。
伝わるデザインの基本 増補改訂版 よい資料を作るためのレイアウトのルール
作者: 高橋佑磨、片山なつ
出版社/メーカー: 技術評論社
発売日: 2016/08/05
1.わかりやすい「図形」デザインの原則
一番はっきりするのが、ExcelやPowerPointでよく作成する「図形」です。
これはExcelの「挿入」から引っ張り出した図形です。
なんか、ダサイです。
ちょっとシャレた感じにしようと、グラデーションを使ってみます。
グラデーションされた図を見て、「美しい」と思ったものです。
しかし、これでもデザインの原則を踏まえると、ダメなんです。
図の色は「塗りつぶし」と「枠」のどちらかだけです。
枠線をつけて、なおかつ色までつけてしまうと、図形が悪目立ちしてしまう。
デザインの原則に従って作図すると、次のようにとてもシンプルなものになります。
囲み、フローチャート、イラスト、グラフなどの場合でもこのルールは有効とされます。
「おとなしい配色をこころがけ、図が必要以上に目立つことのないデザイン」
そんな部分を意識して市販の雑誌などを見てみると、なるほど、たしかにどの雑誌もその原則が貫かれていると感じました。
2.わかりやすい「矢印」デザインの原則
資料作成時、矢印を使うことが多いです。
右と左、どちらが美しいでしょうか?
答え:右側です。
「柄の太さと矢じりの形を変形させない」
それが矢印を使う時のルールです。
図形の原則に従って、配色はできるだけ目立たないようにします。
矢印が必要以上に目立ってしまうと、資料の内容の理解を妨げる可能性があるからです。
「矢印を目立たせすぎない」という意味では、
こういう立体矢印もできるだけ使わない方がいいです。
以前はよく立体矢印を使っていましたが、ダメなんです。
グラフや図形のデザインの原則について、まとめてみます。
●デフォルトの図形は派手すぎるので修正する
●影と枠線、立体感、グラデーションを削除する
●吹き出しや矢印を歪めない
●派手な図形は使わない
派手な図形というのは、こういうものです。
避けましょう。
3.わかりやすい「フォント」デザインの原則
表計算ソフトを業務で使う人も多いと思います。基本はExcelです。
何も考えずに使うと、Excelのデフォルトフォントは「MSPゴシック」です。枠線も引いてあって、見づらい表になってしまいます。
表を書くときの基本原則は、
●余計な線をなくし、行間を広く取ること
●数値は右揃え、単語や文は左揃え
●横に長い場合は1行おきに薄い色をつける
●英数字は欧文フォント(Arial,Helvetica,Segoe UI)
●日本語は和文フォント(メイリオ、ヒラギノ角ゴ)
などです。
以前の僕が作っていた表。
これを、デザインの原則を適用して、それっぽくすると、こんな感じになります。
けっこう印象が変わります。
4.アンチエイリアス処理がされているクリアタイプフォントを使ってみる
ビジネスにおいて、最終的に何かを判断するのは人間です。だから見た目の印象というのは相当重要なわけです。
正しい数字、正しいデータであることは大前提ですが、その見せ方も大いに工夫する余地はあるのではないでしょうか。
フォントについても、より美しいフォントを選びましょう。Windowsでそのまま使うと、だいたいのフォントがMSゴシックになりますが、これは輪郭線がジャギーになります。
なので、メイリオや游(ゆう)ゴシック体を使うのがいいです。
メイリオや游ゴシック体はクリアタイプフォントと呼ばれます。文字の輪郭を滑らかにすることで、美しく表示されるようになっています。クリアタイプフォントではアンチエイリアス処理というのが行われています。アンチエイリアス処理とは、ジャギー少なくさせるために、色を滑らかに変化させる処理のことです。
実際にMSPゴシックとメイリオの違いを見てみると、こんな感じになります。
上がMSPゴシック。
下がメイリオ。
アルファベットや英数字を使うなら、CalibriやSegoe UI、Times New Romanなどがいいでしょう。アルファベットや数字が美しいフォントです。
5.その他、知っておくと絶対役立つデザインの基本原則
その他にもレイアウトの基本原則はたくさんあります。憶えておきましょう。今後役に立つことうけあいです。
●余白をとる
●揃える
●グループ化する
●強弱をつける
●繰り返す
文字で書いても伝わりにくいかもしれませんが、書籍では図と一緒に解説してくれているので解りやすいと思います。
「余白をとる」というのは、紙面の端から端までびっちりと文字で埋めてはいけないということです。
横と縦に、ちょっとゆとりを持たせましょう。
窮屈な資料は読む気がなくなります。
図と図の間、文字と文字位の間、資料の端っこから余白をとるようにします。
「揃えて配置する」。
図や文字は、統一感を持って配置することが大切です。
こんな風に、ガタガタにしないで、ちゃんと横を揃えましょう、ということです。
手元にExcelしかないのですが、PowerPointとかだとグリッド線を出してくれますね。
ああいうグリッド線を見逃さないようにしましょう。
「繰り返す」というのは、スライドそれぞれのデザインを統一するということです。
タイトルや色、文字のサイズ、フォントなど、全体で統一されたものを繰り返すことが大切です。
繰り返すことによって、安定感のある資料を作ることができます。
これらの原則は、デザインのバイブルと言われる『ノンデザイナーズ・デザインブック』という本でも詳しく説明されています。
ノンデザイナーズ・デザインブック [第4版]
作者: Robin Williams、小原司、米谷テツヤ、吉川典秀
出版社/メーカー: マイナビ出版
発売日: 2016/06/30
最後に。デザインは「中身を上手に見せる」ということ=思いやり
僕はこれまで、それほどデザインというのを意識することはありませんでした。
中身が正しければいいだろうと。
でも、改めてデザインの基本を学んでみて、間違っていましたね。
見た目より中身が重要なのはもちろんですが、「中身を上手に見せる」ということが必要だったのです。
「上手に見せる」ということは、見る側の負担を減らすということでもあります。
つまり、デザインとは「思いやり」。
見せ方を工夫すれば、読み手が資料の内容をより短い時間でより深く理解できるようになります。
どこかで「『働く』ということは、『傍で見ている人をラクにすること』なんだ」という話を聞いたことがあります。
資料を見る人がもっと楽になれるように、一手間かける思いやりがあってもいいかもしれません。
これからも、もっとデザインについて学んでみようと思います。
伝わるデザインの基本 増補改訂版 よい資料を作るためのレイアウトのルール
作者: 高橋佑磨、片山なつ
出版社/メーカー: 技術評論社
発売日: 2016/08/05
この本は本当にわかりやすかったのでオススメです。
本の著者の方のサイトも見つけました。
http://tsutawarudesign.web.fc2.com/kakkoyoku2.html