言葉はグラフィックより大事なインターフェイス

2013年3月16日にAndroid Bazaar Conference 2013 Spring が開催されました。昨年に引き続き今年も登壇。前回はゲームをテーマにして話をしましたが、今回は「コンテンツで改善する UI デザインの極意」と題してコンテンツと UI をテーマに話をしました。

見た目が綺麗だから良い UI というわけではない

見た目とインタラクションの提案は素晴らしいですが、メニューのキャプションは「My」だけ。これは何ができるアプリなのでしょうか。

UI のインスピレーションとして Dribblbe や Android Patterns のようなギャラリーサイトを見ている方は多いと思いますし、「素晴らしい UI のまとめ」と名付けた記事も、だいたいはこうしたギャラリーサイトを参照していることが多いです。

実装まで携わった経験がある方ならなんとなく分かると思いますが、Dribble で紹介されている UI アイデアの多くは現実味がない想像図が多く掲載されています。実装しようとするならばパフォーマンスや操作性を犠牲にしなければならないものも少なくなりません。また、ダミーテキストやストックフォトが使われていることがあるので、本当の利用シーンを考慮して作っているとも言い難いです。

近年、素晴らしい UI とされているものは、GUI (Graphical User Interface) に集中し過ぎているように見えます。

Dribblbe はグラフィックデザイナーのコミュニティですから、見た目を重要視するのは当然です。しかし、UI デザインという少し大きな枠組みで捉えるのであれば、見た目が良いから良い UI と解釈するのは安易すぎます。今回の講義では文字ひとつ変えるだけでもアプリやサイトの印象を変えたり、利用者の行動を変えることができるという話をしました。

テキストも UI

上記は、37 Signals の Jason Fried の始めての著書「Getting Real」に書かれている言葉です。人は文章を読まないと言われて久しいわけですが、少し工夫するだけでも大きな変化をもたらすことがあります。

講演で例として出した Facebook の「Like」Google+ の「プラス」。機能面ではまったく同じですが、キャプションが違うことで人の行動が変わります。例えば、悪いニュースや悲しいニュースには「Like」せずコメントを残すという行動に移る Facebook に対して、Google+ で同じニュースを投稿すると元気を分けるという意味合いで「プラス」を押す人がでてきます。 Pinterst にしても「Pin」ではなく、「投稿」「保存」といった言葉をつかっていたら、他のサービスではリーチしなかった利用者層に響かなかったかもしれません（Pinterst に関する考察は「文化が作り出す利用者との関係）」を参照してください）。

見た目だけではなく、ちょっとしたテキストだけでもサイト・アプリ全体の雰囲気を作り出す力をもっているわけです。

「ファンはいません」の下には婚活の広告のバナーが。余計なお世話である。

システム寄りの視点でテキストを入れていくだけでは、利用者に不快な思いをさせる場合があります。いろいろな人をフォローできる Yahoo! プロフィール では、始めたばかりだと「友達がいません」「ファンがいません」と表示します。まだ、友達登録をしていないから当然だと思うかもしれませんが、始めていきなり「友達がいません」と表示するのはどうなのでしょう。 UI が素晴らしいと絶賛されている　Path ですら、始めた直後は「ゼロ友達」という奇妙な表示をします（英語表記だと「0 Friends」ですから、これも寂しいです）。

テキストを UI として捉えてデザインするのは意外と難しいことです。
ボタン、ラベル、メニュー、告知といった要所のキャプションをみるだけでなく、利用者がどのような文脈で画面を見ているのかを把握する必要があるからです。

• そもそもターゲットにしている利用者はどんな人か
• なぜサイトを訪れているのか
• そのとき何を思い浮かべてるか、不安はなにか
• その先に何を期待しているのか
• したい行動を実現するための方法が理解できるか

これらを把握して、はじめて利用者にとってピンとくるインターフェイスになります。これは簡単な作業ではありません。UI として使うテキストもコンテンツと見なして開発・管理しなければならないことを意味しています。ユーザー作成コンテンツが中心だから考える必要はない・・・ということではなく、見た目を設計する前に、サイトでの言葉遣いを設計しておくと良いでしょう。そうすれば、どのような見た目にしたら良いのか自然にみえてくるはずです。