GUIから学ぶ世界との接し方
こんにちは。UIデザインが楽しい木村です。
いつのまにか2019年も終わろうとしているので、自分が考えていたことなどを簡単にまとめておこうと思います。
自分の思考を整理することを主目的に書くので、軽い気持ちで読んでいただき、各々が改めて考えて、議論するきっかけになれば嬉しいです。
(このnoteは PLAID Advent Calendar 2019 の12日目の記事です。)
・・・
接点なしには生きられない
私達はこの世界で、あらゆるヒト・モノ・コトと"接点"を持ち、やりとりをしながら生きています。
家族に連絡する、パートナーと話す、会社の同僚に相談する、ペットと散歩する、車に乗る、山に登る、椅子に座る、風を受ける・・・などなど
また、物理的なモノだけでなく、頭の中にもった考えや感情でさえ主体(subject)である「考えている側」と客体(object)である「考えられている側」でたしかに接点が存在します。
そう考えると、私達はどれだけ孤独に生きていようと、あらゆる"接点(=インターフェース)"を常に持っていて、主体(subject)だけで生きているわけではないことがわかります。
同時に、私達が抱えるほとんどの問題はこの"接点"にあることにも気づきます。
・相手の考えが理解できない
・恐怖と不安が拭えない
・モノの構造や仕組みがわからない
・怒りが収まらない
・原因がわからない
・・・
このような逃れられない"接点"の問題をどう解いていけばいいのでしょう・・・。
GUIが教えてくれること
今日、多くの人が触れる機会が増えてイメージしやすい"接点"といえば、WebやアプリなどのGUI(グラフィカルユーザインタフェース)ではないでしょうか。
スマホやパソコンの画面の中で、まるで現実世界のようにビジュアライズされたあらゆる対象(object)に直感的に働きかけ、自由に情報やシステムにアクセスできるGUIは、極めて理解しやすい"接点"の1つです。
そのため、よくできたGUIは「私達がヒト・モノ・コトをどう捉え、どう向き合うべきか」という"接点"の問題を解くためのヒントを教えてくれます。
それもそのはずで、そもそもGUIは表現モデルをユーザーの脳内モデルに可能な限り一致させることを目指してつくられているのです。
(Goodpatchさんの以下の記事は表現モデルや脳内モデルについてわかりやすく説明されていてとても参考になります)
要は、人間が対象(object)をどう捉えて、どう向き合っているかを科学し、わかりやすくシステムや表現に落としたものがGUIなわけです。
(GUIやその基本思想であるOOUIについて詳しくはソシオメディアさんの以下の記事がとても参考になります)
そのGUIをリバースエンジニアリング的なアプローチで紐解いてみると、私達がヒト・モノ・コトをどう捉え、どう向き合っているかをシンプルな"型"として知ることができ、私達の抱える"接点"での問題を解くヒントになるのではないかと考えました。
今回はその中でも基本的な2つに絞って紹介します。
1. 対象との距離を変える
着目したGUIの1つ目の特徴は「対象(object)との距離」です。
だいたいのGUIの表現パターンには、対象ごとに「一覧(コレクション)」と「詳細(シングル)」が用意されています。
コレクション：ひとつのビューの中に同種のオブジェクトを複数並べて表示するもの
シングル：ひとつのビューでオブジェクトひとつ分を表示するもの
これは現実世界で対象から遠のくと全体が見え、近づくと詳細が見えてくるのと同じです。
(有名なイームズ夫妻の「Powes of Ten」も面白いですよね)
それぞれをもう少し噛み砕くと、以下のように言い換えられると思います。
引きの視点：対象との距離を伸ばすことで、見える範囲を広めて対象の全体感や対象同士の関係性を捉える
寄りの視点：対象との距離を縮めることで、見える範囲を狭めて対象を細かく分解して捉える
これらを具体的なできごとで考えてみます。
引きの視点：
・動画ストリーミングサービスで映画を見ようと思ったが、作品数が多く、いろいろ比較してばかりでなかなか選べない
・事業計画書やKPI設計をしたら自分の仕事が会社や事業のどんな成果につながって、どんなお客さんのためになっているのかがわかった
・自分の過去を振り返るとどんなときにモチベーションを高く保てていたかがわかった
・自分と他者をすぐに比較してしまう
・太郎くんは、真核生物, 動物界, 真正後生動物亜界, 左右相称動物, 新口動物上門, 脊索動物門, 脊椎動物亜門, 四肢動物上綱, 哺乳綱, 真獣下綱, 真主齧上目, 真主獣大目, 霊長目, 直鼻猿亜目, 真猿亜目, 狭鼻下目, ヒト上科, ヒト科, ヒト亜科, ヒト族, ヒト亜族, ヒト属, ヒトだ
寄りの視点：
・毎日白いTシャツを着るようになったら、生地感とシルエットにこだわるようになる
・ペットの犬が同じ犬種の中でも見分けがつくようになる
・自分の作業だけに打ち込みすぎて、チームの連携ができなくなる
・友達と仲良くなってわざわざ言わなくても伝わる部分が多くなる
それぞれの視点にいい部分と悪い部分があるので、優れたGUIのように今自分がどの距離で対象を捉えているかを理解し、自由に引いたり寄ったりできると何か問題が解決して次に進めるかもしれません。
2. 対象を見る軸を変える
次に着目したGUIの特徴は「対象(object)を見る軸」です。
GUIでよく見られるパーツにSegmented ControlやTabというものがあり、対象をいくつかの切り口で分けて切り替えて見ることができます。
これらは基本的には1つの対象のある側面に焦点を当て、いくつかの細かな対象に分解して整理し扱いやすくすることができます。
ここでのポイントは、「どのような軸で対象を分解するか」です。
分解するということが文字通り「分かる」ことに繋がり、分解の仕方次第で対象をどう捉えるかがほぼ決まると言っても過言ではありません。
「〇〇(対象)は〇〇だ」と決めつけや思い込みがある場合、この"見る軸"を認識できておらず意図せず固定化してしまっている可能性があります。
具体例で考えてみます。
【太郎くん(架空)という人物をいろんな軸で見てみる】
見た目：
・太郎くんは金髪
・太郎くんは身長が180cm
・太郎くんはいつも笑ってる
・太郎くんは猫背
性格：
・太郎くんは家族にとってもやさしい
・太郎くんは会社ではとても厳しい
・太郎くんは人見知り
・太郎くんは細かいことが気になる
金銭：
・太郎くんは貯金が1000万ある
・太郎くんはほとんどクレジットカード払い
・太郎くんは生活費を抑えている
・太郎くんは浪費家
人体：
・太郎くんは目の間が3cm
・太郎くんはウエストが77cm
・太郎くんは毛穴が5,210,419個
・太郎くんは37,000,000,000,000個の細胞でできている
過去：
・太郎くんは3歳のときからピアノを習い始めた
・太郎くんは14歳で家出をした
・太郎くんは20歳から工場で働き出した
・太郎くんは24歳でバックパッカーで世界20ヶ国を回った
・太郎くんは26歳で宝くじがあたった
このように1つの対象でもあらゆる軸で見ていくことができます。
優れたGUIのように目的に合わせてその対象をどのような側面から分解して見るかをいつでも切り替えられると新たな気付きが得られるかもしれません。
世界とどう接するか
上記2つを組み合わせた例も考えてみます。
【キャリアプランを考える】
・いろんなキャリアを調べて、全体感や関係性を探る(引きの視点)
・気になる1つのキャリアを詳しく調べてみる(寄りの視点)
・価値観、理想像、スキル、報酬、業界などあらゆる側面から見てみる(見る軸を変える)
ここまで読んでいただいてわかる通り、上記2つは非常に一般的な原則で、「(あることについて)考える」という行為そのものです。
故に、ほとんどの場合その事自体を客体として捉えることを忘れてしまいがちで、それによって問題に直面していることがあります。
優れたGUIが知らず知らずにそれを客観視させてくれ、非常にシンプルにアイデアを与えてくれるように、私達も頭の中に「考え」の構造をイメージすることが大事だと気づかされます。
なにか問題にあたったとき、改めてこの大原則となる"世界との接し方"を考え直してみることが良さそうです。
・・・
PLAID Advent Calendar 2019 の次(13日目)の記事は、デザイナーのtomoさんの素敵な振り返り記事です！🎉
サポートいただけたら、また発信できるように、本など買っていっぱいinputします！