ビジュアルデザインと機能性

ビジュアルデザインと機能性。ウェブサイトやアプリケーションのデザインでは，この２つは密接な関わりを持っています。

多くの人は，ビジュアルデザインと聞いて，ものを美しく（もしくは格好良く，楽しく）見せるためのデザインを連想するかもしれません。まさにそれはデザイナーの仕事です。世の中をより美しく，格好よく，楽しくすることは，人が関わるものを生み出すデザイナーにとっての使命です。それをないがしろにすれば，何のためのデザインか，何のためのデザイナーか，と問われることになるでしょう。

ただし，道具の世界では，デザインが機能性に直結しています。人は道具を使うとき，はっきりした目標を持って扱います（はさみを使って紙を切る，蛇口をひねって水を出す等⁠）⁠。そういった目標をどれだけ達成できたか，ストレスなく達成できたかという観点＝機能性は，道具の価値に関わってきます。ウェブサイトもアプリケーションも，人が情報を扱うための道具ですから，デザインが機能性を左右するのです。特に，私たちは画面を通してウェブサイトやアプリケーションに接しているので，ビジュアルデザインは非常に大切です。

この連載では，実際のウェブサイトを通して，ウェブサイトやアプリケーションのデザイン（ユーザインタフェースデザイン）について考えてみたいと思います。前半は，先ほど述べたようなビジュアルデザインについての話題です。どのようなデザイン手法が，サイトにどう影響しているのかを紐解いていきます。個別の事例をピンポイントで扱っていきますが，実際のデザインパターンとして，できるだけ応用が利くような紹介の仕方を心掛けたいと思います。

安定とスピードのデザイン

多くの人が毎日訪れ日々情報が移り変わるようなウェブサイトでは，何よりもまず，素早く，かつ，間違いなく，情報を捉え操作できる，ということが求められます。そのためには，場所や時間，文化などの環境の違いによって使いやすさが変わってはいけません。サイト内のどの場所にいても，どんな操作をしていても，同じ操作性を保つ必要があります。私はこれを「スピードと安定のデザイン」などと勝手に名付けていますが，そのような要求に対して，ビジュアルデザインがどのような効果を持っているか，実例を見てみましょう。

1. 全てのユーザに素早い操作性を提供する del.icio.us

del.icio.usはソーシャルブックマークと呼ばれる種類のサービスで，他のサイトへのリンクを貯めて全世界の人と共有することができます。

ユーザは，これらのリンクに短い注釈をつけたり，分類名をつけて整理したりと様々なことができます。けれども，このインタフェースにおけるユーザの目的は，大きくは２つしかありません。

• リンクを追加すること
• 貯めたリストからリンクを探し出すこと

この2つです。最初の「リンクを追加する」という行動は，何か他のサイトを見ている途中で行われるものですから，煩雑な作業によってサイトの閲覧を妨げてしまってはいけません。ユーザの行動がシンプルであり，かつ，そこにスピードが求められるわけです。

del.icio.usはこの点でよくデザインされています。画像は極力抑えられ，色の要素はリンクの単色の青だけに絞られています（ユーザの画面ではこの他に，リンクの人気度が赤の濃淡で示されます⁠）⁠。一見しただけで，どこをクリック可能なのか判別できます。そして，グレーの濃淡と配置，テキストのサイズによって，リンクリストと管理メニューを配置し，情報を整理しています。このデザインは，ブラウザの初期設定をそのまま使っているため，ブラウザやOSの環境にも依存しませんし，文化圏によって異なった印象を与えることもありません。全てのユーザが，使い方を同じように予想することができ，異なった状況でもスムースに扱うことができるのです。