WKWK morning #05_Affordance-DESIGN

WKWK morning #05_Affordance-DESIGN

  1. アフォーダンスの復習
  2. Webサービス・アプリにおけるアフォーダンスの考え方
  3. じゃあ、どう考えるのがよいのか。

アフォーダンス理論について

物質の形状を、あらゆる概念を取り除いた状態における動物心理学形態学の理論 / 参考資料:D.A.ノーマン『誰のためのデザイン? — 認知科学者のデザイン原論』
Webデザインこそアフォーダンスが大きく影響するのではないか。テクノロジーの進化に人間が適応していかなければならない。

しかし、本来ならば人間のためのテクノロジーであるはず。
テクノロジー ーデザイン 人間
デザインはテクノロジーとの「人間の橋渡し」としての役割を持つ。

アフォーダンスの欠けたデザインの実例

アフォーダンス思考が欠けているデザインはこうも人間を混乱させる。

  1. 電子レンジ
    ある電子レンジのボタンデザインがわかりづらかった。 電子レンジで果たす人間の目的は「温めること」。それにも関わらず、最も使用されるであろう「あたため」ボタン以上に、詳細設定やカテゴリ別のあたためボタンに不必要なカラー設定(赤、青、緑、黄)があり、目立つ。本当に重要かどうか疑問である。
  2. 洗濯機
    ある洗濯機のボタン設計も同じくわかりづらいものだ。ボタンとそこに適応する洗濯種類についてテキストの位置が隣のボタンと区別がしづらくなっている。ボタンを押す前に考える時間が必要である。
  3. アプリ
    あるアプリはこんな感じだった。会員登録の入力フォームに入力しようとしたところ、予測変換が表示されたが、予測変換に表示されたものと実際クリックして表示されたものが一致しているようでしていない。
    また生年月日の入力フォームでは、フリーテキストの形に見せて、画面下にドラムロールが表示されそこで選ぶようだった。その後もマイク許可設定のポップアップも、キャンセル時に不必要にメッセージが登場しイラつかせ、ワードも統一されていないなど概念難易度が高い。
    Webサイトのデザインもひどいものだ。TOPのメイン画面にスクロールのアローがあったので、スクロールしたものの、フッターしか存在しない。導線設計ができていないどころか、わざとなのだろうか。

このようなデザインに触れた感想は、サービス体験を得る以前に使いたくない。

Webサービスにおけるアフォーダンスの思考

サービスは継続して使われる必要がある。
そして、デザイナーは継続して使われるサービスを設計する責任がある。

「継続して使われるサービス」を考える上で、あるサービスの導入に失敗した例を紹介する。

個人的に、機能面、デザイン面、柔軟性に惚れてファンになったプロジェクト管理サービス「Wrike」を会社に導入しようと試みた。
利用する機能の関係で年間契約金3万程度も、交渉のすえ会社に導入することができたが、半年経った今活用できているのは私だけであった。

何がいけなかったのか?
ノーマンの言葉を借りると、使う人の問題ではなくデザインに問題があるため、という。個人的にはそのデザインはわかりやすく整理されていると感じていたが、サービスを使いながらのプロジェクト管理に慣れていないメンバーにとっては複雑だった。そのデザインが混乱させている。

・使用している管理ツールとは違う、見慣れないUI
・高機能(すぎる)
・現状と完了後のタスク量がぱっと見でわかりにくい
・習慣を変えてまで利用する強烈なメリットを感じられていない

この経験から逆転の発想をしてみると、デザインする側として有効活用することはできるだろうか。本来使われるべきユーザーにきちんとマッチしているかが考慮すべきポイント。

特にWrikeは学習コストが少々高い。高機能すぎるゆえに、ツールを活用するためには一つ一つの機能を理解する必要があり、それをクリエイター自身が、多忙な制作業務の最中行うのは非常に負担なのである。使うメリットが伝わりきらないのに、学習コストとしての負荷を受け入れていくのは難しい。慣れ親しんだものに戻ってしまうのはしかたないことである。(結局、Trelloとスプレッドシートに戻ってしまった)

今回、運用に失敗した原因は、メンバー自身が利用するのに抵抗する程度の複雑さがあったこと。そもそもこのサービスの想定ターゲットがプロジェクト管理担当者だった。

私自身、サービスがたとえ高機能であったとしても、使って欲しいユーザーにとって本当に使いやすいのか、ニーズにマッチしてるのかを考えきれてなかった。結果的に価値を感じる前に離れてしまう。実際にサービスがどのように使われるかまでを感じたいい機会だった。

UI/UX設計がきちんと成功しているAppの例

個人的にUI/UXの設計に成功していると感じたアプリを紹介する。

Todoist:タスク管理サービス
note:コンテンツメディア
Wantedly people:名刺管理サービス
カレンダー( iPhone デフォルト)
Aaptiv

など。

良いデザインの条件

個人的に、アフォーダンスの視点で「良いデザイン」の条件はこれだと思う。

・軽い:表示速度
・入力がスムーズ:入力までのハードルの低さとサクサク感
スマホ上の閲覧・操作のしやすさ:移動中の利用が想定されている
シンプルなつくり:なんでもできる、よりもこれができる
フィードバック:エラー通知、タスク完了時のメッセージなど
リマインド:忘れてはいけない情報をテクノロジーに預けて依存したい
連携機能:Slack、Trello、カレンダー情報など普段利用するサービス
UIの美しさ:ストレスを感じないカラーや配置、すぐに使えること
自然なアニメーション:心地よいと感じる、楽しいと感じる操作感

良いデザインのための考え方「デザインの原則」と「あきらめの原則」

デザインの原則
「目に見えるアフォーダンスとシグニファイア」「発見可能性」「フィードバックの即時性」

あきらめの原則
「もしすべてがうまくいかないときには標準化する。可能な解決法が見つからないときには、単にすべてを同じようにデザインすること」

ディスカッション

プレゼン後、みんなでディスカッション。

アフォーダンスとデザイン。理論としては各々が理解していなければいけない。しかし、実務ではこういった理論は全てに応用できないことがある。みんなが同じ前提条件で話すことが難しいが、とても重要なことである。知識やベースをみんなに伝えることが大切で、チームでそれぞれが持っているベースを共通で認識することが必要。

ワクワクの目的は皆で前提条件を揃えることにある。

先日の案件で、クライアントとのやりとりの例。トップビジュアルのデザインをしてくれという依頼を受け、デザインの提案後に、「こうじゃない」と言われた。それを3回ほど繰り返した。

一体なぜそうなってしまったのか。

自分たちが「ユーザー」の定義をしきれていない?

その定義をまずは全員で共有する必要がある。UXをきちんと定義しておくことは、プロジェクトを滞りなく進行させるのが目的。制作メンバーでペルソナの認識がバラバラだと、同じ目線で良い物が作れない。

サービスは、ユーザーが必ずアプリを開いて「明日はこれをやってみよう」と思えて、見てくれないと意味がない。継続して利用する。キーポイントをそこに設定していきたい。

これを実現するためには…
・ストレスのかからない色
・続けるモチベーションを与える色
・続けるモチベーションを与えるUI

ユーザーが勉強しているな、楽しいな、と実感してもらえるところが重要。UIを求められても、UXを考えなければいけないので、UIとUXの境界線は曖昧である。

また、情報の清潔感も大事。各カードの大きさで情報量の大小が大きく左右する。写真の大きさで情報量の操作はかなり誤魔化せるので、そういった考慮も大変重要である。

thank you! I Love you!

またね!