• このエントリーをはてなブックマークに追加

海外UX改善事例 Pick up!【1】ニューヨークタイムズアプリのUX成功パターン・ケーススタディ

ニジボックスのUXデザイナーが世界のUI/UX改善事例をピックアップ!
ニジボックスでは、UXデザインの観点からプロダクトの改善提案を行なっています。海外では以前から、UXデザイン文脈でのサービス改善は重視されてきており、日頃から海外事例の成功例や失敗例の分析をおこない、提案のヒントを得ています。こちらのコンテンツでは、ニジボックスのUXデザイナーが「これは!」とブックマークした、海外の事例研究の記事を翻訳してお届けします! みなさんの関わっているプロジェクトやご自身のプロダクトに課題感を感じている方は、それを突破する新たなヒントが見つかるかもしれません!
※本記事は掲載元または作者本人の許可を得て翻訳転載しています。また記事内容は、ニューヨークタイムズ公式の事例研究ではなくUX Collective https://uxdesign.cc/のメンバーによって独自に行われたものです。

海外UX改善事例1 ニューヨークタイムズアプリ

課題

ニューヨークタイムズ(以降、NYT)アプリはいくつもの理由によりユーザの支持を失っています。競争とコストの問題以外に、以下のことが要因となっています。
1. 取材内容(満足いかない記事を読んだなど)。
2. 大きなライフイベント(引越しなど)。
3. 利用機会の少なさ。
4. 関心・関係の無いコンテンツ。

Goal

  1. 世の中の無数のアプリ(ほとんどが無料)の中から手に取ってもらえるような動機をつくること。
  2. 読者にとってアプリの利用が習慣化すること。
  3. 顧客が長期のロイヤルティを維持できるようにすること。

わたしたちの提案

既存のNYTアプリ全体を改修する代わりに、LPにTimelyという名のちょっとした便利な機能を加えることにしました。

これによりユーザーは忙しい一日の中でも絶好なタイミングで通知を受け取ることができるようになります。例えば、朝食、通勤、会議の前、コーヒーブレイク、あるいは寝る直前などに。

この通知によってユーザーはすぐにTimelyを開き、記事にアクセスすることができ、読むのにもほとんど時間がかかりません。そしてもっとも重要なのが、それぞれのユーザの関心や志向に合った記事が表示されることです。

デザインプロセス

ステップ1 課題と概念
ステップ2 ターゲット、ニーズ、調査
ステップ3 顧客目線、スケッチ
ステップ4 ワイヤーフレーム、デザインレビュー
ステップ5 ビジュアルデザイン、ストーリーテリング(物語化)
ステップ6 試作品(プロトタイプ)

私の役割とチーム

UXの専門家であるKehとAddiと組んで私は主にインタラクション・ビジュアルデザインに取り組みました。


トピックに関する調査

若い層の生活習慣を調査。そうすることでただ私たちのアプリを押し付けるのではなく、彼らの生活に適したものを提供できます。

どのようにニュースに触れているか

・Facebook
・Twitter
・WhatsApp
・ラジオで流れるランダムなニュース
・職場や学校での会話の中

ユーザーはどんなタイミングで携帯を使うのか?

「私たちは1日に2,617回携帯に触っている」

起床時、食事中、移動中、コーヒーブレイク、会議が始まるまでの時間、就寝前

ターゲットユーザーと市場

今回は、プロジェクトに確保できる時間が4週間と短く、シンプルなソリューションを導き出すことだけに集中しました。

スコープ

ユーザー:20〜40代。テクノロジーを使いこなしており、日々のスケジュール管理にGoogleカレンダーを使用。
マーケット:ニューヨークの若い層。

テーマとインサイト

2017年のロイター・デジタルニュースのレポートから、世界のニュースコンテンツの消費動向に関する素晴らしいインサイトが得られました。

・ニュースアプリ利用は一時期低迷した後、全世界のほとんどで使われるまでに増加。
・アメリカの若者にとって、時間を費やすことはニュースを読む能力の中でも重要な要素。
・Googleカレンダーは、AppleのものとOutlookに次ぐ、最も利用者の多いカレンダー。

潜在的な顧客に対するインタビュー

日々のスケジュールがパンパンに埋まっており、新聞を読む暇の無い若い層をユーザーとして選び、彼らの抱えるニーズや日々の課題を理解するためにユーザーインタビューを行いました。

1. 最初にフィールド調査を行いました。
2. インタビューのレポートを送りました。

Team brainstorming — johny vino, Addi, Ke hu

ユーザーの声:

「あまりニュースには詳しくありません。」
「興味はあります。そろそろ始めどきだとは思っています。朝メールで配信されるニュースを眺める以外、決まってニュースを読むための時間はありません。」
「隙間時間はたくさんあります。」
「くだらないニュースを読むのに時間を費やしてしまいました。」
「できればそうしたい(ニュースを読みたい)んだけど! 時間管理が大きな課題かな?」

デザイン原則

調査とユーザーインタビューを終えると、デザインしていく上で軸となる一連の原則が見つかりました。インタビューの結果がUIデザインに直結するよう心掛けました。

1.使い始めるまでの障害が無いこと
日々のスケジュールや習慣は人それぞれ。複雑な手順を省き、どんなユーザーでもすぐにライフスタイルに導入しやすいUXが考慮されていること。
2.シンプルであること
インターフェイスがシンプルで直感的に使え、ユーザーは新たな操作方法を学ぶ必要がありません。
3.丁寧さ
ユーザーにとって有益でアクセスしやすいデザインであるべき。しつこい通知で無駄に邪魔してはいけない。

共感マップ

インタビューの後、ユーザーの回答や意見を図式化してまとめることで、彼らを取り囲む環境や感情との関連性についても考えました。

Empathy Map — johny vino, Addi, Ke hu

想像+検証

・初期段階の課題を解決するために15個のコンセプトを立案。
・アイディアの持続性と可能性を、ニューヨークタイムズのデザイン責任者と検証。
・15のテストグループでも検証を行い、もっとも良いアイディアに投票してもらいました。

9 concepts — johny vino, Addi, Ke hu

ユーザージャーニー

Drawings by Addi, Ke hu

ストーリーボードとワイヤーフレームの第一段階

ユーザーがこの機能をどんな状況でどのように使うのかを全て理解するためにビジュアルストーリーボードを用意しました。

Credits: Addi Hou

Credits: Keh and johny vino

デザインレビュー

・当初はカレンダーのようにニュースを見せようと考えていた。しかしデザインVPの検証によると96%のユーザーがポートレートモードで閲覧していると判明。よってこのアイディアではだめになった。
・ニュースを表示させる、十分なスペースがない。
・操作がややこしくなり、ひと目でニュースを見つけられなくなる。

ワイヤーフレーム 2ラウンド目

フィードバックをもとに、スクロールしながら使うポートレートモードでデザインを提案しました。

Credits: Keh and johny vino

理想的なユーザージャーニー

画面内で実現できることが充実するにつれ、ユーザーのライフスタイルにより注目することにした。それによって、彼らの暮らしにシンプルにフィットする方法を考えられるようにします。

Credits: Addi Hou


最終プロトタイプへ

二つのモード
ストーリーボードを囲んでブレストした結果、アプリにふたつのモードを組み込むことにしました。

・マニュアルモード:今どれくらい時間が空いているかをユーザーに選択してもらい、それに基づいたニュースを提供。

Credits: Addi and Myself


・オートマチックモード:Googleカレンダーとシームレスに連携。ユーザーのスケジュールを解析し、最適なタイミングでニュースを提供。

Credits: Addi and Myself


最終プロトタイプ

https://dribbble.com/shots/4212627-The-New-York-Times-Timely


結論
参加者と研究者とのインタビューを元に私たちは確実なニュース提供パターンを考え出すことができました。彼らのライフスタイルやスケジュールにうまくフィットできれば、若いユーザーを獲得できるはずです。

改善点
・競合他社の機能や成果に関して調査する。
・異なる地域からの参加者を募る。
・ユーザーとプロトタイプのユーザビリティのテストを行う。
・デザインの方向性。

学び

Presenting our Idea at The New York Times Headquarters — Addi Hou and Myself. Ke Hu in France on that event


このプロジェクトを通して、有名な企業のプロダクトに小さな新機能を導入することがいかに難しいかを知りました。画面上の小さなボタンを変えるだけのためにもタッチポイントを考慮しなければなりません。

Renda Morton (ニューヨークタイムズのプロダクトデザイン・エグゼクティブ・ディレクター)と共同作業ができたことは貴重な体験となりました。デザインの幅広さと限界を理解し、正しい質問をするという面でとても成長できました。


この記事をつくった人


Johny vino Interaction Designer
元記事:UI/UX case study for the New York Times app
Johnyvino @johnyvino27

※この記事はUX Collectiveからの翻訳転載です。配信元または著者の許可を得て配信しています。

ニジボックスの考えるUXデザイン

ジョニーさんのニューヨーク・タイムズアプリの改善提案のプロセスはいかがでしたか? 豊富な具体例も盛り込まれていて、ケーススタディはもちろん、皆さんの日頃の業務に活かせそうな気付きも与えてくれたのではないでしょうか。
ニジボックスではUXデザインに関するご相談をお受けしています。相談者に寄り添い一緒に考え続ける伴走型のサービスが特徴です。ぜひ、こちらのページからお気軽にご質問下さい!