クックパッドから独立。「トクバイ」のすべてのデザインを統括する

弊社が提供している「トクバイ」は、全国各地のスーパーマーケットやドラッグストアなどの小売店のチラシを、無料で閲覧できるスマートフォンアプリです。もともとクックパッド内で提供していた「クックパッド特売情報」のサービスを切り出す形で、2016年7月に子会社として独立しました。

▼クックパッド特売情報

私は現在、社員としてはただひとりのデザイナーとして、トクバイのプロダクトデザイン全般を担当しています。

クックパッド特売情報の頃からなのですが、トクバイの開発チームは大きく、アプリとWebで分かれています。すると、それぞれが目の前のことに取り組んでいくので、お互いが違う方向を向いてしまうことにもなりかねないんです。

ですので、私がその橋渡しのような形で、トクバイというひとつのプロダクトを、ユーザーさんに届ける上での体験や、品質を統一するような役割を担っています。

もともと私自身は2015年5月にクックパッドに入社し、クックパッド特売情報の時代からデザインを担当していました。当時はまだクックパッド内のひとつのコーナーだったので、ある意味「クックパッドというブランド」に守られていた部分もあったと思っています。

それが子会社化したことで、「トクバイ」というひとつの新しいサービスを作っていく必要が出てきました。それまでにはなかった自由が手に入った一方で、ブランドを作り上げていく責任が伴うようになったと感じています。

買い物の体験に特化するため、「特売情報」から「トクバイ」へ

クックパッド特売情報というサービスは、取り扱う店舗の業態が、食品領域以外にも、ドラッグストアやクリーニング、ホームセンターなどに広がってきています。

小売店に支持し始められていたことはとてもうれしい反面、料理に親和性を感じる「クックパッド特売情報」というサービス名に違和感も生じてきていました。

なので、買い物をするときの「買いたい商品を探す」体験を届けることに特化し、「トクバイ」という単独のサービスになることで、実現できることの幅がもっと広がるのではと考えていました。

そこで、「買い物情報」により特化したサービスにしていくために、まずはペルソナを作成しました。ユーザーはどんな人で、どのような生活を送っているのか、買い物という体験に特化したときに何を望んでいるのか、といったことから形を作っていきました。

その結果、「共働きかつ子持ちで、ゆっくり買い物に行く時間がない人」をペルソナとして設定しました。仕事が終わった後や、子どもを迎えに行った後など、時間がなくても何かを買って帰らないといけない。そのようなシーンで、買い物の意思決定を後押しできるサービスを目指すことになりました。

ユーザーインタビューによって、ユーザーの要望の「本質」を探す

次に、本当にユーザーさんが「利用したい」と思うアプリを作るために、ユーザーインタビューを実施しました。

クックパッド特売情報のユーザーを対象にメールで参加者を募り、ペルソナに合ったユーザーの人たちを10名ほどお呼びしました。伺った内容としては、普段の生活サイクルや、その中で抱えている課題、どういったサービスを必要としているのか、といったことです。

そこから、さらに何名かをもう一度お招きして、具体的な課題を深掘りしていきました。それらのインタビューの情報を元に、実際にプロダクトの方向性をまとめていきました。

もちろん、そこで出たユーザーさんの意見をすべてプロダクトに反映するわけではありません。よく例えられる話ですが、「速い馬が欲しい」と言っている人の本当の要望は、「速く移動したい」ということなんですよね。実際に何が欲しいか、ということは、まだわかっていないのです。

ですので、いただいた要望はすべてGoogleスプレッドシートにまとめつつも、そこから意思決定を助ける要素だけを集め、要件を詰めていきました。

「価値仮説シート」を活用し、本当に必要な機能を絞り込む

新しいサービスを作るとなると、「あれも入れたい、これも入れたい」と、機能を詰め込みたくなってしまいます。ですが、想定しているユーザー像に届けたい価値を、しっかりと考えた上で優先度を付けていくことが重要です。

そこで弊社では「こういう機能を追加したい」となった場合、まず価値仮説シートというフレームワークのようなものを使い、ペルソナにとっての課題と、その機能がそれに対してどのような価値が発揮できるのか、ということについてGitHubのIssuesで議論を行います。

▼仮説検証シート

クックパッドの文化といえばそうなのかなとも思うのですが、議論したい機能ごとにこれを立てます。明らかに恣意的な設定がされていると、それは違うということになる。

例えばユーザーの部分で「商品情報を比較したいユーザー」と設定してしまうと、最初からそういった機能ありきの思考になるので、本当にそれが必要なのかどうか正しい議論ができません。

もう少し「ユーザーが体験するストーリー」を想定して、本質的な課題を探りましょうということになります。忙しくて買い回りにかける時間がない、子連れで行ける場所が限られている、といったことですね。

トクバイの場合で言うと、

• ゆっくり買い物をする時間がないユーザーは、
• お買い得な情報をいち早く探したいが、
• 多くの品物があって決められないので、
• 近所のスーパーの情報が見比べられることに価値がある。

といったイメージです。これが本当に信じられそうな仮説かどうかというのを、しっかりと議論します。それで良さそうであれば、ペーパープロトだったり、簡単な画面を作る、といった作業に入っていきます。

プロトタイピングに重要なのは、「自然体」で操作をしてもらうこと

このように仮説を明確にしてから、アプリのプロトタイプを作成しました。デザインには主に「Sketch（スケッチ）」を使っていて、そこから「Prott（プロット）」で画面遷移を作成します。さらに、細かいインタラクションの再現には、「Flinto for Mac（フリントフォーマック、以下Flinto）」を使っています。

Flintoを使うと、画面遷移時に「どのコンポーネントがどういう動きをするか」ということを再現できます。「ボタンを押して、ローディングの状態が◯秒続き、次の画面に遷移する」といったインタラクションも作れるので、実際にユーザーに届くプロダクトと近しい状態を簡単に作ることができるんですね。

▼「Flint」を活用したプロトタイピング

ただ、使うツールはなんでも良いんですよね。重要なのは、開発が始まる前にプロトタイプを作ることで、チーム内の共通認識を作っておくことだと思います。細かい部分まで詰め切るというよりは、情報の出し方やインタラクションに違和感がないか、といった認識を可視化できたら十分です。

このように用意したプロトタイプを使って、再度ユーザーインタビューを行いました。こうしたインタビューの際に録画をするケースもあると思うのですが、弊社では取り入れませんでした。録音しつつ、隣でメモを取っていただけです。

やっぱり録画をすると人って緊張してしまって、自然な言葉が出てこないんですよ。自然体で使ってもらえるように、場所も会議室ではなくクックパッドオフィス内のキッチンラウンジにして、お茶やコーヒーを出しながら、雑談のような雰囲気で実施しました。

ユーザーさんからも帰り際に「こんな話で良かったんですかね？」という疑問がでるくらい（笑）、ゆったりとした雰囲気でインタビューをしました。

リリース後も、「ユーザーの声」を大切に。No.1を目指したブランド作りを

このようなプロセスを経て、2016年7月にAndroid版、8月にiOS版のアプリをリリースました。そしてその後も、ユーザーさんの声を聞きながら改善を続けています。

例えばトクバイには、自分のよく行くお店をお気に入りするような「フォロー」機能があるんです。ですがアプリストアのユーザーレビューやご意見で、「フォローの解除方法がわかりにくい」という声がいくつかあって。レビューやご意見はチーム全体で常に注視しているので、すぐさまフォロー解除を分かりやすくする改善を加えました。

実際Googleのカンファレンスでも、ストアのレビューに返信をしてユーザーとコミュニケーションを取ると、結果としてアプリの満足度は上がるというデータが示されています。ユーザーの声にいかに早く答えるかということには、非常に力を入れています。

いまは登録店舗数も全国で24,000店を超え、スーパーマーケットやドラッグストアの掲載店舗数では、国内No.1の規模になりました（※2016年7月時点、トクバイによる自社調査）。

ここからはユーザー数や満足度もNo.1のチラシ情報アプリにしていくために、全員でより一層頑張っていきたいと思っています。（了）