UIとは

当ブログではときどきUIの話題を扱っています。「この作品のUIはクソ」みたいな。でもそもそもその「UI」って何なの?って話ですね。

UI(ユーザーインターフェース)とは

インターフェースとは窓口のことです。彼らの仕事はお客さんがやりたいことを受け付けて、それを社内語に変換して担当部署に受け渡し、返ってきた結果をお客さん語に変換して返すことです。

  1. お客さんが窓口に来て「商品を売ってほしい」と伝えます。
  2. 窓口が倉庫部門に在庫を確認します。
  3. 倉庫部門から在庫情報が返ってきます。
  4. 窓口が販売部門に値段を確認します。
  5. 販売部門から値段情報が返ってきます。
  6. 窓口がお客さんに伝えます。

お客さんは倉庫部門や販売部門などと考える必要はありません。窓口以外の部門は接客技術を持つ必要もありません。

これをゲームに置き換えてみましょう。「攻撃ボタン」という窓口があり、これをクリックすると「プレイヤーが攻撃したいと思っていること」がゲームに伝わります。メモリやポインタがどうとかダメージ計算や命中率がどうとか、難しい処理が行われて攻撃が行われて、プレイヤーに攻撃結果が伝えられます。

ユーザー(利用者)を受け付ける窓口だからユーザーインターフェース。プレイヤーを受け付ける窓口なのでプレイヤーインターフェースでもいいんですが、プレイヤーもユーザーの一種なのでまとめてユーザーインターフェース。

ボタンや入力欄、説明文、表示、そしてその色、大きさ、形、順番、位置、そういうのを全部ひっくるめてUIです。意識して見ると色々考えられているのに気付けて面白いですよ。

UIの基本

UIは特別な仕組みより「普通に使いやすいこと」が大事です。というのもUIは

  • 利用法を学ぶ
  • 実際に使う

という2つのステップがあるためです。「便利だけど普通ではないUI」は使い方を学ばなければならず、ものすごく便利でなければ、学習コストが掛かる分損になってしまいます。

このため「他の人がそうしているならそうすべきで、していないならすべきでない」が基本になります。たとえばブログの最上部のブログ名の表示は、トップページへのリンクであるべきです。みんなそうなっているので、それを期待してクリックします。それでリンクになっていなかったらがっかりしてしまいます。

「恋ぷれ」で学ぶエロゲUIデザイン

独自のマウスジェスチャーやショートカットキーを搭載しているエロゲってありますよね。あれ多分まともに使われていません。エロゲなんて精々数十時間の付き合いなのに学ばなきゃいけないので。そして使わなくても普通にプレイできちゃうので。

多くのユーザーは説明書を全て読むようなことはせず、実際に使ってみて、問題にぶつかると混乱するか、そのときになって初めて説明書の当該部分をパパッと読んで済ませます。そんなもんです。

UI設計には人間についての理解が必要です、と言うかやっていれば嫌でも理解が深まります。私は度々「人間にはこういう性質があるので~」みたいなことを言っていますが、あれは大体UI設計していて発生した理解です。

エロゲオタクのフォロワーを増やしたいなら、エロゲオタクアピールしましょう

UIがよければ売れる…わけではない

UIがとても使いやすくても、だからと言ってめちゃくちゃ売れるわけではありません。エロゲって結局は絵やシナリオ、声なので。恋ぷれはUIは素晴らしい作品でしたけど、合わなくて途中で心が折れましたしね。UIは作品を構成するほんの一要素でしかありません。

ただし「UIが使いづらくてプレイヤーの心が折れる」という事態はあり得るので、ホント特別なことはしないでいいので「普通に使いやすいUI」にはすべきです。

UX(ユーザーエクスペリエンス)とは

UIと一緒に出てくる言葉にUXというものがあります。エクスペリエンスとは体験のことです。User ExperienceですがなぜかUEじゃないんですね。よくわかりませんが大きな問題でもないでしょう。

ユーザーがそのサービスを使ったときの一連の流れ(体験)のことで、たとえばブログではGoogleなどの検索結果で「お、ここなら求めている情報がありそうだ」と感じてクリックして表示されるまで待って、スクロールしたりしなかったりして、知りたかった情報に出会えたり出会えなかったりして、満足したりしなかったりしてタブを閉じたり他に興味が移ったりするまでの一連の流れです。

「あれ、どうやったらエンディングAになるんだろう?攻略情報を見てみるか」
「檻の中の性倒錯 攻略」[検索]


(お、攻略ページあるじゃん)


(あ、何かエンディング分岐がどうとか書いてある。ちょっとスクロールしてみるか)


(あった。あーこうすればいいのか)

いやまぁ実際どういう流れになるかはホント色々あり、お客さん全員を思い通りに動かすことはできません。けど大まかに流れを作ることはできます。

UXの目的

ブログも他のWebサービスも、「お客さんに~してほしい」と思って運営しています。なのでもっと~してもらうにはどういうUXであるべきか、と考えて設計します。

今回の例の場合、私の目的は「多くの人にブログを見てもらいたい」です。そして「役に立つ記事を投稿して、検索して見つけてもらう」という手段を考えました。そして上手いことお客さんがブログを見ました。無事に求めている情報を得られて大満足。UXとしては100点満点で…50点くらいかな。あれ?

たしかにこのお客さんはブログを見ました。けどそれだけです。お客さんが「この記事はすごく役立ちました!」などとTwitterで紹介してくれればより多くの人に見てもらえます。「ここのブログは役立ちそうだ」とブックマークに登録してくれれば、今後も継続的に見てもらえそうです。

そういう観点では、1記事で終わるような攻略記事ってあまり旨味がありません。今回のお客さんは「檻の中の性倒錯」の攻略情報を入手した後、多分他の記事には目もくれずにタブを閉じてしまいます。もうこのブログには「檻の中の性倒錯」の攻略情報はないでしょうから。皆さんそうだと思いますけど「○○ 使い方」でアクセスしたブログの他の記事なんて見ませんよね。

それで私は攻略記事にもデータだけでなくちょっと独自の解釈や体験談を組み込んで「私」に興味を持ってもらえるきっかけを仕掛けるようにしています。効果があるかはわかりませんけど。

こんな感じ。効果があったらいいなぁ。

まとめ

  • ユーザーと道具との間にある、ユーザーのやりたいことを道具に伝えたり、その結果をユーザーに伝えるのがUI
  • UIは学習しないと使えないので「普通に使いやすい」がいい
  • ユーザーがそのサービスで体験する一連の流れがUX
  • UXは自分が望んでいることをユーザーにやってもらえるように設計する

色々なことが考えられ、効果があったりなかったり、そもそもそのUIの効果なのかわからなかったり、なんだかよくわからない分野ではありますがとても面白い分野でもあります。「人間とは…?」みたいになってくるのホント楽しい。

当ブログもUI、UXについては色々考えているので、あちこち見て回って、「これはなぜこうなっているんだろう?」と考えてみると面白いかもしれません。何も考えずにそうなっているのかもしれませんけど。私なので。