Customer Spotlight

8

分で読める

How Fetch Uses Prototyping to Innovate

Learn how Fetch leverages ProtoPie to design cutting-edge consumer experiences.

Iulia Sorodoc、 Product Marketing Manager at ProtoPie

いつもの日常の買い物をしながら、ポイントを貯めてギフトカードや特典と交換しましょう。購入後にレシートの写真を「スナップ」するだけです。うますぎて信じられないように聞こえるかもしれませんが、17万人以上のアクティブユーザーに高速で楽しく、手間のかからないリワード体験を提供する消費者向けアプリFetchによって、すべてが実現しています。

しかし、この一見シンプルなユーザー体験の裏には、複雑なプロダクトデザインのプロセスがあります。ユーザーにとって直感的に感じられる形でイノベーションを設計したいなら、早い段階から、しかも頻繁に、そして高い忠実度でプロトタイピングする必要があります。そこで登場するのが、ハイフィデリティなプロトタイピングツールProtoPieです。

最近のウェビナーでは、FetchのシニアプロダクトデザイナーであるTaiki Ishiiから、彼のチームがプロトタイピング(もちろんProtoPieも)をどう活用してデザイン主導のイノベーションプロセスを強化しているかを聞きました。以下でTaikiのインタラクティブなウォークスルーをご覧になるか、主なポイントの解説をお読みください。

動画

Fetchのデザインチームがイノベーションにどう取り組むか

Fetchでは、デザインチームは、まだ確立されていないアイデアを生み出し、人間にとって望ましく、使いやすく、効率的でシンプルであることを満たす、定義された柱に基づいてデザインイノベーションに取り組んでいます。

イノベーションは従来のプロセスとは異なり、全員の足並みをそろえるために、より高い忠実度とコミュニケーションが求められます。もちろん、イノベーションは重要ですが、バランスの取れたプロダクト開発アプローチを持つことに同じくらい注意を払うことも極めて重要です。

つまり、各プロジェクトのニュアンスを理解し、それに応じてプロセスを適応させる必要があるということです。


three types of projects are described


1種類のプロジェクトしか生み出さないと、最終的には足かせになります。

Taikiによると、成功の鍵はこの3種類のプロジェクトのバランスを保つことです:

  • Iterate:既存の製品や機能に小さな改善を加えて、UIを向上させたり、ユーザーの痛点を取り除いたりすること。

  • Compete:競合他社がすでに行っていることに、既存の概念実証とユーザーによる適応を踏まえて変更を加えること。

  • Innovate:何も保証されず、ユーザーがイノベーションを完全には理解したり適応したりできない可能性があるため、リスクが高い、最も難しいタイプのプロジェクト。

自分がイノベーション型のプロジェクトに関わっていると認識すると、プロダクトデザインのプロセスはいくつも目立って変わります。その一つがプロトタイピングの役割です。

早い段階から頻繁にプロトタイプを作るべき理由

「プロセスが変わっていく中で私が気づいた最大のことの一つは、プロトタイピングに取り組み始めるタイミングがどれだけ早く、どれだけ頻繁になったかということです」とTaikiは語ります。「それは、デザインを伝え、なぜそうしているのかを説明するために、非常に高い忠実度が必要だからです。」

Taikiは、イノベーション向けにデザインする場合、「できるだけ早くプロトタイピングし、プロトタイプを作ることは、あなたとチームがあなたを支え、ゼロからこの製品を一緒に作り上げるための大きなレバレッジポイントになる」と話します。

彼は、デザインイノベーションのプロジェクトで早い段階から頻繁にプロトタイピングすることには、3つの重要なメリットがあると言います。


The three key benefits to prototyping early and often.


早い段階から頻繁にプロトタイピングすることの3つの主なメリット。

1. ステークホルダーからより質の高いフィードバックを得られる。

「プロトタイプを作るたびに、それを誰かに見せてフィードバックをもらうと、そのフィードバックはより意味のあるものになります」とTaikiは語ります。「デザイナーとして、それこそがまさに肝心要で、求めているものです。」

言い換えれば、プロトタイプを重ねるほど、以前のバージョンを土台に改善するための実用的なフィードバックをより多く得られます。

2. 「見せて伝える」を使って、より良いストーリーテリングができる。

製品の抽象的な要素を説明したり比較したりするとき、プロトタイピングによってその体験を再現し、より良いストーリーを語ることができます。特に、相手が日常で同じ体験をしていない場合、何かを言葉で説明するのと実際に見せるのとでは、天と地ほどの差があります。

「スクリーン上で[概念]を表現することは、レバレッジとして使えるものであり、何かをイノベートする全体プロセスにおいて非常に価値があります」とTaikiは語ります。

3. 早期のプロトタイピングは迅速なテストを可能にする。

「迅速なテストとは、プロトタイプが機能しているかどうかを、たとえ非公式なレベルでもテストして、ユーザーが次に何をしてほしいのかを理解しているかどうかを確かめる能力のことです」とTaikiは語ります。

彼はさらに、「プロトタイプがかなり早い段階であるからこそ、立ち寄った誰にでもそれについて聞けるのはありがたいことで、非常に有益です」と付け加えます。

それでも、どんな意思決定にも欠点はあります。

プロトタイピングのベストプラクティス

プロトタイピングの最中、Taikiは苦労して学んだことや何時間もかけて修正・調整しようとしたことがあると話してくれました。ここでは彼がそこから得た教訓を紹介します。


Prototyping best practices.


プロトタイピングのベストプラクティス。

1. レイヤー、トリガー、レスポンスには必ず名前を付ける

デザイナーならすでに耳にしたことがあるでしょうが、繰り返しになりますが、必ずすべてを記録し、レイヤーに名前を付けましょう。

「何らかの理由で左に動かすのか右に動かすのかを判断するだけでも、1分か10分かかることがあります」とTaikiは語ります。「これは、最終的にはとても役立つデバッグツールになります。」

2. スタートディレイの使用には注意する

「プロトタイプは2つの異なる見方ができると思えます」とTaikiは説明します。「1つ目はタイミングベースのプロトタイプで、すべてが開始点と終了点に基づいており、必ず従わなければならないインタラクションパターンがあるわけではありません。どちらかというと、ステークホルダーに意図した体験を示す動画を作ることに近いです。」

その一方で彼は、「もう一方には、実際の製品体験を再現する完全に機能するプロトタイプがあります。完成度の高い機能プロトタイプを作ろうと自分を追い込むのは大変かもしれず、より深いレベル、より体験レベルで考える必要があります。でも、それは最終的にはきっと役立ちます」と語ります。

3. プレイグラウンド/サンドボックスファイルと最終版ファイルを作成する

「最終版ファイルと並行してプレイグラウンドやサンドボックスファイルを作るのは、非常に有用な実践です」とTaikiは語ります。「デザインやモックアップの段階でさえ、途中で反復して新しいアイデアを思いつくのはよくあることです。ProtoPie内に実験とアイデア出し専用の別シーンやファイルを用意しておくことは、私にとってとても役立つ習慣になっています。」

4. 進捗を共有する

「コミュニケーションが鍵であり、それには進捗を定期的に更新し、必要なら過剰なほど共有することも含まれます」とTaikiは語ります。「全員が同じタイミングで同じ認識を持てるようにすることは、体験を高め、起こりうる障害を和らげ、新しいワクワクするものを作る旅路を軌道に乗せ続ける助けにしかなりません。」

Fetchのデザインチーム全体にとってProtoPieが頼りになるプロトタイピングツールである理由

ProtoPieはお祭り状態で、みんな大歓迎です。

Fetchのデザインチームがチーム内のすべてのデザイナーにProtoPieの使用を勧める理由は、この3つです。


The main reasons why design teams at Fetch use ProtoPie.


FetchのデザインチームがProtoPieを使う主な理由。

1. チームの全員が、できる限り最善のソリューションを作ることに貢献できる。

チームとしての解決策が生まれることは、早い段階からProtoPieで全員が同じ認識を持つことの最初の利点です。

「チーム全体がProtoPieに入り、ファイルがどこにあるかを理解し、プロトタイプがどこにあるかを把握し、常に自分たちでクリックして確認できるべきです」とTaikiは語ります。「そうすることで、チームの勢いとケミストリーはさらに強まり、最終的にチームがやろうとしているのは、各個人のアイデアの中で、集団として可能な限り最高の製品を作ることだからです。」

2. どうやって最高の製品を作るかを早い段階で把握できる。

「おそらく最も重要なのは、開発のアイデア出しでしょう」とTaikiは語ります。

彼はさらに、「ProtoPieでは1つの問題を解決する方法は無数にありますが、たいていの場合、チームにとって最善の進め方は一つです。デザイナー、PM、QA、データアナリストなど、関わる全員にとって、それを非常に早い段階から考えられることは、プロセス全体を通して役立つ初期の種をまくようなものです」と付け加えます。

3. 正式な引き継ぎ段階に入る前に、すべてのチームメンバーが状況を把握している。

「3つ目は引き継ぎの効率です」とTaikiは語ります。「私がデザインを引き継ぐとき、ただ自分が決めたことを伝えるだけではなく、私たちが共同で決めたアイデアについて合意することが大切なのです。」

チームの全メンバーの間でシームレスにコミュニケーションを保つことは、新しく革新的なものを生み出すうえでかけがえのない要素です。

Fetchのデザインチームにとって、このことはSnap Experienceを再設計したときに、これまで以上に明確になりました。次のセクションでは、このプロジェクトにおける成功とつまずきを見ていきます。

Fetch Snapの体験から学べること


The Fetch Snap experience.


Fetch Snapの体験。

Fetch Snapの体験は、Fetchの中核機能であり、ユーザーはアプリのカメラを使ってレシートの写真を撮ることができます。アプリはレシート上の項目を認識し、適切なポイント数をユーザーに付与します。

以前のUXに必ずしも問題があったわけではありませんが、チームは、最近社内に取り込んだScan and Match技術のワクワク感を引き出す新しい体験を作りたいと考えていました。

目標自体が非常に曖昧だったため、彼らが最初に行ったことの一つは、何を把握しているかを明確にすることでした


The Snap experience: what the team knew.


Fetch Snapの体験を反復改善する:チームが把握していたこと。

コア体験は壊れやすく、これはイノベーティブなプロジェクトになると分かっていたため、賭けはさらに大きくなりました。ユーザーは変化をためらうので、各ステップで何をすべきかを確実に理解してもらうことが、これまで以上に重要でした。

すでに壊れているものを直しているわけではなかったため、Fetchのデザイナーたちは、どこで最も大きなインパクトを出せるか、そして成功を測るためにどの指標を使うかについても話し合う必要がありました。


Iterating the Fetch Snap experience: how to make an impact.


Fetch Snapの体験を反復改善する:どのようにインパクトを出すか。

彼らは以下が必要だと分かりました:

  • UIをシンプルにする:以前のUIデザインは散発的で一貫性がなく、使いやすさに欠けていました。

  • 「定着する」体験を作る:体験は古く、インタラクションも時代遅れでした。

  • リテンションに注力する:このプロジェクトでの成功は、以前のUIと比べてユーザーの理解度と定着率が高まることを意味しました。この指標は会社の目標とも一致していました。

Taikiは、子どもの頃に日本のゲーム金魚すくいを遊んだ思い出が、新しいFetch Snap体験の最初のインスピレーションになったと語ります。ゲームでは、できるだけ多くの金魚をすくってボウルに入れるには、動きの中での繊細さと感覚が求められ、プレイヤーが何度も戻ってきたくなる、やみつきで記憶に残る体験が生まれます。

「それを、この新しい体験をどう作るか、そしてそれがユーザーにまた戻ってきたい、熱中したいと思わせることにどうつながるかを語るストーリーの中で活かすことができました。さっきも言ったように、ストーリーテリングはこのプロセスの大きな部分を占めます」とTaikiは語ります。

金魚すくいは、彼らの初期コンセプトの着想源になりました。しかし、プロトタイプを数人のユーザーに公開したあとで、Taikiは「最終的に起きたのは、誰もそれを理解できなかったということです」と語ります。

「デザイナーとして自分を謙虚にさせる瞬間の一つです」と彼は付け加え、この体験から学んだ重要な学びを要約しました。


Test fast and fail fast


素早くテストし、素早く失敗する。

1. 素早くテストし、素早く失敗する。

「この一部を早い段階でテストできたのは本当に助かりました」とTaikiは語ります。「この体験から学んだことの一つは、素早くテストし、素早く失敗することです。チームが早い段階でプロトタイプを持ち寄って一緒に取り組めたおかげで、[最初の]反復はうまくいかないと分かったのです。」

2. 最初のアイデアはほとんど決してうまくいかない。

「まず最初に思いつく、たぶん一番自信のあるアイデアでさえ、必ずしもいつもうまくいくとは限りません」とTaikiは語ります。「でも、とにかく続けて、それを反復し、うまくいっていない部分から学んでいくことです。」

3. うまくいっていることとうまくいっていないことを分解する。

「分かったのは、ユーザーがカメラ側のことにあまりにも集中しすぎていて、画面上に何かが表示されても気づかなかったということです」とTaikiは語ります。「彼らはただ、先ほど見た右下のボタンが表示されるのを待っていただけで、結局それは一度も表示されなかったのです。」

Fetch Snap体験の最終成果物と測定可能な結果

Fetchのデザイナーたちは、解決策を見つけるために再び検討室に戻りました。


First iterations of the Fetch Snap experience.


Fetch Snap体験の最初の反復。

「画面の上にオーバーレイを重ねて、ユーザーの注意を一時的に引きつけるこの解決策を考え出しました」とTaikiは説明します。


Using ProtoPie to improve the Fetch Snap experience.


ProtoPieを使ってFetch Snap体験を改善する。

そのために、追加のロジックとUXコピーを加え、ユーザーが送信できる状態になった正しいタイミングで表示されるようにする必要がありました。また、ボタンにアニメーションを追加して、アクションを完了するためにユーザーが取るべき手順を示し、さらにタッチダウントリガーを組み込んで、ユーザーの指が常にどこにあるかを把握できるようにしました。

「ProtoPieには、Figmaなどの他のツールでは得られないプロトタイピングの深さがあります。このプリセットのフォーミュラはその一つでした」とTaikiは語ります。「作るのが本当に楽しくて、今後はもっとフォーミュラを使えたらと思っています。」

新しい体験の公開後、チームは以下を測定できました:


After the release of the new experience the team was able to measure the results.


新しい体験の公開後、チームは結果を測定できました。

  • 初回Snap成功率の向上。以前のUIと比べて、ユーザーがより高い割合でアクションを完了できるようになったことを意味します。

  • 全体的なSnap成功率の向上。最初のレシートスナップの後でも、ユーザーが新しい機能体験にうまく適応したことを示しています。

  • 2週目の定着率向上。

最後にTaikiは、「ここまで本当に素晴らしい道のりでした。もちろんつまずきや大変な瞬間、長時間の作業もありましたが、最も楽しいプロジェクトの一つでしたし、チームに感謝しています」と付け加えました。

無料でハイフィデリティなプロトタイピングを始めましょう

ProtoPieは、Fetchや他の1万5,000社以上が選ぶハイフィデリティなプロトタイピングツールです。ProtoPieを無料で試して、今日からプロトタイピングの旅を始めましょう!