市場調査ホームニールセン博士のAlertboxブラウザとGUIクローム「クローム」は、ユーザーのデータやウェブページのコンテンツを取り囲む、ユーザーインタフェースのオーバーヘッドである。クロームは肥大化すると利用可能なピクセルの半分を食いつぶすこともあるが、使用量が妥当ならユーザビリティを向上させるものだ。2012ユーザーインタフェースデザインにおける「クローム」についてどう考えればいいだろうか。この質問は最近実施した「モバイルとタブレット向けのビジュアルデザイン」についてのコース中、出席者の1人から尋ねられたものである。基本的な質問をされたときは常に、それについての答えを知りたい人はずっとたくさんいるのだろうと私は考える。そこでこの記事ではクロームについて取り上げようと思う。クロームとは、画面のコンテンツについての情報をユーザーに与えたり、その画面のコンテンツを操作する指示を出すためのビジュアルデザイン要素である(画面のコンテンツに属しているのではない)。したデザイン要素は、オペレーティングシステムであれ、ウェブサイトやアプリケーションであれ、その基礎的なシステムによって提供されており、ユーザーのデータはそれによって取り囲まれている。「Chrome」がGoogleのウェブブラウザの名前でもあるのは偶然の一致ではない。今回、私がその意味でこの用語を使うことはない。chrome)の見た目から来ているのではないだろうか。した車の車体(座る部分)はバンパーやテールフィンなどに付いていた光り輝くクロムによって取り囲まれていたからである。同様に、現在のGUIではクロームは画面の周辺部に存在し、ユーザーのデータ用に充てられた中心部を取り囲んでいる。様々なシステムレベルにおけるクローム以下に示すのはいくつかのクロームの例である。PCの基礎的なシステムはWindowsオペレーティングシステムである。7ではそのクロームはスタートボタンとタスクバー、システムトレイ、ごみ箱から構成されている。ガジェットエリアもクロームであると考えてもいいかもしれない。ユーザーがシステムに付いてきたからということでそうしたガジェットを使っているというなら、とりわけそうだろう。(惰性とデフォルトの力によって多くの人がそうするからである)。ワードプロセッサのようなアプリケーションソフトウェアの利用時、そのクロームはメニューバーやリボン、ツールバー、ルーラー、スクロールバー、また、Wordの類義語辞典バーやPhotoshopの色見本パレットのような様々な専用ペインで見つけられる。ウェブブラウザではそのクロームにはURL欄や、ブラウザのツールバー、ブラウザのボタン、タブ、スクロールバー、ステータス欄が含まれる。モバイルのアプリではそのクロームには画面の一番上を横切っているステータスバーや下部を横切っているコマンドアイコンの載ったタブバーが含まれていることが多い。ステータスバーの下にあるナビゲーションバーが当てはまることもある。ウェブサイトではそのクロームにはナビゲーションバーやフッター、ロゴ、ブランドマーク、検索ボックス等が含まれる。私のピクセルを使わないでくれクロームによるデメリットはわかりやすい。クロームは画面スペースを塞ぐので、目的のコンテンツやデータのためのスペースが減るのである。これはモバイル機器では特にまずい。いうのも、タブレットやPCと比べて、画面スペースの価値がずっと高いからだ。私の30インチデスクトップモニターですら、WindowsとExcelのクロームが組み合わされると、スプレッドシータのデータは67列しか見えなくなる。理論的には画面に80列入るはずなのに、である。クロームがなければ、見渡せるデータはおよそ19%増えるはずなのである。このスプレッドシートの例からクロームのもう1つの欠点がわかる。それは、システムが別のシステムのレイヤーの中で入れ子になると、かさが増してしまうということである。Facebookを使っているとしよう。典型的なデスクトップブラウザのウィンドウではユーザーのFacebookのウォールはそのページの約48%しか表示されない。Facebookのクロームと無駄な画面スペースによって、残りの52%は食いつぶされているのである。(我々の定義では、広告は正確に言うとクロームではない。それは無駄なものだからである。それがオーバーヘッドであることには変わりはないので、ここでは数値に入れている)。ブラウザやOSのクロームを差し引くと、ユーザーのウォールに割り当てられる画面スペースは40%に満たない。9年前、様々なウェブサイトのホームページを分析したとき、ユーザーの画面上で実際のコンテンツに割り当てられる配分はわずか20%だった。大きくなった現在のモニター上では、OSやブラウザのクロームによって消費される相対的オーバーヘッドの割合はそこまでにはならないので、Facebookでの40%という配分は主要ウェブサイトにおけるかなり典型的なものだろう。ガイドラインの1つがクロームの肥大化には気をつけようということであるのは間違いない。2番目のガイドラインはクロームのパーツを一時的に非表示にして、必要なときだけ見せる方法を考えようというものである。することは危険でもある。去るものは日々にうとしということで、視界から消えたものは頭からも消えてしまうことが多いからだ。ユーザーインタフェースでは短期記憶は全く当てにできない。したがって、現れたり消えたりするクロームは以下のようなときにのみ機能する:クロームを見せるためにシンプルで信頼性の高い操作を利用するとき(反応が鈍かったり、予想外に起動しやすいジェスチャーを利用してはならない)。絶対的な一貫性が提供されているとき。ユーザーの学習を台無しにする逸脱や例外がなく、何度も繰り返されることで、非表示のクロームの存在がユーザーの長期記憶に叩き込まれるようになる。クロームのメリット高いものにつくとはいえ、クロームには多数のメリットがある:クロームによって常に見える(あるいは、私のガイドラインに従っていれば、少なくともすぐに出てくる)コマンドやオプションの一定のセットが提供されることで、ユーザーに力を与える。クロームは常に同じ位置にあるので、ユーザーはそれがどこにあるかを探すことから解放される。ウェブページやコンテンツの個々のデザイナーの思いつきからも自由になれる。これこそが戻るボタンがウェブでもっとも人気の機能である理由の1つである。クロームは画面のピクセルという意味ではオーバーヘッドかもしれないが、不愉快な、あるいは役に立たないウェブページからの緊急非常口としての役目を果たすという意味ではユーザーがすぐに使える権限なのである。クロームによって、フレームワークの中に現れる様々なタイプのコンテンツやデータすべてで機能する一連の汎用コマンドが提供される。それは常に同じなので、ユーザーはあまり学習をしなくてもよくなり、コンピューターではなく、現実世界での自分たちのニーズに集中できるようになる。クロームによって、ユーザーインタフェースの一貫性と標準化の度合いが進み、それによって学習のしやすさが促進され、ユーザーはますます自分のエクスペリエンスをコントロールしているという気になれる。(もちろん、これが当てはまるのは標準規格に従った場合のみである。ユーザーを混乱させる自分たちによる奇妙なクロームを発明した場合はそうではない)。結局のところ、クロームはユーザビリティにとって良いものである。注意を促すため、Mozillaが私がコンサルタントをしているクライアントのうちの1社であることについて言及しておくべきだろう。彼らの主要な製品(Firefox)はこの記事で私が触れているGoogleのChromeブラウザの競争相手である。その一方、Googleは私のユーザビリティウィークカンファレンスに最も多くの出席者を送り込んでいる企業の1つだ。(私はGoogleの創設期には彼らの相談役もしていた)。私はどちらの企業にも好意を持っている。いずれにしても、私はGoogleのブラウザには言及しているだけであり、それに対して勧めることも、勧めないこともしていない。したがって、そこにはどのみちバイアスはかかっていないと考える。今、あなたが目にしているものが、あなたが自分なりの判断をするために開示されたすべての情報である。Webユーザビリティアプリケーションブランディングイードが提供する「ユーザビリティ評価」サービスイードは、スマートフォンアプリやサイトのUI品質をユーザー視点で評価・改善提案し、ユーザー側とビジネス側、双方の目的達成をサポートします。関連記事FlashとWebベースアプリケーション46件のFlashアプリケーションのテストから、ウェブベースの機能が持つ刹那的な性質に関係して、基本的な問題がいくつかわかってきた。ラジオボタン有名ウェブサイトでも、基本的なユーザインタフェース(UI)で初歩的な間違いを犯すことがある。入力フォームのプレースホルダを使ってはいけない入力フォームのプレースホルダテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。視覚や認知機能に障害のあるユーザーにはさらなる負担となる。RunwayやUber、Airbnbは、画面のUIデザインにとどまらない、奥深いところまで考え抜いたデザインによって、業界の昔ながらのエクスペリエンスに挑戦している。