スターバックスアプリのアップデートで気付いたUX
私は普段からスターバックスアプリを使っているのですが、少し前にStarという所謂ポイント制度を導入し、アプリがリニューアルされましたね。
このアプリについてもUX上の良い点、良くない点は職業柄いろいろと気になってしまい、まとめて社内の勉強会で共有したりしていました。
今回アップデートされたことにより、文字が大きくて見やすくなったり、機能が整理されて良い印象だったのですが、先日アプリを使って支払いをしたときに、気になることがありました。
支払い時にスマホを見せてスキャンしてもらうのですが、店員さんの手の角度が何か変。横向きにしてる。
そう、アップデートでバーコードの向きが変わったのでした。
アップデート前後のスクリーンショットを比べてみましょう。
左がアップデート前、右がアップデート後です。
どちらも画面の向きはポートレート、つまり縦向きですが、以前はバーコード表示もそれと同じ方向でした。
ところが、アップデート後は90度回転していて、テキストの向きと合っていません。
バーコード表示が大きくなったから、スキャンしやすいかもしれません。ただ、顧客はスマホを差し出すとき、相手からも見やすいよう、テキストの向きで判断し、縦向きのまま差し出すはずです。
でも、店員はテキストではなくバーコードを読み取る必要があるため、手を90度回転させて読み取らざるをえなくなります。
なんだかやりづらそう。。
向きが変わっただけなので、それほど大きな問題ではないのかもしれませんが、従業員体験、エンプロイーエクスペリエンスをやや低下させるものなのではないでしょうか。
そして、良かれと思って差し出したのに、店員がやりづらそうにしているのを見て少し申し訳なく思ったとしたら、それはUXにも影響を与えていると言えそうです。
考えすぎ？
いずれにしても、ここから私が学んだのは、UXというのは自分自身がアプリやサービスを通して感じる気持ちだけでなく、そこに組み込まれる他者を見て感じる気持ちもあるのだなということ。
サービスデザインの文脈では、従業員体験はビジネス視点で語られることが多いですが、ユーザー視点でも考えてみると気づきが生まれるかも、と思いました。
UX関連記事 (2017/11/13)
最近ドラゴンボールを読んでいます。遥か昔に読んで以来ですが、やはり面白いです。神龍に願いを伝えるとしたら何にしようかな。
さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
「お金を払った感」はどのようにデザインすればよいのか (Goodpatch Blog)
フィードバック全般、特に電子決済時のフィードバックに関する記事です。
アプリやWebサイトに限らず、ユーザーが何かしたときにそれが受理されたか、その結果どうだったかのフィードバックは重要ですが、金銭の動きとなるとフィードバックはさらにシビアにならざるを得ません。
記事にある通り、電子決済であれば、安心感のためにもわかりやすいフィードバックが求められると思います。
その意味では、Edyの決済完了時の「シャリーン」という音は、支払い完了がわかりやすく、ちゃんと物理的なお金も想起しうる、よくできたサウンドデザインなのだと思います。
【OKボタンはダイアログボックスの右側？左側？】適切なボタンの配置について考える (SeleQt)
http://www.seleqt.net/design/why-ok-buttons-in-dialog-boxes-work-best-on-the-right/www.seleqt.net
OKボタンの位置に関する記事です。
視線の移動を少なくする点、「次へ」といった方向性を意識する点は参考になります。
プラットフォームに従うだけでは不十分とのことで、確かに実利用シーンは想定しつつ設計する必要があると思いますが、プラットフォームのルールに従うのも、ユーザーの認知負荷やスリップ（間違えて選択してしまう）を減らすために大事なことだと思います。
ちなみに現状のOKボタンの位置は、Windowsは左側、AndroidやiOSのモバイルは右側、Webはユーザーの利用動向により左側主流から右側主流に移ってきている、という感じでしょうか。
時代遅れのデザインでもAmazonから学びたい、UX設計4つの手法 (WPJ)
Amazonの優れたUXデザインについての記事です。
3番目の「ユーザーアクションの障害をなくす」というのが一番重要で、ここに書かれている以外にも、次ページ表示時、一瞬で表示される設計になっているなど、ユーザーの導線にかなり気が配られていると思います。
で、Amazonのデザインが時代遅れかというと、個人的にはそうは思わないのですが、それは私がUX至上主義に毒されているのか、単にセンスがないだけなのか、いまいちわかりかねます。
人を思いやり、リアルタイムに形を変える横断歩道「Starling Crossing」 (IDEAS FOR GOOD)
未来の横断歩道の実証実験に関する記事です。
交通量に配慮しつつ、人の認知をサポートして事故を抑えるということで、とても優れたUXデザインだと思いました。
日本の場合、横断歩道ではあまり車が止まってくれないので、さほど効果的ではないのかなとも思ってしまいますが、いずれにしても交通事故は身近な危険であり、社会問題でもあります。
車にできること、歩行者にできること、道路などのインフラでできること、それぞれがそれぞれの立場で真剣に考えていく必要がありそうです。
The relationship between design deliverables and presentation skills (uxdesign.cc)
UXデザインの成果物とプレゼンテーションスキルの関係についての記事です。
結論から言うと、この両者は密接に関連しているそうです。すなわち、UXデザインの成果物は重くなる傾向があるため、それ自体の説明と、細部にとらわれないストーリーテリングとのバランスが大事、とのことです。
ただ、UXデザインの成果物を伝えるのが難しいのであれば、それ自体のUXがイケてないような気もします。
私も注意せねばと思いますが、成果物作成の際は常に「どう伝えるか？」を考えながら取り掛かるのが良さそうです。
The iPhone X Is A User Experience Nightmare (Co.Design)
タイトルからしてひどい言われようですが、確かにその要素はあるのかもしれません。
実は私もiPhone Xを買いたいと思っていたクチなのですが、業務の一環で記事中の引用画像に似た資料を作成したところ、ジェスチャーが多すぎて資料が完成する頃には買う気がかなり失われてしまいました。
記事の最後にシンプリシティの話が出てきますが、ボタンがなくなることで複雑さが増すのであれば、それはシンプリシティと呼べないのではと思います。
ただ、重要な点としては、スマートスピーカーが急速に普及する中、音声やジェスチャーといったNUI（ナチュラルユーザーインターフェース）が今後も増えることが予想されます。
きっかけが示しにくく、覚えるという手間も発生することになるNUIに対して、ユーザーの負荷をどう軽減していくか、iPhone Xを機に考えていきたいです。
UX関連記事 (2017/11/6)
週初めだというのに会社の社員証を味噌汁に浸してしまい、ちょっとブルーなスタートを切ることになりました。とりあえず綺麗にはなったので、気持ちを切り替えていきたいものです。
さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
自分の目で見て感じるインプット、始めませんか？ (CrowdWorks Designer Blog)
展覧会など、実際に自分で足を運んで体感することで、仕事に活かせるインスピレーションを得るという記事です。
この週末はちょうどグッドデザイン賞の展示をやっていましたが、そういった場でいろいろなものに触れることの重要性が書かれています。
記事でもいくつかのスポットが紹介されていますが、デザイナーでなくとも、モバイルEXPOなどのイベントや、博物館や美術館といったインプットに適したものは多く存在するので、そういった場を探してみるのも面白そうです。
ケチャップボトルの事例で考えるユーザー体験の評価方法 (UX MILK)
有名なケチャップボトルの話についてです。
ここで言及されている通り、ケチャップが蓋にこびりついてしまう課題は早く解決してほしいところです。
最後のほうでユーザー体験の評価という話が出てきますが、どちらかというとこれらで評価できるのはユーザビリティのような気がします。
UXの評価ということであれば、主観的満足度なども評価対象に含めるとよいように思います。
EVは期待はずれ。東京モーターショーで中島聡が感じた本音 (まぐまぐニュース！)
東京モーターショーに関する記事です。
新旧モデルが混在して伝えたいことがぼやけているのではという指摘など、ユーザー目線からのインプレッションとして、とても優れた内容だと感じました。
EV化の流れは止まらないと思いますが、SKYACTIV-Xのように、既存のエンジンでもできることはまだまだありそうですし、車そのものの進化だけでなく、人が移動するという行為自体の進化も、もっと様々な可能性を見てみたい気がします。
ストーリーボードを使ったUXデザインのためのアイデア発想法とは？ (えそらLLC UX ブログ)
esaura.jp
ストーリーボードの意義や作成方法についての記事です。
かなりのボリュームがあり、参考になります。
ストーリーボードはやはりUIにフォーカスし過ぎず、体験そのものの価値だったり、前後の出来事も可視化できるという点で優れていると思います。
ここに書かれているポイントを踏まえて、とりあえずやってみる、という姿勢がまずは良いかもしれません。
Debunking Common UX Myths With The UX Mythbusters (Creative Cloud blog by Adobe)
巷で聞く「UXの神話」を暴くという記事です。
「UXの神話」は有名なリストで、要はこれらはすべて間違いだということになります。
記事では一番の問題は#34であり、それにより大切な機能が隠されて複雑になっていると述べていますが、確かにそれは大きいように思います。
改めてリンク先の#1～34を眺めてみると思うところがありますが、特に最下段で#0として書かれていること、これも肝に銘じておく必要があると思いました。
31 common UX design problems for monsters (Be Good To Your Users)
ハロウィンということで、いくつかの怪物を例にとり、UXデザインの問題点をまとめています。
ややジョーク記事ということもあり、得るべきこともそれほど多くないのですが、様々な属性のユーザーを考慮する、という意味では有効かもしれません。
最後に「その他の怪物」の一覧が出てきます。日本ではおなじみの貞子が出てきますが、それ以外はちょっとわかりませんでした。。。
UX関連記事 (2017/10/30)
週末ごとに大雨が降りますが、ちょうど地元でハロウィンのイベントがありました。年甲斐もなくかぼちゃのフェイスペイントをして、豪雨の中お菓子をもらいに回るなど、頑張りました。 さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
なぜNetflixのトップページデザインは不親切なのか？ (UX MILK)
Netflixのトップページが他のサービスと異なり、コンテンツの一覧を出していないことに関する記事です。
理由として「ブランド感」が挙げられていますが、伝えたいことを絞っているとも言えそうです。
たくさんのコンテンツがそろっているというのはもはや当然のことで、それ以外の差異化ポイントとしては、このトップページで繰り返し出てくる「いつでもキャンセルできる」という点なのだと思います。
他のサービスもそれぞれ伝えたいことをトップページで体現しているのだと思いますが、それぞれどんな人に対して何を伝えたいのか、考えてみるのも面白そうです。
反面教師としてのダークパターン--課題解決のための UI/UX (ZDNet Japan)
目先の利益を優先することで、ユーザーの意図しない方向にもっていこうとすることをダークパターンと呼びますが、それに関する記事です。
実際のところ世の中にはこの類のUIが非常に多く、私も先日PCソフトのインストール時に一緒にウィルス駆除ソフトをインストールしてしまったようで、いつの間にか動いていて時々顔を出すので、お前がウィルスじゃないか、と言いたくなりました。
問題は、知ってか知らずかその仕組みを世に出してしまうと、後から変えにくいということです。
変えたら収益が落ちる可能性があるし、長期的に見れば必ず利益につながる、という言葉にも確証がないため、社内の説得が大変です。
こういったところをきちんと説明できるような証拠なり事例なりが潤沢にあるとよいなと思います。
音声アシスタントが普及すれば、「人間の脳の能力不足」が問題になってくる (WIRED.jp)
人の脳はマルチタスクに向いていないので、音声アシスタントによる割り込み処理があると何かが抜けてしまうという記事です。
音声アシスタントを使いこなしているという声をあまり聞かないのは、まだできることが発展途上だからという理由が大きいと思いますが、人が使いこなす能力を持っていないとも言えるのかもしれません。
中ほどにリンクのある「見えないゴリラの実験」は、タイトルを書いてしまっているのでネタバレ感がありますが、是非見てみてください。
ユーモアとクソアイデアの境目 (Goodpatch Blog)
自由な社風が伝わってきて微笑ましい記事です。
クソアイデアと言っていますが、決してそんなことはなく、枠にとらわれがちな場合に発想を広げてより良いアイデアを導くことにつながるなど、大事な役割だと言えます。
アニメーションの話が出てきますが、ここで挙げられている以上に無駄なアニメーションが世の中にはびこっているように思います。
The Magic of Flow and Why Dialogs Frustrate People (UX Planet)
「フロー」というのはとても集中している状態を表す心理学の用語です。ダイアログの表示がそれを妨げるものとして、その原因や対策について記載されています。
確認ダイアログなどで、現在行っているタスクが妨げられると、結果タスク完了時間が増大し、かつダイアログ自体に慣れることで、重要度が減っていってしまうということで、なるべく使わないほうがよさそうです。
代替策としてMaterial Designのスナックバーが挙げられていますが、個人的にはスナックバーによる通知も慣れが出てきて見逃してしまう可能性があるように思います。
こういった通知をどこかに溜めておいて、後からUndoできるようになっているとよいと思います。
13 Blank State Examples You Can Use to Improve User Experience During Onboarding (Inter Trends Blog)
サービス開始時に、コンテンツがない表現をどう見せるか、についてまとめた記事です。
たくさんの例が掲載されているので参考になります。
さまざま工夫されていますが、まずはコンテンツが0件であるということを明示し、どうすれば増やせるのか、次に何をすればよいか示すのが良いように思いました。
なお、この記事ではBlank Stateという表現を使っていますが、Empty Stateという表現もときどき見かけます。
UX関連記事 (2017/10/23)
先日は中学校の同窓会に出席してきました。みんな久しぶりのわりに全く変わっていなかったのですが、傍から見ればやはり変わっているのでしょうね。
さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
サービスリニューアルする際、チームでユーザー体験を向上させるためのサービスブループリント (Goodpatch Blog)
サービスブループリントに関する記事は珍しいのですが、ツールなど含めて詳しく解説されていて、参考になります。
感情曲線を入れるなど、カスタマージャーニーマップ的な使われ方もしていますが、サービス提供側の課題が明確になり、それに対するアクションを皆で考えていけるところが、サービスブループリントを作る意義だと思います。
この記事で紹介されているプロジェクトでは、はじめにステークホルダーインタビューを丁寧にやっているようですが、これも見落とせないポイントだと思います。
失敗からの教訓：人間中心設計やＵＸデザインを社内に普及させるには (産業技術大学院大学)
UXデザインを社内で普及していくためにはどうすればいいか、についての記事です。
3つほどポイントが紹介されていますが、最後の「絶対に諦めない」というのは重要だなと思います。
組織とか状況によってはかなりのパワーを使うことになりますが、初めからそういうものだと思ってかかるのが良さそうです。
また、記事に書かれているようにキーマンの存在も重要で、そういう人を見つけることも大切だと思います。
身近な例で学ぶMVP（Minimum Viable Product）の重要性 (UX MILK)
MVPとは意訳するとコア価値だけ実現した製品やアプリ、サービスということになると思います。
具体的な例が書いてあり、公園に模したイメージ付きでになっているので、わかりやすいです。
これを見ると、やはり実際のユーザーからのフィードバックを早く得ることが大切だということになると思います。
新鮮だけど懐かしい。Windows 10の新デザイン「Fluent Design System」イメージ動画が公開 (ギズモード・ジャパン)
Microsoftの新しいデザイン言語（彼らの言葉ではデザインシステム）の紹介です。
Windows Vistaに似ているという話が出ていますが、確かにAeroスタイルの雰囲気を感じます。
ただ、それ以上に、Material Designに似ているような気もしますが。
動画を見るとサクサク動いていますが、実際もこれくらいで動いてくれると嬉しいです。
Making The Case For 'Boring' UX Design (Usability Geek)
「退屈」なUXデザインに関する記事です。
パララックススクロールやロード中のアニメーションなどはユーザーを引き付ける要因になりえるものの、UXを犠牲にする可能性があるので、従来通りの「退屈」なデザインももっと考慮すべき、という内容ですが、ここでいう「退屈」というのは「普通であること」に近いと思います。
過度に装飾せず、ガイドラインに則ったデザインは普通なのかもしれませんが、人々の課題を解決するのに適したものであるならば、それは美しいデザインだと言えるではないかと思います。
UX-writer: A New term, a Big Need (Prototypr.io)
UXライターに関する記事です。
なんでもUXに結びつける昨今ですが、この記事の趣旨としては、UXにおいてライティングは大きなウェイトを占めるので、しっかりと検討する必要があり、またそのためのスキルを身に着ける必要があるといったところです。
UXライターに関する記事は以前からありましたが、10月に入ってから、特に海外において増えてきたように思いますので、継続してチェックしていきたいと思います。
UX関連記事 (2017/10/16)
ここ数日は傘が手放せないのですが、そういえば傘は随分昔から形が変わっていませんね。そろそろブレイクスルーが起こって「まったく濡れない未来の傘」的なものがほしいところです。 さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
「まず人々のことを考える」：UXの開拓者ドン・ノーマンからのアドバイス (Adobe Creative Station)
大御所のインタビュー記事です。
『誰のためのデザイン？』の頃から一貫して謳ってきた「デザインの民主化」のエッセンスが節々に感じられます。
「システム全体をデザインする」「優れたデザインは不可視である」など、なるほどと思わせるコメントがあるので、一通り読んでみることをお勧めします。
AI活用が進めばスクリーンは不要に？--未来のインターフェースを考える (ZDNet Japan)
数年後には会話主体のUIになるという記事です。
今現在でもスマートスピーカーが急速に普及していることを考えると、スマホでもそのうち画面を見ずにAIが機能提供してくれる時代が来るのは、そう遠くないのかもしれません。
一方で、人との会話でも、空中戦にならないようにホワイトボードを使ったりしますが、そういったビジュアライズを通じた理解はこの先も大切なように思います。
分かっていることを新たに分かり直す (DESIGN IT! w/LOVE)
デザインリサーチに関する記事です。
リサーチをするとき、「やらなくても分かっていたことなのでは」という反応はけっこう多いです。
意思決定に関わってくる場合は「それはそれ」と割り切るわけにもいかないので、記事で言及されている通り、リサーチする側は伝え方をしっかり考えていく必要がありそうです。
それには、分かっていたことの裏付けが取れたと捉えて、その部分を強調して伝えるだけでもずいぶん違ってくると思います。
人の命を救うグラフィックデザインあれこれ (GIGAZINE)
人の生死にかかわるデザインについて紹介されている記事です。
危険を促したり、緊張を緩和したりと、デザインにできることはたくさんあることを感じます。
通常のアプリやサービスではこうした機会は少ないかもしれませんが、医療やヘルスケアの分野では、誤操作や誤認識を避けるためのデザインが求められると思います。
この記事で取り上げられているのはなぜかタバコ関連のものが多く、どれも吸う気がなくなります。
Dead-End UX: The Big Problem That Facebook, Twitter, And Others Need To Solve (Co.Design)
SNSにおける問題として、好みを学習する中で、提供される選択肢の幅が狭められていくという点について記載した記事です。
記事中では「デッドエンドUX」と呼ばれていますが、解決する方法として提案されている2案のうち、学習のリセットボタンを用意するというのが、現時点では現実的な解のように思います。
私もここ数年でパーソナライズに対する揺り戻しが来ると考えていましたが、その波はいまだ来ず、やはり人は居心地のいい環境にとどまる傾向があるのかなと思います。
今後AIが深く生活に入ってくる中で、その傾向に歯止めをかけるようなソリューションがあるとよいのですが。
10 Non UX Books That Will Help You To Become A Better UX Designer (UX Planet)
UXデザインをする上で役立つ「ノンUX」の本が紹介されています。
ノンUXと言いつつ、コンテンツ設計や認知心理学など、それもUXに含まれるのでは、という本が大半です。
訳本が出ていないものもありますが、出ているもの（特に1番目と2番目の本）は読んでおいたほうが良さそうです。
UX関連記事 (2017/10/9)
選挙が始まりましたね。私は選挙カーの賑やかさが苦手で、あまりにうるさいと「こいつには絶対入れねー」と思ってしまう心の狭い人間です。 さて、先週一週間くらいで私の気になったUX関連の記事を紹介します。
相手を説得するときにデザイナーがやってはいけない８つのこと (UX MILK)
コミュニケーションで注意する点についてまとめられている記事です。
人によっては耳の痛い話かもしれません。私も読み進めていくうちにいくつかフラッシュバックする記憶があったりしました。
どれも重要なポイントですが、中でも「相手の自由なフィードバックを求める」は意外とやってしまいがちかなと思います。
相手が何を指摘してよいかわからず、後になってだんだん全貌が見えてきたところで指摘する事項が出てきたときには遅い、というのを避けるためにも、何かしらレビューする観点の提示は大事だと思います。
UX改善に注力しつつも、売上減に怯えるパブリッシャーたち (DIGIDAY)
ユーザー体験を向上させるために邪魔な広告、ポップアップ広告などを減らすと、今度は収入減になるという話です。
記事の中でも触れられているように、UX向上と広告収入だと明確な効果を示せない前者の「分が悪い」と言うことになってしまうと思います。
ただ、ポップアップでユーザーのタスクを疎外するのは、長い目で見てマイナスであることは間違いありません。
ユーザーに無理矢理見せるのではなく、ユーザーの見たい広告が見られるという、Win-Winの関係になるような表示方法を模索して、徹底的に考えていけると良さそうです。
デザイン思考って結局なんだろう？通勤カバンの買い替えから考えてみた (DODA Creater's Blog)
通勤カバンからデザイン思考を考えるという記事です。
買い替えるのは手段、目的は快適に通勤すること、という気づきが良い感じです。
私も最近通勤カバンを買い替えたのですが、私の場合は通勤客を観察することをしました。
電車でどう持っているのか、どう持ちながら歩いているか観察して、どういったものを買えばいいか考えました。
これもデザイン思考的な考え方と言えるのかもしれません。
機械的な質問にならないために！インタビューのコツを徹底解説 (ferret)
ユーザーインタビューの話かと思いましたが、どうやらWEB記事を書くときのインタビューの話のようです。それでも基本的な要素は変わらないので、参考になるかと思います。
6W2Hの話が出てきますが、中でも "Why" が最重要だと思います。背景を知ることで、ストーリーにも深みが増すと思います。
あと大事だなと思うのは、誘導に気を付ける点です。私は話を引き出すために「たとえば○○というのはどうか？」というように例示することも多いのですが、それが思っていないことを話してしまうことにつながらないよう、気を付ける必要性を感じています。
Why All UX Designers Should Be Creating User Journeys, And Here’s How To Make One (Creative Cloud blog by Adobe)
ユーザージャーニーマップ（カスタマージャーニーマップという呼び方のほうがメジャーかも）の作り方についてです。
「事前にユーザー調査を実施すべき」「いきなりきれいなものを書こうとしない」「ステークホルダーに理解してもらう」といった重要なポイントが詳しく書かれていて、参考になります。
また、具体的なマップを眺めることができるのも良いと思います。
個人的にはAs-Is（現在のユーザージャーニー）とTo-Be（将来的なユーザージャーニー、新製品・サービス導入後の姿）の使い分けと注意点も気になるところです。
Native apps vs Web apps: A designer’s perspective (Muzli)
ネイティブアプリとWebアプリでどちらを選ぶべきかの記事です。
以前から似たような比較は多いのですが、この記事はポイントがまとまっていてわかりやすいです。
これ以外のポイントとしては、ネイティブアプリの場合、起動が容易という利点があります。Webアプリの場合はWebクリップを作らなければアクセスにひと手間かかってしまうのが難点です。
一方で、なぜこれをネイティブアプリで作ったのか？と言いたくなるようなアプリがあることも確かですが。
