Webデザインにおける『正直』とは
素材に正直であれ
Webサイトの品質には、高い技術と表現を盛り込むという『上を目指す品質』と、どのような状況でも必要最低限の見た目と操作性を保証する『地を固める品質』の 2 つがあると説明しました。しかし、これだけではなくデザインにおける普遍的な考え方も品質に大きく関わっています。
ドイツのインダストリアルデザイナー Dieter Rams（ディーター・ラムス） が提案する良いデザインの十ヶ条の中には、良いデザインは正直であるという項目があります。製品を必要以上に大げさに見せるのではなく、ありのままを伝えること。素材や形状を生かし、機能を明確に伝えることをラムス氏は『正直』と捉えています。
Web デザインに限ったことではありませんが、素材に正直であることは良いデザインには欠かせないことです。これは、素材をありのままに使ってシンプルでミニマリストな表現をするという意味ではなく、素材の特徴を最大限に活かして製品を作り出すことを指します。素材の特徴とは、表現を豊かにする源のようなものであると同時に、制約でもあります。一方、素材に正直ではないデザインは、何か別のものを模擬しているように見えますし、模擬している対象の劣化版に見えてしまいます。
Web サイトデザインの品質も、いかに『Web』という素材に正直になっているかで判断できるのではないでしょうか。
Webという素材の特徴
Web という素材は具体的にどういう特徴を持っているものなのでしょうか。様々な切り口で特徴を説明することができますが、デザインという観点から見ると以下の 3 つが特徴になります。
1. 確固たる枠組みがない
Web には決まった幅や高さは存在しません。見ている人の環境によって一度に観覧できる領域も大きく異なります。スマートフォンをはじめとしたモバイル機器が広がったことで、様々な横幅で見られるという考え方が一般的になったものの、ピクセル単位で細かく枠組みを作ったデザインは今もたくさんあります。グリッドシステムが作りやすいので 960px が最適だという考えも広がった時期もありましたが、制作者側で勝手につくった解釈に過ぎません。
2. 双方向のやりとり
HTTP リクエストでテキストや画像といった情報を取得し、Web ブラウザをはじめとしたビューワーで表示する。 言い方を変えるとすれば、受け手が「あれが見たい、こう見たい」という要望に、発信者側が最適なかたちで提示することを意味します。発信者側が意図する見た目で配信する、受け手はそれをそのままの形で観覧しなければならない紙やテレビとは大きく異なります。Web サイトを観覧する仕組みそのものが対話式であるからこそ、一方通行の表現に偏ることが難しいわけです。
3. 誰でもアクセスできる
W3C のデザイン原則 には、Web はすべての人がデバイスに関係なく、様々な情報へアクセスできるようするべきだと書かれています。HTML、SVG など様々な技術がありますが、それはすべて W3C の原則に基づいていますし、そうした技術で Web サイトを作るからこそ、誰でもアクセスできるものになるわけです。実際、様々な環境にも耐えられるサイトを作ることは簡単なことではありませんが、難しいからこそデザインの課題として取り組むべきものだと思います。
数年前に書いた基礎シリーズ「WD101」は素材へ正直になるためのヒントが書かれています。
こうした Web という素材の特徴を見直すと、90 年代から 00 年代までの固定幅で作られたデザインがいかに『正直ではないデザイン』というのが分かります（私もそれを実践していた人間のひとりではありますが）。すべての利用者が高速回線と大きなスクリーンを持っている環境を想定し、様々なサードパーティのプラグインをインストールしたブラウザで観覧していると勘違いして作っていたと思います。
素材を活かすためのツール
紙デザインへの感傷的な想いが、Web という素材を無視したデザインを作り出していた部分はあると思います。また、黎明期であれば現存のものを模擬して作ることはよくあります。例えば 1936 年に放送された最初のテレビ番組はラジオでやっていることに絵を付けただけの単純なものでした。模擬を続けることで、素材の真の活かし方を見つけ出す場合も少なくありません。2010 年代に入ってレスポンシブ Web デザインが実装されるようになったのも、素材に正直になるための辿り着いた手法だと思います。
ラジオのままでよかったのでは？と思えるようなテレビ番組（映像）
しかし、デザイナーが素材に正直になってデザインするのが難しいのはツールにも原因があります。米国の作家ジョン・M・カルキン氏は「We shape our tools and thereafter our tools shape us（私たちが道具をかたち作ると同時に、道具が私たちに影響をお及ぼしている）」という言葉を残しています。
Photoshop や Illustrator は、デザイナーが使い慣れた優れたツールであるものの、固定幅でデザインすることを大前提にしています。 Web デザイン以前からあるツールですし、どちらかと言えば紙や写真といった別の素材を扱うのを得意としています。つまり、素材に正直になってデザインしたくても、それを容易に実現してくれるツールがなかったわけです。道具によってデザイナーの能力が制限されていたといっても良いと思います。
同時に、デザイナーがツールに変化を及ぼしているのも事実。多彩なデザインツールの中には Web という素材を活かした『デジタルネイティブなデザインツール』が出ています。2016年登場した Fluid という Sketch 用のプラグインは可変でデザインを始めるには良いスタートですし、最近登場した Auto-Layout プラグインも可能性があります。他にも可変で Web サイトがデザインできるツールはたくさんあります。
こうしたツールを使うことによって、従来からあるツールより Web という素材に正直になってデザインが作りやすくなります。もちろん、素材に真正面から向き合うことは最初は難しいかもしれません。従来のツールにはなかった異なる制約を意識してデザインすることになりますが、それが Web という特有の素材をつかって作ることを学習するための最短距離かもしれません。
まとめ
デザインにおける『正直』とは、素材の長所と短所を理解した上で、『あるべき姿』を示すことだと思います。金属は金属の触感があるでしょうし、木材には木材の匂いや装いがあります。それは Web にも同様のことが言えて、Web には Web 特有の感触・感覚があります。それをあえて意識せず、別のモノのように見せるデザインの表現もあります。しかし、Web が頑張って紙の真似事をしても紙が劣化したようなものにしか見えませんし、結果的に Web そのものの特性も活かせていない中途半端な状態になります。
日々扱う Web という素材を、私たちはどれくらい理解しているでしょうか。理解をあまりしていないまま、他の媒体表現を模擬しているだけになっていないでしょうか。Web という素材を活かすことができたとき、他にはない品質を見出すことができるかもしれません。
Yasuhisa Hasegawa
Web やアプリのデザインを専門しているデザイナー。現在は組織でより良いデザインができるようプロセスや仕組の改善に力を入れています。ブログやポッドキャストなどのコンテンツ配信や講師業もしています。