色使いと人間工学

2008.05.29

その他

レイアウトがカラフルなシステムを見かけたりします。
見やすさを考えてそうなったんでしょうか?それとも使い手が好きな色を指定して忠実に作ったのでしょうか?

開発者個人の好みの問題もあるとは思いますが、システムは使用者の立場になって”本気”で考え、生産性を向上させることが第一だと思います。

そこで、ちょっとしたノウハウを公開してみたいと思います。
服の着合わせ同様、どのパターンを取り入れてバランスよく着こなすかはあなた次第です。

■1 ヘッダに色を

パソコンの画面は意外といろんな人から見られることが多いです。いい意味でも悪い意味でも。
例えば、ヘッダが緑の画面が出ている人は予約伝票入力用の画面だな?とか、ヘッダが赤だったら、経理系の重要な仕事をしているのかも。など。
画面の色の雰囲気で利用者の仕事が判れば、遠くからでもあの人は関係ない仕事をしてるのでは?とか、セキュリティ的にも効果を発揮するかもしれません。

■2 ボタンをデザインとして配置しない

立体的なボタンが作りやすいFileMakerですが、これを見出し毎やデザイン飾りとして使われた日には最悪です。ただでさえマニュアルを読まない利用者にあちこちクリックしまくってしまわれたり、逆に大人しい利用者には無駄な機能が多すぎと感じうざったく感じることでしょう。ボタンは押せるところにだけしか配置しないのが配慮というものです。

■3 キャプションとフィールド文字色の濃さに差をつける

目立たなくてはいけないのは、フィールドの中に入力されたデータです。なので、周りのキャプションを少しだけ色をフィールド文字色より同系色でやや薄く(明るく)してあげると、フィールド内のデータが際立って周りより見やすくなります。

■4 一覧表示での行の背景色1

ポータルでは簡単に交互に配色設定することが出来ますが、リスト表示でもバージョン9をお使いの方であれば簡単に設定できます。
条件付き書式の計算式で

Mod ( Get レコード番号 ) ; 2 ) = 0

を設定したボタンをつくり、行全体を囲むように配置し塗りつぶしも枠線も無色にするとポータルのようにきれいに交互に配色できます。

■5 一覧表示での行の背景色2

■4とは意味合いが違い、そのレコードの重要度ごとに背景色を設定するのも有効です。
例えば、そのレコードが無効(VOID)であれば背景色を濃いグレー表示にするとか、作業途中の場合はオレンジにするとか。

まとめ

上手な色使い方の法則は、極力色を使わないことです!
それぞれを強調したくて色を設定したくなる気持ちはわかりますが、その気持ちをグッと抑えて本当にその値がシステムにとって特別であるものだけに、統一した色を指定することで意味のある生産性の高い色使いシステムになるのです。