あるインターフェースが他のものより「直感的」だと思ったことはありませんか？何があるUIを人々と共感させ、一方で共感させないのでしょうか。この講演では、この謎にスポットを当ててみます。ある点では、人間の心は信じられないほど適応性がありますが、一方で他の点では石器時代から変わっていないように見られます。人間のためのデザインやデジタル体験をデザインする上での障害や機会をこの二分法で説明します。

---

イントロダクション (00:00)

Bojanaです。これはBeardyManで、Typeformのマスコットです。私はそこでリードUXデザイナーをしています。

人間の脳のためのデザインについてお話しします。私達は人間のためにデザインをしていますが、それはつまり脳のためにデザインをしているということです。いくつかの重要な制限、人間の脳の利益や功績についてお話します。デザインハックのように考えることができます。なぜを理解するとき、なぜそれが機能しているかを理解し、そのコンテキストを理解できるようにするためのアプリケーション（もしくは構築したり、デザインするものは何でも）を作るのによりよい位置にいます。

デザインとは? (01:07)

これには多くの誤解があります。

デザインは計画であり、何かを構築するために作成した図面です。例えば、建築計画、ビジネスプロセス、回路図、縫製パターンや、日常で使うものを構成するものです。デザインするということは美学や機能、経済、社会政治をデザインコンテキストと同様に考慮するということです。

この認識は製品をデザインしたり、製品を構築するときに重要で、かなりの研究が必要となるかもしれません。相互作用や調整が必要な場合もあります。再設計や反復も必要となるでしょう。UXデザインは使いやすさ、ユーザフレンドリー、使い心地に焦点を当てた違う考え方です。

インターフェースの世界での生活 (02:59)

私達はこれまで長い間、他の人のために物を作ったり、デザインをしてきました（建築、服など）。これは、デザインの新たな進化です。私達はインターフェースの世界で生活しているのです。

手を見てみましょう。 密な組織、腱、骨、そしてすべてが皮膚によって覆われています。使うのは簡単なのに、複雑なこともできます。肌とはその背後にあるものすべてのインターフェースです。

住んでいる建物をみてみると、壁には配線が敷き詰められていて、あるシステムで制御されています。壁にあるスイッチはインターフェースです。UIは複雑さの抽象化の繰り返しであって、コミュニケーションを円滑にしたり、物を使うのを簡単に（また、住みやすく）します。時間を節約できます。

#1 UIの目的: 複雑さの抽象化 (04:00)

私はUIの第一の目的が複雑さの抽象化であると考えています。表面をきれいにするだけでなく、より多くのことを行うことができます。システム自体がどのように組み合わされているかです。

私たちは人間のためのデザインをしたいと思っていたり、人々が携帯のアプリケーションをデザインする方法について話しているので、人間の脳について話したいと思います。

人間の脳 (04:19)

一般化します。もし会場に神経科学者がいるなら、より良いデザインのために話を簡単にしていることにご理解ください。

今日の目的のために、脳を3つに分けて、(たまねぎの層のように)それぞれ進化したものと考えます。

• 脳幹は脳の一部で（呼吸や消化、安全確保などの）コアな機能や出生を制御し、3億年もの間繰り返してきました。これらはこのタイプの動物です（スライド参照）。
• 次にいきます。中脳です。私達の感情である喜怒哀楽を司ります。
• 脳の一番上の部分は脳の中では新しい部位です。2億年前に進化しました。これには、前頭前野皮質およびその最上層に新皮質が含まれています。それが他のものの上に、そして最後の2〜400万年の間に構造化されていると想像してください。脳のこの部分は3回成長し、最後の3万年後に再び縮小し始めました（それがなぜかは明らかになっていません）。

ポイントは、脳で起こっている変化は何千年、何百万年の間に起こっているということです。これは、論理、会話、文章、他の人とのコミュニケーションを制御している部位です。これは、前頭前野を有する動物です（スライド参照）。ゾウ、イルカ、サルなどの哺乳類が持っていますが、人間にとっては、この部位が最も発達しています。

ソフトウェアの作成者や設計者として、利益を受けるのは、脳が働く仕組みを理解し、まだ古い部分が残っていることを覚えておくことです。前頭前野は言語と文字でのコミュニケーションを理解する部分です。脳の古い部分はまだそこにありますが、文字のコミュニケーションを「理解しません」。

あなたがスカイダイビングをやったことがあるなら、これがどういう感覚なのか分かると思います。あなたは縁に立っていて、行くと言っていますが、行かないとも思っています。脳の古い部分は、あなたが安全であると理解していないため、それらの間の緊張です。あなたはまだ恐れがあります。あなたはまだ不安を抱えており、決して去ることはありません。

私たちがデザインするときには、これらの部分や、脳の各部分とどのようにコミュニケーションしているかを理解することが重要です。

静的な人間の心 (07:53)

静的になる脳の特徴があります。変わることはないし、遅くてもそれが問題になるほど、すぐには変わりません。

視野 (08:12)

私たちが見るもの、今見ていることは、いつもどんな姿に見えるかです。これは、アプリケーションを構築する際に重要です。視野のためにデザインする方法は、よりよくコミュニケーションするのに役立ちます。

視野はコントラストに最適化され、色には最適化されません。このオレンジの点が全く同じ色に見えると思いますが、背景が異なるために、(違う色合いに)違って見えます。よく見ているのがコントラストです。色ではありません。

面白いことに、この部屋の誰もが60歳になるまでに、あなたは20歳で見たのと同じものを見るために、あなたの目は角膜を通って入るのに3倍の光を必要とします。

デザインを始めるにあたって、私たちにはより多くの年寄りのユーザーがいることを覚えておく必要があります。私たちは20歳の基準でデザインする傾向があります。

周辺視野 (09:16)

私たちの周辺視野は良くないです。まっすぐ前を見ることはできますが、側面と周辺になると、よく見えません。なぜか視野の端でバナーが点滅していたり、アイコンが点滅していて、うざったい思ったことがあるでしょうか。周辺視野はよくないとしても、動きを検出するのは良いことです。なぜなら、周辺視野は検出するのが最も重要だからです。

画面の横に気を散らすと、それに慣れて、無視し始めます。周辺に何か重要なものを表示したとしても、気づかなかったり、放置したりします。人口の一定の割合でそれに慣れておらず、いらいらさせ続けます。

視覚のデザイン (10:10)

コンテキストのためにテキストと背景を最適化することが重要です。可読性に影響します。究極のコントラストから離れていくと、可読性に影響を与えます。超濃いグレーや非常に濃いグレーであれば気にしません（LEGO Movie in Batmanのように）。

複数のユニットカラーも、特に周辺部では見づらいものです。細いもの、すなわち色が薄いテキスト、小さなオブジェクト、色付きでコントラストがほとんどないアイコンなどは、この影響を受けます。

周辺のモーションを使用するときに、周辺に何かを表示する必要がある場合は、必要なときに限り、控えめに行うようにしてください。「だめだ、行くな、とまれ」と認識させるのに赤色を使うのと同じように。

記憶 (11:08)

記憶は頼りになりません。

私たちが何かを覚えているとき、脳はそれを引き出し、パズルピースのようにまとめます。なぜなら、記憶は脳のすべての異なる部分にあり、それを元に戻して再び保存するからです。あなたが思い出すたびに、それは書き直されており、想起している文脈の影響を受けています。本当に良いと感じたら、または本当に悪いと感じたら、それは記憶に影響します。

思い出すのは（あなたが子供の時に乗算表を記憶するのにどれくらいの時間がかかるか考えると）難しいです。あなたが人に会ったとき、顔、人物、文脈を覚えているが、名前は覚えていないようにです。そして会った人は自分の名前を言います。心の中で「知っていたのに、どうして知らなかったのか？」と思います。思い出すのが難しいからです。

あなたは物事を認識するように作られています。認識は簡単です。なので私たちは写真を撮り、スクラップブックを作り、記念品を集めようと思っています。思い出しやすくするからです。

記憶のデザイン (12:25)

ユーザーが何かを読めるようにしているアプリを作成している場合は、常に読んだところまで戻す必要があります。小さなことですが、大きな違いがあります。 「完了」と「未完了」を視覚的に区別します。検索エンジンはこれを常に行っていますが、忘れる傾向があります。これらは古くて、試された真のテクニックです。

脳はまたゴールに焦点を当てています。私たちがあるゴールを念頭に置いているとき、私たちは周辺の他のすべてを無視する傾向があります。それはゴールには関係ありません。これを見ると（スライドを見てください）、これを説明していることの1つは、明るさの変化です。この2枚の写真を見たとき、その違いは何でしょう。 1つありますが、見つけるのは簡単ではありません。私たちは周辺視野が悪いので、とても時間がかかります。人がゴールに集中しているとき、そのゴールについて考えるだけです。

思考のデザイン (13:31)

ユーザにタスクを理解させるのは簡単です。そしてゴールに関係のないものは使われません。何か必要なことをする前に何かを尋ねるアプリを使ったことがあれば、これがそのコンセプトです。たとえば、何かをチェックしたり、支払いプロセスを完了する前に、ユーザーにログインをさせたり、アカウントを作らせたりするアプリです。これはまったく同じことです。

プラスチックのような心 (14:00)

心はどのように変わるのでしょう。脳はパターン認識マシンです。たとえば、これらの写真（スライドを参照）では、顔に気づかずにはいられません（顔だと認識するように配置されています）。

パターンを使用してデザインすることについて考慮すべきことの1つは、どのパターンが表示され、どのパターンが表示されないかです。または、どのパターンが認識可能であり、どのパターンが認識可能でないか。例えば、スイッチ、トグルスイッチは物理世界に存在しており、我々はそれを（電気のスイッチなどに）いつも使います。

しかし、ハンバーガーのメニューのようなもの（この議論にはかなりの時間が費やされています）は、理解できるものではありません。時間の経過とともに、だんだん理解できるようにになります。さらに時間が経つと、人々はハンバーガーのメニューが何であるかを理解することに慣れてきます。

これらの2つの違いを理解し、それに応じて使い分けることが重要です。簡単に認識できるように、認識可能なパターンをメタファとして使用できます。

パターンのデザイン (14:21)

物理世界に存在するパターンを取って適応します。時が経つにつれて、ボタンやアイコンを進化させることができます。大規模なユーザーベースを持っている場合や、多くのユーザーがアプリを使用している場合は、ゆっくりと変更させるでしょうし、ユーザーはそれに慣れます。

また、視覚言語で深さを作ることもできます。フラットデザインは新しいものですが、我々は触覚を持っています。私たちは世界を3次元的に体験するために進化してきました。ある程度の深さがあれば、より良い画面を見たり読むことができます。（よりよく理解させるには）ボタンを押す必要があるように見せる必要があります。

ミラーニューロン (16:06)

これに関する興味深いディベートがなされています。

誰かが何かをするのを見ると、私たちの脳は何かをしている人と同じパターンを行います。これが模倣という学習方法です。誰かが何かをしているのを見たり、例を見るのがおそらくベストな方法です。どうやって学習のためのデザインをしますか？私たちは語るよりむしろ、例と共に見せることができます。

コンテキストから始めてください。顧客やユーザーが、あなたがデザインしたアプリを使い始めたとき、最初に全体の構造について知る必要がありますか？彼らがそれを見ても、意味ないでしょう。あなたがその細部から始めるならば、人々が物事を覚えておくためのコンテキストはありません。それは彼らにとって何も意味しません。適切なタイミングに適切な情報を与えます。

学習のデザイン (16:35)

経験と反復による学習は、私たちが学ぶ最も良い方法です。人間は世界をある意味で解釈しており、世界を解釈する方法については変わることはありません。

私たちの視力が改善されるまでには何千年もかかるでしょう。脳の特定部分が進化する数千年前です。たぶん、私たちは周辺の動きにあまり反応しませんが、我々はパターンを認識する能力を進化させるでしょう。

思考や視覚が最適化されたUIの世界の想像 (17:08)

この話の私の目的は、人間をシステムとして考え始めるための好奇心を伝えること、私たちが持っているハードウェアを、私たちがデザインしなければならないものとして考え始めることです。それはトップレイヤーではありません。それは完全に視覚的な美学に関するものではありません。デザインにはもっと多くのことがあります。あなたが好奇心を持っていて、人間の脳について、デザインが機能する方法をもっと学ぶなら、もっとたくさんのことができます。

製品に触れる者は誰でもそれをデザインしています。あなたが行っている決定は、人々があなたが構築したものをどのように認識するかに影響します。それが何であるか分かっているなら、その長所と短所をデザインできるに違いありません。