「食」のトータルサポートを掲げている『DELISH KITCHEN』。実際に料理を作るフェーズにおいても、さらなる使いやすさの提供を目指し「キッチンモード」が追加されました。どんな機能なのか、どのように企画開発されたのか、その裏側を担当者に聞きました。 ※「キッチンモード」は、iOSのみの反映となります(2020年2月時点)。
神谷 さやか
DELISH KITCHENカンパニー ユーザグロース部 App User Growthグループ
新卒でホスティングの会社に入社。その後、DMM.comやWEB制作会社でデジタルマーケティングやプロダクトマネージャーを経験。2018年4月エブリー入社。現在、DELISH KITCHENのプロダクトマネージャーを務める。
三浦 健太郎
開発本部 DELISH KITCHEN開発部 クライアントグループ
iOSアプリエンジニアとして、女性向けのゲームアプリの開発に携わる。その後5年ほど前からフリーランスにて活動を開始。2019年3月からエブリーにて、『DELISH KITCHEN』のiOSエンジニアとして従事。
「食」に関わる全てのフェーズをサポートする
ーお二人の現在の業務について教えてください!
神谷:『DELISH KITCHEN』のアプリの機能開発・サービス開発のディレクターをやっています。ユーザーがアプリを使いやすいように機能改善を行ったり、より多くの人に使ってもらうために新たな機能にはどのようなものが必要か企画立案を行っています。
三浦:私は『DELISH KITCHEN』のiOSアプリの開発エンジニアをしています。新たな機能の実装に向け、コードを書くだけではなく検証したり、時には料理もしたりディレクターと一緒になって開発に取り組んでいます。
ー今回リリースされた新機能「キッチンモード」。開発のきっかけはなんだったのでしょうか?
神谷:きっかけは、あるテレビ番組で『DELISH KITCHEN』を使ってハンバーグを調理されている方が、小指の関節で画面操作をしていたのを目にしたからです。もっと料理をしている最中に『DELISH KITCHEN』を使いやすくしたい、と調理手順ごとの動画をより見やすくするための機能を開発するこのプロジェクトを立ち上げました。
ー確かに!私も実際にレシピ動画を見ながら料理するときは、手のひらが油っぽかったり濡れていたりするので関節でシークバー(データの再生箇所を表示する機能)を戻していました。
三浦:とてもストレスですよね。『DELISH KITCHEN』では、もともと工程ごとの調理過程を分かりやすく視聴するために、動画を切り出し繰り返し見れるようにはしていました。ですが、どちらにしても画面操作が多くなってしまうことに変わりはなく、これに代わる機能として「キッチンモード」の開発がはじまりました。
神谷:もう一つ、私たちは「食」に関わる全てのフェーズをサポートしていきたいと思っています。『DELISH KITCHEN』は、アプリを開けばまずおすすめのレシピが提案され、全体で29,000本(2020年2月時点)を超えるレシピ数があり、全て管理栄養士監修による安心安全なレシピを提供しています。「レシピ検討の段階」「レシピを探す」といったフェーズではしっかりサポートができているのかなと思います。
アプリユーザーに向き合っている我々は、今回「キッチンモード」を開発することで、実際にアプリで動画をみながら「料理を作る」というフェーズにおいてもサポートを強化していきたいと考えています。
料理中の使いやすさを追求!
ー「キッチンモード」は、DELISH KITCHENの中で実際にどのように使うことができるんでしょうか?
三浦:「キッチンモード」は、各レシピの調理手順ごとの動画をより見やすくするための機能になっています。従来よりも少ない操作でレシピの各工程をループ再生させることができるため、お料理のペースに合わせて動画を見ることができます。
動画を開いて、全画面動画を再生中に、画面下部をタップ。もしくは上へスワイプを行います(写真飛左)。レシピ詳細画面にある「キッチンモードで料理を始める」というボタンをタップします(写真中央)。すると、手順ごとに分割された動画がループして流れる画面に切り替わります(写真右)。これがキッチンモードです。
三浦:次の手順に進む際は、画面左の「>」の領域をタップ、前の手順に戻る場合は、画面左の「<」の領域をタップすることで、手順動画の切り替えができます。従来よりも料理中に画面に触ることが少なく、調理工程を見ることができるようになりました。
ーまた、今回のアップデートでは「調味料☆問題」も改善されているとか?
神谷:はい!これはユーザーの皆さまからいただく声としても多いものなのですが、合わせ調味料などは、実工程になった際「☆を加えます」と表示され、そのまま動画を視聴しながら調理できないという問題です。いちいち材料のページに戻って確認しなければならず手間が発生していました。合わせ調味料が存在すると料理をはじめる時にわかってはいるのですが、洗い物が増えてしまいますし、最初に別皿で用意することは家庭ではあまりないですよね。今回の検証でも「☆って何だったっけ?」と一度動画を止め、材料が書かれた画面に遷移しなければならず、画面操作が増えてしまうなと改めて実感しました。
そこで、キッチンモードでは材料を簡単に確認できるようにしています。右上に「材料を見る」を設置し、いつでもそのレシピの材料が見えるようになっています。工程が進んで「☆ソースを加えます」と出てきても、ワンタップで必要な調味料と分量を確認することができるようになりました。
トータルサポートで生活に欠かせないサービスへ
ー合わせ調味料以外の時も便利そうですね!
神谷:ありがとうございます。ただ、現状iOSのみの対応ですし、試験期間を経て反映されたばかりでこの機能自体に対する認知度はまだまだ足りていません。実際にお料理をしながらこの機能を使った場合は、20~30分くらいアプリを起動することになるかと思いますので、そこを目指してアプリ内などでも認知されるようケアしていければと思います。
また今回の実装にあたっては、プロトタイプの検証を数回にわたり、実際にキッチンスタジオでチームみんなで料理をしながら行いました。もともと次の画面へはスワイプで進める仕様だったのですが、ワンタップで次にいけたらいいよねとか、タップ領域がもっと広い方がいいよねとか、触りごこちなども実際にいくつかパターンを用意して検証していきました。
三浦:気になる箇所はその場でみんなで指摘し合い、新しい仕様に抜け漏れがないかチェックしていきました。『DELISH KITCHEN』では、おかずからスイーツまで幅広く取り扱っています。表記についてもかなり違うので、その全てに対応させることが意外と大変でしたね。こういった部分はメディア企画やCXなどさまざまな部署の方々にもチェックいただきながら進めていきました。今回のプロジェクトでは、デザイナーさんも積極的に参加してくださり、使い心地をより細かに修正していくことができました。
ー日本最大級のレシピ動画アプリである『DELISH KITCHEN』で、今後どんなことに挑戦していきたいですか?
三浦:キッチンモードをさらに進化させていきたいですね。もともとは、触らないで操作できるということをチャレンジしていたんです。手が汚れていたりする料理中には触らずに操作できることがベストだと思いますので、これからも最新の技術を取り入れながらより便利な操作方法になるよう開発を続けていきたいです。
神谷:『DELISH KITCHEN』アプリとしては、OMO領域との連携も進めていかなければなと思っています。最初にもお話ししましたが、オンラインでもオフラインでも、レシピを決めてから料理を作り食べるまで全ての領域をサポートしていけるよう、アプリ内の機能開発と認知してもらうためのケアをしっかりやっていきたいですね。