非デザイナーのためのデザイン本 ノンデザイナーズ・デザインブック

上手にデザインするための４つの基本原則

本書では、気にすべきデザインの基本原則として、４つのポイントが示されている。 この４点の原則(コントラスト、反復、整列、近接)の説明を、具体例を挙げなが進めていくというのが全体の構成です。

Webに限定したデザインの本ではなく、どちらかというとデザイン一般についての本ですね。 説明に使われている例も、Webサイトの例はほとんどなく、ペーパー・印刷物の具体例がほとんど。 デザインのちゃんとした基礎を勉強したことがない人には、これ以上ないぐらいに役に立つ本と思われるのですが、 逆にWeb関係のデザインとか、ユーザビリティの勉強には期待できない本です。

Webサイトの運営に慣れてくると、いつのまにかやっていたり、こうした方がいいのかなという事がなんとなくわかってくるのですが、 そういった点がなんとなくではなく言葉できっちり表現されています。

レイアウト、デザインの説明としては、まったく問題がないものの、具体例の大半が英語の印刷物についてです。 また、フォントまわりの話も、英語についてのものなので、その点は注意が必要か (一応、Appendixに和文フォントについての説明もありますが)。

以下、４つのポイントについての簡単な説明。

近接 Proximity

関連する項目を組織的にまとめてデザインする。 論理的に流れを追うことができるようになっているのかを確認する。

これは、Webサイトでは、ユーザビリティとかと関係してくる。 適切な項目をラベル付けしてまとめるのは、とても大切。

整列 Alignment

ページ内の要素を、意識的にそろえて配置する。 みえない線に沿って要素を揃えると、確かに落ち着いて見えてくる。

昔の？Webサイトでたまに見かけた「やたらと中央配置」が整列の悪い方の例か。 ボーダーとか、文章の出だしも本当はピクセル単位で気を付けないといけないものみたいだ。

整列をきちんとしておけば、崩すこともできると言う話は、なるほどと思った。 デザインは崩れているんじゃダメなんだ、崩すんだ…。

反復 Repetition

配置や、ロゴの気持ちのいい繰り返し。

ロゴや、グローバルナビゲーションが決まった所にいつもあるWebサイトは、安心できる。 似た項目の繰り返しがうまくあると、ページの構成が掴み易いし、斜め読みもしやすい。

コントラスト Contrast

色、書体、サイズ、太さ、グラフィックなどで、ページに動きを与える。

コントラストを付ける所は、勇気を持って大胆に変える！ はっきり違うようにしないと、紛らわしい。

僕は結局、非デザイナー

以上、いろいろ書いてきたのですが、結局のところ僕はデザインが、どうにもうまくない。(このサイトで、すぐばれる…)

改善点はすぐ見つかる。例えば、右のサイドメニューは何か工夫が欲しい(し、配置、ラベリングも検討の余地あり)。ああ、でも実際どうしたらいいのか？

コメント欄(の上の方)も、がたがたとずれていて、まぁ、気になると言えば気になる。 この部分は恐らくラベルを右揃え、フォームを左揃えにして、一つ線を通すのがセオリーか。 しかし、これも面倒だ…。

ロゴも原色むき出しで、配色もなんというか色気がない。 絵心があれば、ちょっとしたボタンだって、きっと自作できるのにな。

というか、一番の問題はサイトそのものがいったいどうなんだ？という事だ…。