2017.02.22

人を観察し、解明し、喜ばせる――「BADUI」から始めるユーザインタフェースの考え方

ヒューマン・インフォメーション・インタラクション 中村聡史氏インタビュー

情報 #教養入門#BADUI

何階にあるか分からない教室の番号、オンなのかオフなのか分からない照明のスイッチ、どちらが男性なのか女性なのか分からないトイレ……そういったおかしなデザインを見たことはないでしょうか? 今回お話をお聞きする中村先生は、これを「BADUI(バッドユーアイ)」と呼び、世の中を観察して集め、活用しているそうです。

明治大学4年生の私、白石がいままでずっと気になっていた先生方にお話を聞きに行く、短期集中連載『高校生のための教養入門特別編』の第6弾。2013年に新設されたばかりの明治大学総合数理学部は、どのような研究をしているのでしょうか? ヒューマン・インフォメーション・インタラクションを研究している中村聡史先生にお聞きしました。

 

 

手書き文字を数式に変換する?

 

――先生はどのような研究をされているんでしょうか。総合数理学部って、プログラミングをやっている学部なのかなとざっくり理解しているのですが。

人と情報をどう繋いでいくのかという研究をしています。最近はディープラーニングというキーワードに代表されるように、コンピュータが分析したり認識したりする技術が進んでいますが、どうしても最後に重要になってくるのは人とつなぐところです。コンピュータ自身にすごい能力があるといっても、それを人がうまく使うことができなければどうしようもないし、人に伝えることができなければどうしようもないわけです。そこの部分をなんとかしようというのが研究の興味ですね。

今研究しているものの一つが、手書き文字に関するものです。人は頭の中に手書き文字をどのようにイメージしていて、どのように表現しているのか、そして手書き文字をどう受け入れているのかに興味があります。その一つが平均手書き文字です。なんでもいいんですが、たとえば「あ」って書いた後、もう一度適当に「あ」って書くと、二つの「あ」を平均化した「あ」を生成することができるという仕組みを実現しています。

色々と実験をやっていった結果、どうやら人は頭のなかにあるイメージ通りに文字を書くのですが、どうしてもイメージと実際に書いた文字の間にはブレが生じているようで、何度も書いた文字を平均化してブレをだんだんなくしていくと、本人にとってきれいだと感じる文字になっていくようです。

――これはどういうきっかけで研究することになったんですか?

もともとは同じ学科にいる数理科学が専門の鈴木正明先生と、認知科学が専門の小松孝徳先生と一緒にご飯を食べているときに、「ひらがなとカタカナでは感じ方が違うよね」という話したことから始まりました。

たとえば「ふわふわ」と「フワフワ」では、同じ言葉でも印象が違いますよね。その違いって何なんだろう、その違いをどのように分析しようとなったときに、手書き文字の特性を利用すればうまくいくのではないかと考えたんです。つまり手書き文字を数式として表現することで、ひらがなとカタカナの違いを明らかにしようということですね。

――手書き文字を数式にする……どういうことですか?

たとえば「の」って書くと、この「の」を数式に変換することができるんです。

画像01

手書き文字を数式に変換する。実際に試すこともできる。:http://satoken.nkmr.io/2015/Char2Fourier/convert.html

これはフーリエ級数展開という数学の手法を使っています。下に赤いXの式と青いYの式の二つに分けて表示されているのが、この「の」の数式ですね。よく見ると、たくさんのsin(サイン)とcos(コサイン)を足し合わせています。それがtという変数によって、それぞれの値が決められています。

では、このように手書き文字を数式で表現するとなにができるかというと、数式と数式の平均をとることができるんですね。要するに、数式を足して2で割るということです。ところで平均顔って知っていますか?

――いろいろな顔を重ね合わせていくと、平均的な顔になるというものですよね。

そうです。それと同じで、その人が書いた手書き文字を重ね合わせていくと、その人だけの平均手書き文字をつくることができるんです。また、平均顔は魅力的な顔をしているといわれることもありますが、手書き文字でも同じような結果が出ており、色々な人の手書き文字を平均化していくと、多くの人が好む手書き文字になっていくようです。

これから発展した研究として、手書き文字をリアルタイムで修正していくというものがあります。これはユーザが気づかないうちに、書かれた文字をお手本のように綺麗に変化させていくというものなんですね。つまり、文字を手書きしているときに、リアルタイムでお手本の文字と書かれた文字との平均文字をつくりだしていくんです。

画像02

平均化した文字は綺麗になる:中村聡史研究室提供

実際には平均をとると劇的に変化してしまって違和感を覚えてしまうので、加重平均という方法で割合を変えつつ(例えば20%や30%など)お手本の文字に近づけるようにしています。これを何回も続けていると、いつの間にかユーザは自身が目的とする手書き文字を書けるようになっていきます。また、この方法は自身の手書き文字が少し綺麗になって提示されるため、モチベーションを高く保ちつつ練習していくことができるんですよ。

だから思い切って50%お手本に近づけるモードにしたりすると、かなり驚きます。実際に書いてみてください。

――……すごいですね。結構適当に書いたんですが。僕が書いたとは思えないぐらい綺麗に書かれています。

そうですね。綺麗に書けるといった成功体験は、繰り返し練習するということにつながると我々は考えています。この方法は、手書き文字だけではなく、絵の練習にも使えると考えています。

あとは、絵を描いているときや、字を書いているときに、最後に書いた一筆が満足できないとき、一度消して書き直すことってありますよね。これは、単純にイメージ通りに再現できないという、ぶれによるものだと考えています。そうしたときに、最初に書いたものと2回目に書いたものを平均化すると、その間のものを作ることができ、結果的に本人にとって満足度の高いものになるんです。

例えば、フリーハンドでキャラクタの顔の輪郭を描くのは簡単ではありませんので、消しては描くというのを何回も繰り返す人もいるかと思います。ここで平均化の技術を使えば、平均化された目的に近い輪郭を描くことができるんです。

要するに平均化を使えば、自分のなかのイメージのブレを減らしていくことができるんですね。面白いのが、人間って右手で書いても左手で書いても同じような字になるんですね。右利きの人は左手で書くと綺麗には書けないんですが、何回か書いて平均を取ると、まるで右手で書いたような文字になるんです。つまり頭のなかにイメージする文字が同じということですね。

――なるほど。これは子供が文字を勉強するときに使えそうですね。

そうですね。子供が手書き文字を練習したり、絵を描いたりするときに使ってもらいたいですし、将来的にはプロフェッショナルが使うようなものにもしたいと思っています。

CIMG1827

自然を解明する研究と、人間を知ろうとする研究の違いとは

 

――ほかにはどのような研究をしているんですか?

あとはネタバレ系ですね。サッカーの試合などをテレビで見ているとき、ネタバレされてもいいよという人とダメだという人がいますよね。それはいったいどうしてだろうと思ったんです。そこで、サッカーの試合を見せて、ネタバレありのときとなしのときでは見ている人の感じ方に違いがあるのかを実験したんです。

要するに、結果を知っている状態で見た人と知らない状態で見た人にそれぞれ感想を聞いたんですね。そうしたらやはり、ネタバレありの人は試合を見ているときの緊張感が薄れるということが分かったんです。

そこで次に、ネタバレをするタイミングは何か関係があるのか調べようということになりました。今度はサッカーではなく漫画を実験材料にしました。実験グループを「あらすじ後にネタバレ」「3分の1まで読んだところでネタバレ」「3分の2まで読んだところでネタバレ」「ネタバレなし」の4つに分けました。結果は、最初の方でネタバレされてもなにも思わないんですが、3分の2ぐらいまで読んでからネタバレされると不快感を覚える人が多かったんです。

 

 

――それは面白いですね。確かに、楽しみにしていた録画を見る前にうっかりツイッターを開いてネタバレが飛び込んでくると、がっかりしますね。

 

このようにネタバレはコンテンツを楽しむ人の楽しみを奪ってしまうものです。ネットを見ていると、いつどこでネタバレに遭遇するか分かりません。そこで、ウェブブラウザ表示されるネタバレ関連の情報を自動的に特定し、非表示にしたりする研究もしています。

あとは最近では、ツイッターでサッカーの試合結果やアニメの展開を知ってしまい、録画を見る楽しみがなくなってしまうということもありますよね。そこで今、学生がツイッターにおけるネタバレツイートを特定する研究をしています。

――私の勝手な考えでは、理系の研究者は自然がどうなっているのかとか、物質の構造とか、何かを発見するのが仕事なのかなと思っていました。でも先生の研究はどちらかといえば、なかったものを作り出す方向に向いていますよね。

そうですね。自然法則を解明したり物質の構造を発見したりとかいう方向ではないですね。興味があるのは、人間はどういうものなんだろうということを考えながら人間のことを一生懸命考えて、人間がどう思うか、どう動くかを考え、その人間のためになる仕組みを実現していくということですね。

つまりほとんどの研究は、人間ってなんだろうということを観察することから始まってます。そして、観察から何かの特性を掴んだときに、じゃあそれをどうにかできないかと考えるんです。たとえば先ほどの手書き文字の話でいえば、人はなんでイメージ通りには書けないんだろうというところを出発点になるわけです。

では、イメージ通りに書けるようになったらどうか。そこで文字について調べてみたところ、人はどうやら平均化した文字を綺麗に感じるらしいということが分かる。じゃあリアルタイムに人が書いている手書き文字を平均化して見せたら、その人は嬉しくなるのではと考えるわけです。

ですので応用されるまでの時間が短いという意味では、自然科学よりはかなり近い未来を対象としていますね。

照明が2つともオフになっているのはどれ? ユーザのミスを誘うBADUIの面白さ

――先生は、使いにくかったり分かりにくかったりする駄目なユーザインタフェース・「BADUI(バッドユーアイ)」にとても強く関心をもっていますよね。これにはどうして注目し始めたんですか?

もともとライフログという記憶を記録化する研究に興味があるのもあって、面白いもの、興味を持ったものを撮影するのが好きで、その流れで面白い困ったユーザインタフェースを見つけるたびに「世の中にこんな面白いものがあるんだ」と撮影していたんです。

ちなみに僕がオリジナルではなくて、東大の暦本純一先生が、「BADUISM」というブログ記事を書いたのが始まりです。それから一時的にmixiでユーザインタフェースの研究者たちがBADUIの写真を投稿したりしていました。このコミュニティはいつしか活動的でなくなってしまったので、個人的にBADUIのサイトをつくってブログ形式で投稿し続けていました。

それでこういうものを蓄積していくと、色々な見方ができるようになって面白くなってきました。何が面白いかというと、教育につながるんです。大学や高校の授業、そして社会人向けや仕事を引退された人向けのセミナーでもこうした事例にからめつつ、様々なことを教えさせていただいています。

通常、BADUIを見ると人は「分かりにくいね」と呆れて終わるんですが、もう少し先まで考えてもらい、なにが問題でどうするべきかという力をつけてほしいと思っています。BADUIは世の中にたくさんあります。明治大学にも多いんですよ。たとえば308B号室って何階にあると思います?

――3階ですか?

8階なんですよ。じゃあ1001号室はどこだと思いますか。

――これは確か10階ですよね。

いえ、地下1階です。実を言うとこれって、頭の数字は建物に割り振られた番号なんですよ。1は学生が普段通っているリバティタワー。3はガイダンスなどで使われるアカデミーコモン。数字の間の2桁が階の番号で、最後の1桁が部屋番号なんですよ。

――普段見ているはずなのに、分からなかったです。

そうですよね。こういったBADUIは見ているだけでも単純に面白いのですが、そこから、じゃあどうすればいいかとか、どうしてこういうものが出来上がってしまったんだろうと考えるわけです。そこにはこれを作った人の思想が透けて見えますし、人がデザインに表れていると思うと楽しいです。

1年生のゼミの授業では、このようなBADUIをたくさん見せています。たとえばこれ。2つの照明を操作するスイッチですが、どの状態だと照明が2つともオフになっていると思いますか?

画像03

照明が2つともオフになっているのはどれ?:『失敗から学ぶユーザインタフェース』より

――一番左側の状態じゃないんですか?

だと思うじゃないですか。実は左から2番目の状態なんですよ。上の緑のランプは「ほたるスイッチ」といって、暗闇でも見えるように光っているだけなんです。そして下の赤のランプは「パイロットスイッチ」といって、いまあるところから見えないところ、たとえばトイレなどの照明がついていることを示しています。つまりどこかで電気がつけっぱなしであることを警告しているということですね。

要するに、上の「ほたるスイッチ」は、点灯しているときに照明がオフになり、下の「パイロットスイッチ」は、点灯していないときに照明がオフになっているという、かなり混乱する仕組みになっているんですね。これではぱっと見たときに照明がどうなっているのか、分からないですよね。

 

誰もがデザイナーになりうる時代だからこそ、BADUIに注目する

 

――スイッチの仕組みは全然分からなかったです。これは誰が見てもうまく扱えないですね。

 

最近、文部科学省で人事に関するメールを間違って全職員に送信してしまったという事件がありました。これはスタッフのせいではなく、システムのせいだと思っています。

このメールシステムは宛先を指定するときに、まず「文部科学省」という省がでてきて、それをクリックするとつぎに部門がでてきて、それをクリックするとさらに課がでてくるのですが、「文部科学省」という文字をダブルクリックすると、メールが自動的に文科省全体に送信されるよう設定されるというものになっているんです。これが今年の1月に導入されたばかり。これはどう考えても人ではなくシステムの問題です。

つまり人のミスって、ある程度はシステムのせいでもあることがあるんですね。先ほどの照明のスイッチにしてもそうですが、システムを改善することで生活を良くする余地はたくさん残っているんです。でもほとんどの人はそれに気づいていない。だからBADUIに注目しようと学生には言っています。それは何が問題なのか、どうしてそうなってしまったのかを考えることは、生活を改善する一歩になるからです。

そして重要なのは、今やユーザインタフェースをつくる機会はデザイナーだけではなく、すべての人に与えられているということです。大学の掲示にしても職員がつくっているわけですし、学園祭のときに壁に貼られる案内も学生がつくっているわけです。そう考えると、全員がBADUIのつくり手になりうるわけです。

――ミスをする原因は、その人ではなくシステムをつくった人にあるということですね。

そうです。ミスを誘うという意味では、ほかにもこういうBADUIもありますね。

画像04

どちらが男子トイレでどちらが女子トイレ?:『失敗から学ぶユーザインタフェース』より

このトイレ、左側が男性で右側が女性だと思うじゃないですか。でもよく見ると、実際は逆なんですね。

ふつう、人はこのマークを見たときに、これは男子トイレと女子トイレの位置を示しているのだなと思うじゃないですか。でもこれを作った人は、これを単に「トイレがここにありますよ」ということを示すマークとしてつけたんでしょうね。確かにトイレのマークってこういうふうな男女のマークですよね。でもこれを駅のホームなどではなくトイレの入り口に設置すると、人を混乱させることになってしまうんです。左が男で右が女かなと。

こういうことって学びを得られるわけです。単に「変なデザインだなあ」と素通りするだけではなく、そこからどうして人は間違うのか、どうして設置した人は間違ってしまったのか、どういう注意をしたらよいのか、どうやったらコストを抑えて改善できるかなど考えることができれば、それはそのまま学びとなります。

――確かにこのトイレはうっかり間違えてしまいそうで怖いですね。ちなみにこういう発見から研究に結びつくことはあるんですか?

たとえばウェブページの個人情報の入力フォームで、名前のふりがなはひらがなを入力しなきゃいけないのかカタカナを入れなきゃいけないのか、電話番号はハイフンを入れるのか入れないのか、ぱっと見て分からないことがあるじゃないですか。それを自動的に通知してくれたりする機能とか、逆に必要のないハイフンを入れたら勝手に消してくれたり、ひらがなを勝手にカタカナに変えてくれる機能などの研究を学生が取り組んでいます。

 

 

――先生は学生時代はどのような研究をされていたんでしょうか。

最初は、マウスをパソコンに2つつなげて、両手で2つのマウスを使うことでパソコン上の様々なものを操作するシステムをつくっていました。いまでいう、スマホのマルチタッチに似ているかもしれませんね。画像を拡大したりするときに二本の指で操作しますよね。それのマウス版みたいなものです。

あとはユーザが走っている間しか閲覧することができないウェブブラウザの研究など、やりたいと思ったことはいろいろやっていました。それ以降は、グーグルやヤフーなどの検索エンジンの検索結果をユーザに合った形に変更しようという「サーチインタラクション」という分野を研究していました。

もともと僕は工学部の情報系出身です。パソコンに興味があったので、やってみようかなと思って入りました。技術を応用して面白いものや幸せにできるもの、驚かせるものを作りたいなと。そう考えたときに、ユーザインタフェースの分野が向いていたんだと思います。

でも実は、パソコンにちゃんと触れたのは大学に入ってからなんです。高校生のときもちょっとは関心がありましたが、小学生のころからコンピュータをいじっていたとかではなかったですね。でも大学に入ってからは、僕にとってはプログラミングも遊びの一つになりました。あんまり研究のため、勉強の一貫とは考えていませんでした。

――理系の分野って、小さいときから異様に関心を持っている人じゃないとうまくいかないのかなと思ったりしていたんですが、大学からでも全然遅くはないんですね。

そうです。何か興味をもっていれば、それがたとえばBADUIだとしても、こうしてユーザインタフェースの研究と結びつくこともあるわけです。だから学生の人には、なんでもいいのでなにかに興味をもって、観察してほしいですね。

高校生におすすめの3冊

科学的とはどういうことかをもう一度問いなおす本です。文系理系の区分けにこだわらず、みんなが知っておくべきことだと思います。

人間がいかに錯覚しまくっているのかということを知ることができる、とても面白い本です。人間の感覚は信用ならないということを知りましょう。

今回紹介したBADUIに興味をもった人は読んでみてください。BADUIがどうしてこうなってしまったのか、どうすれば良かったのか、というところまで論じています。BADUIの写真をたくさん収録しているので、それを見ているだけでも楽しめると思います。

プロフィール

中村聡史ヒューマン・インフォメーション・インタラクション

1976年生まれ。明治大学総合数理学部先端メディアサイエンス学科准教授。大阪大学大学院工学研究科博士後期課程修了。独立行政法人情報通信研究機構非正規研究員、京都大学大学院情報研究科准教授、カリフォルニア大学バークレー校客員研究員を経て、現職。著書に『失敗から学ぶユーザインタフェース 世界はBADUI(バッド・ユーアイ)であふれている』(2015年、技術評論社)などがある。

この執筆者の記事