13年続いたつくれぽをリニューアルした話

13年続いた「つくれぽ」をリニューアルした話

はじめまして、こんにちは。クックパッドデザイナーの久保坂 美咲(@misaaa09)です。

クックパッドは中学生の頃から使っていて、料理が好きになったきっかけを与えてくれたクックパッドが大好きで2016年に新卒社員として入社しました。

そんなクックパッドに入社して4年目、先日クックパッドのiOSアプリでサービス初期の頃から続いていた「つくれぽ」機能のリニューアルを行いました。今日はそのリニューアル後のつくれぽの紹介と、デザインプロセスについてご紹介したいと思います。

(長期に渡る大規模開発だったため少々長くなってしまいました…🙇‍♀️
これから既存機能のリニューアルをするぞ!という方の参考になればいいなと思っていますので、少し長いですがお付き合いいただければと思います。)

つくれぽとは?

「つくれぽ」とはレシピを書いた作者さんに対して、レシピを見て作った人が、「ありがとう」を伝えられる手段として、2006年のサービスリニューアル時に誕生したクックパッドの基本機能でした。
作った料理の写真一枚と32文字までのコメントを添えて、「あなたのレシピを作りました、美味しかったです!ありがとう」を伝えられるものになっています。

初めて掲載されたつくれぽ

▲初めてクックパッドのレシピに掲載されたつくれぽ@2006年 

レシピ作者にとっては、つくれぽが継続的なレシピ投稿へのモチベーションに繋がったり、
つくれぽ作者にとっては、感謝を伝えながら、おいしかったレシピの記録として活用することができるようになっています。
また、レシピを探すユーザにとっても、つくれぽの数が作られておいしかった数としてレシピ決定に参考にされるものになっていました。  

このように「つくれぽ」はクックパッドのコミュニティを支える大切な基本機能の一つでした。

「作者への感謝」から「みんなへのおすすめ」へ

そんなつくれぽ機能を今回、レシピ作者への感謝から、今日の料理を決めようとしているユーザーへの「おすすめ」というコンセプトに変え、リニューアルを行いました。

リニューアル前後概念図

つくれぽにはレシピの良かったポイントをハッシュタグとしてつけることができ、また検索ユーザーはハッシュタグを通して作った人のさまざまなおすすめの切り口からレシピを検索できるようになっています。
※ハッシュタグからの検索は現在一部ユーザー限定公開になっています。

ハッシュタグ検索

また、従来のフォーマットから表現力をアップし、「作ってみたい!」につながるつくれぽになるように変更しました。

写真1枚+コメント32文字

写真or動画3枚まで+コメント64文字+ハッシュタグ

新つくれぽ

なぜ今、つくれぽを変えるのか?

長年続く基本機能のコンセプトを途中で変更するのは、とてもリスクの高いことだと思います。
すでに使ってくれているユーザーさんの学習を、もう一度させることになるし、今まで習慣的に使ってくれている人にとっては、これまでと同じような使い方はできなくなる可能性もあり、多くのストレスを掛けることになると思っています。

ではなぜ、そこまでして変える必要があったのか?

それは、いまクックパッドが、ユーザーさんの毎日の料理を今よりも、もっと楽しみにできるんじゃないか?と思い始めてきていたからです。

クックパッドを使う方の中には毎日時間に追われる中、家族のために美味しいごはんを作りたい、と思うユーザーさんが多くいらっしゃいます。
そういったユーザーさんの、時短で簡単で美味しいレシピを簡単に見つけたいという欲求をクックパッドに投稿してくださるたくさんの一般ユーザーさんのレシピ人気順検索が叶えてきました。

人気順

もちろん毎日忙しい中で美味しいご飯を作りたい、という課題に対して直球で答えることも料理を楽しみにする上でとても大事だと思っています。

ただ、クックパッドには一般のユーザーさんが考え出したレシピが約320万品あります。その中には時短・簡単な料理だけでなくプロの料理人の方も思い浮かばないようなアイデアや、調理工程や組み合わせで料理そのものに楽しみが詰まったレシピもたくさん存在しています。

自分が想像もしていなかった素敵なレシピと出会い、発見や成長を重ねることで毎日の料理が楽しみになる、そういったクックパッドに訪れるユーザーさんの期待を超える体験を提供することが、毎日の料理を楽しみにするためには必要だという想いがこのプロジェクト発足のきっかけでした。

期待値を超える

料理そのものが楽しくなるようなレシピと出会う体験をどう提供するか?を考えたときに、浮かび上がった一つの手段が、すでに料理を楽しんでいる人(つくれぽ投稿ユーザー)がそのレシピの楽しさを発信し、新着順や人気順では見つけにくかった素敵なレシピに出会いやすくするということでした。

前段がとても長くなりましたが、今日はその新しいつくれぽを生み出すまでのプロセスについて紹介したいと思います。

イメージを発散させて新つくれぽのコンセプトを模索

冒頭で伝えたとおり新しいつくれぽは「作者への感謝」から「みんなへのおすすめ」というものに変わりました。

とはいえもちろん最初からこのコンセプトに落ち着いていたわけではなく、すでに料理を楽しんでいる人(つくれぽ投稿ユーザー)がそのレシピの楽しさを発信し、新着順や人気順では見つけにくかった素敵なレシピに出会いやすくすることをどう実現するか?というところからのスタートです。

どうすれば料理を楽しむ人が楽しさを表現でき、他の人が見て作りたくなるつくれぽにできるか?

この視点でつくれぽのアウトプットイメージからコンセプトやフォーマットを発散させて考えていきました。
例えば以下のようなものです。

レシピを見て作った人の背景を知って、レシピを作りたくなる

作った人の背景を知ってレシピを作りたくなる

料理でハマっていることを書籍風にまとめられる

本みたいなやつ

推しレシピを紹介できる。貯めておける。私のイチオシを他人にも評価してもらえる

推しレシピ

あくまでどれも、具体的な機能やデザインを決めたいわけではなくコンセプトを具体化していく上でチームメンバーの発想を広げたり議論の土台にすることを目的としていて、振り切ったUIを作ることを心がけていました。

またこの際、コメントや写真は本物に近いコンテンツを考えながらはめることを意識しています。
もし私がこのつくれぽを投稿するとしたらどんなことを書くだろう?という限りなくユーザーとしての自分で文章や写真を考えます。

そうすることで、投稿ユーザーが本当にこのような文章を書けるのか?書きたいと思うのか?検索ユーザーがこれを見て作りたいと思うのか?を主観と客観の両方の視点を持って評価することができました。

最終的には、つくれぽ投稿者の投稿したい気持ちと検索ユーザーの作りたくなる気持ちの両方が満たせそうな「推しレシピ」というコンセプトが新しいつくれぽコンセプトを考える上での突破口となり、今の「みんなへのおすすめ」というコンセプトにつながっています。

【価値検証フェーズ】 見る人/投稿する人 の両方の視点からプロトタイピング

新つくれぽコンセプトは「みんなへのおすすめ」と、まとまって来ましたが、それはあくまでまだ仮説の状態でしかありません。

具体的には以下の項目を確かめながら、詳細なデザインやフォーマットの決定を進めていきました。
この2つの検証項目について具体的にお話します。

1.レシピを探しに来るユーザーは新つくれぽを見て、「これでいいや」ではなく「これ作りたい」と思えるようになるのか?
2.つくれぽ投稿者は、料理の楽しさをどうすれば表現できるのか?

1.レシピを探しに来るユーザーは新つくれぽを見て、「これでいいや」ではなく「これ作りたい」と思えるようになるのか?

まずはじめに、レシピを探すユーザー側の検証として、理想的なつくれぽが投稿された状態のクックパッドの検索体験のプロトタイプを作り、何度かユーザーさんをオフィスにお呼びしてユーザーテストを実施しました。

検索テスト

▲ユーザーテストで触ってもらったプロトタイプ

このプロトタイプでは具体的に以下のような仮説を持って作っています。

・キーワードで条件を絞り込んだあとに、ハッシュタグで料理の特徴やおすすめポイントで絞り込めれば新着順よりもよりその日の気分にあったレシピが見つけやすくなるのでは?

・静止画だけでなく、動画でも見れるようになることでより作りたくなる気持ちに繋げられるのでは?

・レシピを見て作った人がおすすめしている声だとわかれば、より安心感を持ってレシピ決定ができるのでは?

この頃はユーザーテストを週に1回、大体5名のユーザーさんに来てもらいながらテストを繰り返していました。

テストを行う度に発見と学びがあり、その都度調整を行って大枠の仕様を決定していきます。

ユーザーテスト中に以下のような学びが得られました。

・多くのユーザーは検索結果の上にハッシュタグが並んでいても気づかずスルーしてしまう
・いくら美味しそうな写真や動画に魅力を感じていても、それが家にある食材を使ってできるか?などがわからない状態でレシピを決定することはできない
・動画のつくれぽは作ってみたい!の気持ちを強くする(静止画をKenBurns効果で動かしても同様な反応)
・多くのユーザーは、見ているものをレシピを見て作った人のおすすめだと認識できていない。認識したあとだと作りたくなる気持ちは高まる

などなど…


このような学びや改善を繰り返し、探すユーザーが期待を超えるレシピに出会える理想的なつくれぽの形が見えてきました。

探すユーザーが期待を超えるレシピに出会える理想的なつくれぽの形とは…?

・ハッシュタグは食材名やメニュー名ではなく、そのレシピのおすすめなポイントを表現したもの
・静止画ではなく動画での表現がより作りたい気持ちを高める
・写真や動画は完成写真1枚ではなく、複数あったほうがより作るイメージが湧く


2.つくれぽ投稿者は、料理の楽しさをどうすれば表現できるのか?

探すユーザー視点での理想的なつくれぽの形が見えてきた一方で、そのような投稿をユーザーは投稿してくれるのか?どうすれば投稿できるようになるのか?はまだわからない状態でした。

そこで、実際にリリースされているiOSアプリに、現状のつくれぽ投稿を行ってくれたユーザー限定で、つくれぽとは別に「みんなのおすすめレポート」という機能を作り約2ヶ月間実際におすすめレシピを投稿してもらう検証を行いました。

プロダクトX

この検証では主につくれぽ投稿者が、レシピをおすすめするレポート機能があったら、料理の良さや楽しさを発信できるのか?という部分に絞って検証しています。

そのためなるべく文字数や写真の枚数などに制限をなくして投稿できるようにした上で

どんな写真や動画をどんな枚数投稿してくれるのか?
どんなコメントをどのくらいの分量で投稿してくれるのか?
どんなハッシュタグを投稿してくれるのか?

を観測していました。

結果、投稿してくれたユーザーさんの投稿物はどれも熱量のこもったおすすめのコメントを書いてくれることが多く、また数は少ないものの動画や複数枚の写真を投稿してくれることも観測することができました。

ハッシュタグの内容も、投稿時のプレースホルダーを工夫することで想定以上に単純な食材名やメニュー名ではない、そのレシピの良さをキーワードにしてつけてくれることもわかりました。

この、空想ではない実際のユーザーさんの投稿内容を先行して確認することができたことで、より詳細なつくれぽのフォーマットを決めることができました。

「おすすめレポート」限定公開から決まったつくれぽのフォーマット

・コメントは書く側がしっかりおすすめの理由を伝えられ、見る側も負担のない64文字まで
・写真や動画の数は10個もいらない。複数枚投稿するユーザーの平均をとって3つまで

このように、投稿するユーザー/検索するユーザーの両方の視点からプロトタイピングを繰り返し、最適なつくれぽフォーマットを探っていきました。

【開発フェーズ】 リリースに向けたデザインで意識したこと

ある程度コンセプトと大枠の流れやフォーマットが決まってきたところで次は、実際にリリースしていくためのデザインを考えていきます。

開発を進めていく上で意識したことについて3つ紹介します。

1.スピード重視で小さく始める

クックパッドのつくれぽ機能は現在月に約4万人のユーザーさんにご投稿していただいていました。
また、クックパッドのサービスを提供しているプラットフォームはiOSアプリ/Androidアプリに加え、PC/スマートフォンWeb/フィーチャーフォンの5つのプラットフォームあり、その全てでつくれぽ機能のサービス提供をしています。

すべてのプラットフォームで一度にリニューアルを行うのはユーザーへの影響も大きく、また開発コストもすごく上がります。

そのため、今回は動画とも相性が良い「アプリ」で弊社のエンジニアが多いiOSからリリースを行うことになりました。
※ もちろんプラットフォームの違いでつくれぽの概念が混在してしまうのは避けたかったため、全プラットフォームで感謝ではなくおすすめになるような、プレースホルダーなどの改修は行っています。

また、iOSの中の開発でも、新つくれぽフォーマットの投稿のみを一部ユーザー限定で公開するフェーズと、新つくれぽ投稿の全体公開+ハッシュタグからレシピを検索できるフェーズの2段階に分けてリリースを進めました。

フェーズを分けたリリース

フェーズを分けてリリースしたことにより、多くのご意見が寄せられる問題をなるべく早いタイミングで学習・改善することができたり、
先にハッシュタグ付きのおすすめつくれぽを集めたことによって、検索結果で表示されるつくれぽが少ないがっかり体験を防ぐことができるなど、たくさんのメリットがありました。

開発が長期化すればするほど、開発メンバーのモチベーションも下がってきてしまうこともあるため、切り分けれる変更は分解し、なるべく早くリリースすることが、大きな変更を行う上でとても大切だと考えています。

2.前のフォーマットのつくれぽと混ざっても違和感が無いデザインを

小さく始める事によって、前のフォーマットと新しいフォーマットのつくれぽが混在してくることが予想されます。

そのため、つくれぽ一覧など、新旧が混在してくる画面においては混ざっても違和感のない形を目指してデザインしました。
具体的には新つくれぽのみの要素(ハッシュタグ、複数枚写真、コメント64文字)は一覧では表示を省略していたりします。

つくれぽ新旧混在

しかし、これは機能の浸透に合わせてデザインも変えていくべきだと思うのでリニューアル初期のデザインとして意識したことでした。

3.今まで投稿していたユーザーのジャンプを少なくする

今まで習慣的につくれぽを投稿してくださったユーザーさんにとっていきなり変わりすぎてしまうと、難しそう/今までと違うから投稿できない などといった投稿のハードルが上がってしまうことを仮説として持っていました。

そのため、投稿画面は今までの見せ方と大きく変えずに初見の変化量をなるべく抑えることを意識しました。

つくれぽ投稿画面beforeafter

ただ、変化量をなくしすぎてコンセプトの変化に気づかれないようでは意味が無いので、アクションを行う瞬間に感謝ではなくおすすめであることをプレースホルダーなどで伝わるように工夫しました。

つくれぽ投稿中

まとめ

手をいれることがなかなか難しい、すでに使われているユーザーが多い機能をリニューアルするときのプロセスをご紹介しました。

クックパッドの開発の中では、仮説はとにかく早くリリースして試してみよう!ということも多くありますが、今回の変更は概念を変えてしまう後戻りのしづらい変更であったためさくっとリリースして確かめる、ということはとても難しく、通常よりも大規模な期間と人が関わる開発でした。

そのため、

1.リリース前の検証を速いスピードでたくさん繰り返すこと
2.学びたいことに対して適切な方法で検証を行うこと

を意識してすすめることが、仮説に自信をもって長期の開発をモチベーションを保つためにもとても大事だったと思います。

おわりに

クックパッドが本当にやりたいことは「毎日の料理を楽しみにする」ことです。

今回の変更はそのための一つの手段であり、はじまりに過ぎません。
毎日の料理を楽しみにしたい!という思いを押し付けではなく自然とユーザーさんに感じてもらえるような体験を生み出せるように、引き続きサービス開発に取り組んでいきます。

初めてのnoteが思いの外長くなってしまいましたが、これから既存機能のリニューアルをするぞ!という皆様の参考になれば幸いです 🙏

そしてクックパッドでは、デザイナーを絶賛募集中です🙌
興味を持っていただけた方、まずは話を聞いてみたい!という方はTwitterにDMを送っていただいても構いません。

また、「Cookpad Design」では毎週クックパッドのデザイナーがnoteで発信しています!こちらも良ければフォローしてみてください😄


この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
嬉しいです!!
161
クックパッドでデザイナーをしています

こちらでもピックアップされています

#デザイン 記事まとめ
#デザイン 記事まとめ
  • 4761本

デザイン系の記事を収集してまとめるマガジン。ハッシュタグ #デザイン のついた記事などをチェックしています。広告プロモーションがメインのものは、基本的にはNGの方向で運用します。

コメントを投稿するには、 ログイン または 会員登録 をする必要があります。