ソフトウェアエンジニアが CIID の IDP コース（2週目）に参加して学んだことをゆるりと共有します。今週（3/2~3/6）は CIID のインタラクションデザイン（IXD）の基本を学ぶ週でした。
I wrote this article in English as well.
1週目の記事もあるので良かったら読んでみてください。
Day 6: What is IXD?
インタラクションデザインは CIID （Copenhagen Institute of Interaction Design）の名前に組み込むほど、彼らがとても重要視しています。それ故に CIID 独自の考えやプロセスを持っていて、それらを教わりました。まず、初日に「インタラクションデザインとは meaning-making（意味を作ること）」ということ教わりました。これは抽象的すぎるので、「meaning-making」に関連する要素を少し深ぼって説明しようと思います。
３つの問い
CIID には Bill Verplank さんが外来講師として在籍しています。この方の提唱したインタラクションデザインの考え方を CIID は踏襲しています。授業の始めに下記の動画を見せられます。
Bill Verplank さんのインタラクションデザインには下記の3つの問いが存在します。「 How do you do?」、「How do you feel?」、「How do you know?」です。簡単に説明すると、ある製品に対して「ユーザーは何をするのか？」。そして、ある製品に何かをした後に「何を感じるのか？」。最後に、ある製品から何かを感じた後に「何を学ぶのか？」。という3つの問いです。この3つの問いを通して、ユーザーと製品との間にコミュニケーションが生まれることが重要だと教わりました。さらに、このループを通して「ユーザーがどう考えるかをデザインする」ことが「meaning-making」であり、「インタラクションデザイン」だと教わりました。
この週は1週間を通して1つのプロトタイプを作ったのですが、この考え方は言うは易く行うは難しでした。それを少しでも簡単にしてくれたのが次の言葉だと思います。
Tangible
とにかくこの 「Tangible」という単語を連呼してきます。日本語では「触れて感知できる」や「目に見える」という意味になります。正直、週の最初にこれを言われて、文字通り以上のことを理解することが出来ませんでした。しかし、この単語の一番重要な要素は、「存在する」ということだと感じています。
この週は「ある環境で暮らす人の生活と自然とを繋げるインタラクティブな製品をデザインする」というお題を渡されました。このお題に対して、月曜と火曜は「自分たちが何をデザインするのか」ということ議論していました。付箋に書き出して面白そうなトピックを探したり、絵に書いてそれぞれのアイディアを吟味しあっていました。しかし、水曜と木曜に実際にプロトタイプを作って、実物を目の前にすると「これってユーザーはどう使うか理解できないのでは？」や「このフィードバックではユーザーは僕たちの意図を理解できなくないのでは？」など多くの改善点が見えてきました。
おそらく先週教わった CIID の文化の「Prototype」と根底は通じていると思いますが、「Tangible（存在する）」ということはインタラクションをデザインする際に強力な学習法のひとつなのだなと学びました。
習慣に注目する
先週で「問いに集中する」ことの重要性を学んだので、この週で一番最初にやったことは、自分たちが解決する問いの設定から始めました。前述の通り今週のお題は「ある環境で暮らす人の生活と自然とを繋げるインタラクティブな製品をデザインする」でした。このお題はあまりにも抽象的すぎるので、より具体的になるように下記のフレームワークを使いました。
How might we 「do something（デザインすること）」
for 「type of people（ユーザー）」
in 「context（利用状況）」
that 「goal/intent/feelings（結果）」?
このフレームワークは、穴埋め問題のようなものでそれぞれの括弧を埋めて自分たちの問いを作るというものです。最初、僕たちのチームはこのフレームワークのそれぞれの括弧に対して、ブレインストーミングを行い失敗してしまいました。失敗の問いが下記です。
How might we design a airplane
for long flight travelers
in the airplane
that makes them feel relaxed?
僕らは最初ユーザーの環境（コンテキスト）と感情のみに注目して問いを作ってしまいました。しかし、これでは空間のデザインになってしまい、do, feel, know のループする要素が少なくなってしまいました。そこで先生に言われたのは、「習慣の要素がない」ということでした。更に「インタラクションデザインとは習慣のデザインであり、習慣の改善である」と教わりました。そこで、僕たちはお互いの習慣についてインタビューをしあって、僕たちは部屋に引きこもりがちだあること気づきました。そこで、「部屋に引きこもりがちである」という習慣を変えるような問いを作りました。
How might we decrease the separation between private spaces and natural world
for isolated people
living in cities
so that they feel less disconnected?
「都会に住む孤独な人たちの疎外感が少なくなるように、プライベートな空間と自然との隔たりを少なくするにはどうするか？」という問いに決めました。この段階では気づかなかったですけど、習慣に注目した問いは後で、ロールプレイする時にとても大切だということが分かりました。
Day 7: IXD Process
この日は CIID のインタラクションデザインのフレームワークを学びました。これも Bill Verplank さんの作ったフレームワークで、理解するのがとても大変でした。しかし、理解するとデザイン対象をシンプルに考えられるのですごい有用でした。（まだ完全に理解できたか不明ですが…）
簡単に説明するとインタラクションデザインには4つの層になっていて、8つの要素に分解できるということです。4つの層は、「Motivation（動機）」、「Meaning（意味づけ）」、「Modes（手段）」、「Mapping（インタラクション）」です。8つの要素は「Idea（理想の状態）」、「Error（課題）」、「Metaphor（メタファー）」、「Scenario（コンテキスト）」、「Model（機能）」、「Task（タスク）」、「Display（アウトプット）」、「Control（インプット）」です。詳しい説明は下記の記事に譲ります。
授業では下記のピアノ動画を見て8つの要素の説明を受けました。
ピアノの例をフレームワークに落とし込むと下記の感じになると思います。
Idea: 自らすすんで階段を使うようになる
Error: エレベーターの前に常に大勢の列がある
Metaphor: ピアノをひく
Scenario: 花子さんが学校帰りの夕方に電車に乗っている
Model: 鍵盤
Task: 階段をのぼる
Display: 音を出す
Control: 階段を踏む
8つの要素の中で理解が難しかった「Metaphor（メタファー）」、「Model（機能）」について詳しく説明しようと思います。
Metaphor は解決の糸口
メタファーとは「隠喩」という意味です。最初に僕たちのチームが誤解をしたのは、Metaphor をそのまま体験の中心においてしまったことです。僕たちは、「自然」にまつわる道具や娯楽をブレインストーミングしました。そして、僕たちはそのブレインストーミングをした Metaphor をそのままソリューションにしようとしてました。簡単に説明すると、僕たちのチームは Metaphor として「釣り」を選んだんですけど、ユーザーを「釣り」を使って自然を感じさせる習慣を考えていました。これを見かねた先生は「釣りの何が楽しいのかよく考えろ」と言ってくれました。そして、僕たちは釣りが楽しいのは「何が引っかかってるか分からない未知との遭遇」と「釣り糸を垂らして待っているの禅の時間」であると考えました。この2つの要素を僕たちの体験の中心におくことにしました。
最初は全く分からなかったですがこの2つの要素がまさに Metaphor であるんだろうなと今は感じています。複雑な問題を正面から解き明かすのは気が折れることだと思います。しかし、この複雑な問題を身近なイメージに落とし込むことで、解決の糸口を見つけているのだと思います。つまり、釣りが楽しいのは「何が引っかかってるか分からない未知との遭遇」と「釣り糸を垂らして待っているの禅の時間」なのだから、これを応用してあげれば僕らの問いにも適用できるのだろうということです。
下記の記事はフレームワークが違いますが、Metaphor の理解に役立ちました。
Model は体験を想起させる要素
Model は Metaphor の更に噛み砕いたものです。そして、その Model を通して Task, Display, Control をデザインして行きます。最初、僕たちのチームは「釣り」の要素をかなり狭く見ていました。「釣り糸を投げる」、「釣り糸を垂らす」などのような感じです。しかし、先生と話していると Model はもっと広くて良いのだなと感じました。例えば、「釣り」の要素として単に「釣り糸を投げる」とするのではなく、「狙った場所に釣り糸を投げる」のようにしても良いと思いました。こう考えると、いろいろ考えることが出来て、「大物を取れるように特別な餌をつける」みたいなことも考えられます。ここの Model が具体的になっていればいるほど、Task, Display, Control の設計がより解像度を高くしてできるのかなと思います。
ただ注意しなければならないのは、ここであまりにも「釣り」しか想像できない Model になると、プロトタイプしている時に「釣り竿」しか作れなくなります。そうなってしまったら、この Model に戻って要素を減らすか、抽象度を上げるようにしたら良いと思います。
下記に僕たちの考えた8つの要素を示しておきます。
Idea: 自然を感じることができる
Error: 自分の生活空間と自然が隔絶されている
Metaphor: 釣り
Scenario: 仕事で嫌なことがあって、寝る前に自分の部屋のベッドでゴロゴロしている
Model: 釣り糸を狙って投げる, 獲物を待つ, 釣り糸を引く
Task: 振る -> 引く -> 選ぶ -> 捨てる
Display: カタカタと振動する, 何かが引っかかった音がする
Control: 振る、引く、強く振る
フィードバックを考えるの楽しい
ちょっと余談ですが、Laban Movement というフレームワークを教わりました。授業内では息抜きのワークショップとして紹介されたのですが、僕は楽しかったので紹介しようと思います。これはもともとダンスの感情表現をフレームワーク化したもので、それをデザインに適用しようとしている人たちがいるようです。下記に記事を載せておきます。
簡単に説明すると、何か行動の「Space（ペース）」、「 Time（スピード）」、「 Weight（重さ）」をそれぞれ変えることで、人がどう感じるかを実験しています。授業では、それぞれを変えながら「歩く」ということをしました。更に、授業では「ここをオフィスだと思って歩け」という「コンテキスト」も付加して、自分が「どう感じるのか」、「どういう状況を思い出すのか」ということを考えさせられました。
このワークショップの動画を後から見返すと奇妙でしかありません。ただ、「自分がオフィスで悩んでいる時は一定のペースで、直線的にゆっくり歩いているんだなぁ」というのを歩いてるだけで思い出せました。自分の歩き方次第で想像されれる感情が変わるのは面白かったです。ちょっと飛躍して考えていますが、こんな感じで与えられた条件とコンテキストから想起された感情がフィードバックであり How do you feel? の部分なのかなと思いました。そして、その条件とコンテキストを使ってフィードバックを設計して上げるのが良いんだろうなと思いました。
Day 8: IXD Prototype
この日から、実際にプロトタイプを作るようなりました。先週はプロトタイプする時間は3〜4時間ぐらいしかなかったのに、今週は2日間あったので僕はすごい楽しかったです。まだ小学生の図工レベルですがこのレベルでも多くのこと学べたと思います。実際に作ってみることで、議論では分からなかった課題が、より鮮明になりました。
プロトタイプするまで何もリアルでない
これは先程の Tangible のところでも触れましたが、プロトタイプするとこのことをすごく感じました。わざわざユーザーに使ってもらうまでもなく、How do you do?, How do you feel?, How do you know? の3つの問いに照らし合わせるだけで、十分改善点が得られてたと思います。
「誰のためのデザイン」を読んでアフォーダンスとシグニファイアは理解しているつもりでした。しかし、自分たちが作っているものがいかにアフォーダンスがないのかというのに気付かされます。アフォーダンスがないと、そもそも How do you do? の部分で止まってしまいます。また、実際にものがあると、チーム内で実際に動かしながら自分たちで声を出して フィードバックを付け加わえたりできます。このフィードバックに対してみんなで How do you feel? と議論していきました。そして、3つの問いを整理してインタラクションを把握するために、下記の画像のようにスプレッドシートにそれぞれのタスク時に、ユーザーが「何をして」「何を感じて」「何を学ぶ」のかを時系列に並べて一覧化しました。そして、それぞれの do, feel, know を最適化するためにプロトタイプの作り込みを行いました。
更に、注意しなければならない部分であり、面白い部分でもあるなと感じたのは、自分たちのバイアスでした。自分たちは製作者なので、プロトタイプのことは全て知っています。しかし、クラスメイトに渡して使ってもらうと、全然想像と違う使い方をしました。ハンドル部分を持って、胴体をハンマーのように振り回したの見た時に、アフォーダンスって本当に大切なんだなと実感しました。
ロールプレイできる？
ある程度プロトタイプが出来て、チームにもなんとなく満足感が出てきた時に、先生に「そのプロトタイプを使ってロールプレイした動画をとれる？」って聞かれました。それから、僕たちはどんなシーンが必要なのかと下記のようにストーリーテーリングを行いました。
この時に、インタラクションのデザインにおいて「習慣」に注目するのが大切なのだなと実感しました。僕らのチームには習慣に基づいてフレームワークの Scenario を組んでいたので、このストーリテーリングは結構早めに出来ました。習慣に基づいているとコンテキストが想像しやすくなり、ユーザーの絞り込みもチームの合意を取るのが簡単だったなと思います。もし、最初に思いついて飛行機のデザインを行っていたら、コンテキストの絞り込みが大変だったなと思います。
ただ、面白かったのが、ストーリテーリングを終わらせて実際に動画を撮影しだした後でした。実際の状況を作り出しながら撮影していると、「この状況でこの使い方するの変じゃない？」とか「こんな暗い場所でこのフィードバックは弱くない？」みたな議論に発展しました。このように、実際の状況を想定してロールプレイしてみると多くの課題点が見えてきました。やはり製品というのは、それ自体では完結するのではなくコンテキストがあって成立するのだなと改めて実感することが出来ました。
ちょっと余談ですが、デザインを「習慣」にすることでこのようなロールプレイも簡単だし、自分の身近で完結するので改善早いなと思いました。逆に、飛行機や映画のような特別な体験をデザインしてる人たちはどのような方法でデザインしてるのか気になりました。
Day 9: Polish Interaction
発表前日のこの日は、インタラクションの作り込みに専念しました。前日のインタラクションの表を作り込んだり、ロールプレイの精度を上げて最終発表用の本番を作成したりしました。そこで先生に言われたアドバイスを紹介しようと思います。
立ち止まるな
正直、僕たちのチームは自分たちの出来栄えに満足感してる感じはあったと思います。後は、最終発表に向けて微修正で行けるんじゃないかなって雰囲気はあったと思います。少なくとも僕はそう感じていました。そうした中、それを察したのか先生がやってきて、「Keep moving！ Push forward！」と言って来ました。「とにかく立ち止まらないで前に進め！」ってことです。この言葉を聞いて僕たちは、もう一度自分たちのプロトタイプを確認しました。何か抜けてる観点はないのかということを探すために、自分たちでもう一度プロトタイプを使ったり、それぞれのインタラクションの意味を確認し合いました。そこでもう一度「釣り」という Metaphor に立ち戻って、それぞれのインタラクションが「釣り」の何を表しているのかを議論しました。
僕らのプロダクトは「世界の自然の風景を釣りみたいに集める」というコンセプトを持っていました。そして、チーム内で「集めた風景を魚みたいに水槽にいれて保存するのはどうだろうか」と考えました。実際にこのアイディアは採用されて、最終のプロトタイプは蓋を付け加えたものになりました。
先生の「立ち止まるな」という言葉の意味を体現できたかはわからないですが、面白いアイディアを最終のプロトタイプに組み込めたなと思いました。時間がある限りはプロトタイプを触って、試してを繰り返す。そして、アイディアが煮詰まったら、一つレイヤーを上げて更にインスピレーションを得る。最後まで Tangible であれば、なにか改善点が出てくるのかなと思いました。
作り込みすぎるな
最初、僕たちは前述の「立ち止まるな」を誤解していました。僕らは フィードバックの音をリアルにすることを考えて、よりリアルな効果音探しを行っていました。そしたら、先生がやってきて「部分最適は後で良い。全体の最適を確認しなさい。」と言ってくれました。結局、効果音は人が口で出せば十分という判断になり、もう一度ストーリテーリングに立ち返ったり、プロトタイプのテストを行ったりしていました。
正直、これは日本で働いてた時にも意識していたことですが、完全に忘れて個別の作り込みを行っていました。実際に最後の発表でロールプレイした動画を流したのですが、効果音は口で十分だったし、だれもそんなこと気にしていなかったと思います。この段階で重要なのは、ストーリーの辻褄が合っていることとプロトタイプがそのコンテキストに馴染んでいることだと思いました。
Day 10: Presentation
この日は今週のプロジェクトの発表の日でした。僕たちは「Scene Fisher」というプロトタイプを作りました。合計4つのプロトタイプを作りました。そのプロトタイプ写真と発表資料を下記に載せておきます。（動画は権限の関係で見せられませんでした…すみません…）
今週はプロトタイプを作ってる時間が長く取れたのですごい楽しかったです。また、チーム内で前回よりも話せたし、貢献できることが多くて良いチームだったなと感じています。（話せることが目標なのはかなり目標が低いですが）今回のフレームワークを使って今後プロトタイプを作っていくので、今週はとても重要な週だったと思います。
来週は電気回路の授業なので、よりテクニカルな授業になると思います。よりテクノロジーとデザインの融合を体現できることが今から楽しみです。テクノロジーを使って早く Tangible なものを作りたいと思っています！
3週目の記事もあるので良かったら読んでみてください。