投稿日:

(書籍抜粋) 醜いデザイン言語 〜 UI論 〜




昨年秋から書き続けてきた電子書籍の文章をようやく一通り書き上げ、最終仕上げの段階に入りました。
そこで予告・試読といたしまして、一足早く一部分だけ抜粋してブログにアップしておきます。

当書籍は3冊分という膨大な量であるため、ここで抜粋するのはほんの一部にすぎません。また、ここで取り上げた内容はUIに関するものですが、書籍全体ではテクノロジー、デザイン以外の要素もふんだんに取り入れています。

内容についてはリリース時に告知する予定ですが、書籍のタイトルがタイトルのため、できる限り早めにリリースしなくてはと自分の尻を叩いているところです。
抜粋すると言っても書籍のほうは今後内容が変わるかもしれませんし、記事版もブログ用に加筆修正しておりますので、その点ご了承ください。


ここで抜粋している部分は書籍の中巻より、項タイトルは『醜いデザイン言語 ー Bad UI』で、主にメーカーなど、作り手の方々をターゲット読者としています。


ーーーーー


タイトルにある「デザイン言語」という言葉はあまり見慣れないかもしれませんが、その製品やサービス内で統一された「デザインの傾向性、独自性、フィーリング」を指します。

例えばグーグルの"紙の質感"を意識した「マテリアルデザイン」や、アップルの"磨りガラス"を意識したiOS7以降のフラットデザインなどが分かりやすいと思います。
どちらも平面世界の中において、奥行きあるレイヤー構造を表現したものです。


書籍のその項からはBad UIに始まり、日本特有のデザイン言語について実例を出しながら示していきます。

上巻では、かつての日本人が得意としていた「物語性」や「全体像」について説明しているわけですが、一部の人たちには「コンテキスト」という言葉のほうがしっくり来るかもしれません。

コンピュータ科学者であるアラン・ケイは、『コンテキストはほとんどが目に見えないものである』と述べていますが、UI設計においてもこの「コンテキスト(文脈・関連性)」を捉える感性がどうしても必要となってきます。


そのアラン・ケイにUI設計の本質を言わせるとこうなります。

鍵は前後関係(コンテキスト)にあることはいうまでもない。ユーザーの幻像は演劇であり、究極の鏡である。観客(ユーザー)は知性をもち、なんらかのコンテキストに導くことができる。
観客に適切な合図を出すことが、ユーザーインターフェイス設計のエッセンスといえる。



「ユーザーの幻像(イリュージョン)」とはGUIのことであり、このときケイはコンピュータのGUIに言及しているのですが、ハードウェアUIにおいても十分通用する捉え方だと思います。
なぜならUIデザインの根幹部分は、ハードウェアかソフトウェアかといった表面要素に左右されないところにあるからです。

ところで僕は「UX(ユーザー・エクスペリエンス)」の代わりに「体験性」という言葉を用いますが、「UI(ユーザー・インターフェイス)」についてはそのまま使っています。

UIという概念は単に「操作パーツ」「操作面」だけを指しているのではなく、体験性と同じように空気のようなもので、ボタンやレバーといった物理的に独立した(手で触れる)操作パーツばかりがUIとは限らず、一言で置き換えられる日本語が見当たらないのです。
書き手としては意味のわかりづらいアルファベット二文字を頻繁に使いたくはないのですが、読者にはぜひこれらの複合的なニュアンスをなんとなく意識していただければと思います。

ちなみに"UIデザイン"という言葉だと、「操作性」「認知性」「誘導性」「画面配分率」「リズム感」といった意味も内包するため、それなりに高度な専門領域となってきます。
ひょっとすると、UIデザイナーでさえもここまで考えていないかもしれません。

例えば、iOS7からヒューマン・インターフェイスのチーフにもなったジョナサン・アイブは(正確にはハードウェアデザインチームへ統合された)、
工業デザイナーらしくGUIの見た目(素材的質感、形状)やモーションアニメーション(物体に働く慣性、透過)の表現においては強いこだわりを示しますが、デジタル空間を的確に導いていく際に必要な「誘導性」「画面配分率」「リズム感」などについては特段ノウハウがあるわけではないようです。



さて、ケイはさらに『コンテキストはIQ80の価値がある』と言っています。
物事の前後関係を捉えることには、それだけ大きな意義があるということです。

しかし、(上巻でご説明していることですが)現代日本人は本来お家芸であるはずのこの目に見えないコンテキスト(文脈、関連性、物語性)を捉える能力、感性を喪失してしまっています。
それに加えて"デザイン"に対する理解・認識も低ければ、尊重もあまりできません(これも他の項で説明しています)。


それゆえに家電から公共機器、カーナビ、ウェブサービス、アプリ、レジスター、シャワートイレにいたるまで、国内産のユーザーインターフェイスは使いづらい「醜いデザイン言語」で意図せず統一されてしまっているのが現状です。

さらに文字がやたら並べられるその様、そして膨大な説明文を抱えた取扱説明書を押し付ける様は、ユーザー(観客)がまるで知性や生物的本能を持っておらず、一つひとつ説明してあげないと分からないとでも言うかのようなアプローチです。


例えば、ヤフオクを出品で数百回は使ったことがありますが、どんなに使い慣れても使いづらいのです。そのUIデザインには繰り返し使うことに対する配慮があまり感じられません。

シャープのiOS用コンビニプリントアプリ、「PrintSmash」も使っていますが、毎回繰り返す単純な作業においてもくどい説明を正面に見せつけられ、操作パーツは視認性が悪く、「送信完了」の通知ポップでさえいちいちOKボタンを押さないといけない煩わしい仕様となっています。


一方、スーパーのレジスターの画面やキーボードをのぞいてみれば、どうしてそんなにカラフルにするのかと思うほどボタン類が多様な色で染められています。そんなに色付けをしたら、どれが重要なのかわからなくなるのではないでしょうか。
しかも、原色ばかりが目立つ配色のセンスには「子どもの色ぬりレベル」と言いたくなります。


ある職場であった出来事です。
そこにはどこのオフィスでも見られる業務用プリンタ(東芝製デジタル複合機e-STUDIO 2050C)が設置されており、そこの職場の従業員ではない私はそのプリンタをお借りする立場でした。そしてある時、その職場の社員の方から「電話番号でFAX送信する方法がわからない」と訊かれたのです。

その時は、物理ボタンの「FAX」ボタンを押し、電卓式に0から9まで並んだ物理キーで直接番号を打ち始めればいいことが分かりました(この間タッチ操作は不要)。
しかし後日もう一度探ってみると、FAXボタンを押したあとの画面の中で、横へ複数並んだ小さいボタンの一つに「番号入力ボタン」が紛れ込んでいました。
細々としていて見つけづらかったのです。

このFAXメニューの画面にあるボタン数を数えてみたところ、なんと20個以上ものボタンが並べられていました。
単独ボタンだけでその数です。
それに加え、メニュータブ、プルダウンメニュー、連絡帳リスト、そして多数の文字ラベルと仕切り枠が、8インチ程度の画面にすべて押し込められていました。

上のアイキャッチ画像がまさにそれです。





UIデザインの世界で実績あるfladdictさんが言及する、次のタブーを見事に犯していました。

大量のボタン、柔軟すぎるオプション、過剰な設定画面。無数の選択肢はプロやヘビーユーザーには必要かもしれない。しかし一般ユーザーからすれば、その大半は意思決定を妨げるノイズ以外のなにものでもないのである

「スマホUI考(番外編) なぜ機能追加をし続けるとアプリが破綻するのか?」



国内メーカーは「タッチスクリーン×複雑なGUI」を導入した上で、さらに「複数の物理キー」をも並べる設計をしがちです。カーナビなどはまさにそうですが、私が見るかぎり業務機器は特にその傾向が強く、ATM、駅の切符購入機、レジスターなどで散見されます。

上の画像を見ていただければ分かりますが、その業務用プリンタのGUIでは上側にいくつかのボタンが常駐し、下側にはメニュータブが並び、中央にもたくさんのボタンが散乱し、
さらに画面の外、右隣にも「スキャン」「コピー」「FAX」といったメニューボタンが5つほど、しかも今度は"縦"に並んでいます。

番号キーの周囲もボタンだらけです。そのポジション的・階層的な上下関係はわかりづらく、秩序も一貫性もありません。
ファクス送信ボタンも画面の中と外に設置されています。


本来は「タッチ操作だけ」にするか、「物理ボタン×非タッチスクリーン」のどちらかに割り切るのが無難です。
統合デザインと人間工学に自信があれば、物理インターフェイスと画面インターフェイスを融和させ、シームレスで一体感があり、かつ簡潔な操作性ももちろん実現可能なはずですが、国内大企業の"ひたすらボタンと文字ラベルを並べる"という単調センスでは難しいと思われます。

僕が国内製品を見ていて思うのが、GUIにしろ物理的なパーツにしろ、

・文字ラベルで機能を知り、ボタンを押すことで機能発動
・一機能、一ボタン
・それを縦横に並べる


という発想に執拗なまでにとらわれてしまっていることです。

この思考回路の蔓延が「日本特有の醜いデザイン言語」の形成に大きく寄与することとなります。
ハードウェアエンジニアがデザインしているのでしょうか?


その業務用プリンタでは無秩序的にボタンをぶち込むため、"操作の流れ"が流れになっていませんでした。「ゴミ屋敷GUI」と「物理キーの羅列」というダブルパンチです。
機械に強くもない一般人が困惑するのも当然で、まさにBad UIによる業務妨害でした。

それに比べれば、コンビニのプリンタはタッチスクリーンに統一されていてまだマシだと思われます。
(ただし、中のGUIデザインがいいかどうかはまた別の話ですが。)


ソシオメディア株式会社のUIコンサルタント・デザイナーである川添 歩氏は言っています。

最近のケータイでタッチインターフェースを採用しているもののほとんどは、iPhoneとは異なり、これまでのボタンやキーも併せ持っています。(中略)

タッチUIを採用した製品がよく「直感的に操作できる」(あるいは「直観的に操作できる」)という宣伝文句を用いているのを眼にしますが、「タッチにすれば直感的になる」わけではまったくありません。多くの場合、異なるUIの混在による問題をむしろ内在させる結果となります。
キーとの併用ではタッチかキーか、どちらで操作するかを「直感的に」伝えなければ、使いやすくなるどころか、かえって混乱を増大させるのです。

そして現在存在するそのような製品の大半は、実際混乱しているようにみえます。

「タッチが混乱させるUI」




「シンプル イズ ベスト」という言葉がありますが、じゃあシンプルで少ない操作パーツなら使いやすくなるかというとそうではありません。

例えば、Wi-Fiルーター。
僕が現在使用しているNEC製WiMAXルーター(WX-03)は、中央に2インチ程度のタッチスクリーンがある以外は、側面に電源ボタンがあるのみです(スクリーン左端の上部)。

そして、その唯一の物理ボタンがまさに問題で、幅3ミリ程度のか細いボタンであるにもかかわらず、側面に合わせて真っ平らになってしまっているのです。
つまり、ボタンが側面からとび出ていないため、正面から見たときにどこに電源ボタンがあるのか見えませんし、指で触っても特定しづらく、なおかつ押しづらいのです。




スマホ界では普通、側面のボタンをそのような真っ平らにすることはありません。

そのボタンは画面のオン・オフやスリープモード呼び出しなどでよく使うだけでなく、「電源OFF」「スリープモード」といった頻繁にアクセスする電源メニューには"長押し"が必要です。

押せたのかどうかもわからないようなボタンをメニューが出てくるまで押し続けるというのは、これが思いのほかストレスなのです。
こうもストレスばかり感じると、そのルーターにできるだけ触りたくないと思ってしまいます。


NECや東芝はデザインには伝統的にこだわってきていない企業ですが、デザイン性に無頓着なメーカーというのは、たった一つの物理ボタンでさえも使いやすくできないようです。



ーーーーー

以上です。

このような感じで、具体例や著名人の言葉を交えながら、筆者独自の視点で国内の問題点指摘や提案をおこなっていくのが本書となります。
ちなみにこの項は、当書籍の中でももっともブログに載せやすい無難な内容です。

ところで、ATMやレジスターといった業務機器といえばシングルボードコンピュータなどが使われると思いますが、「RSコンポーネンツ」という部品販売サイトをご存知でしょうか?
ハード部品の膨大な品揃えで驚きましたが、エンジニアなら個人でも楽しめるかもしれませんね。
自分もいずれハードウェア開発に手を出したいと考えているので、いずれお世話になりそうです。



Sponsored Link





Comment