突き進めるデザイン ｜ クックパッドマートで学んだことまとめ

こんにちは！

立教大学観光学部4年の武藤亜里紗です。
デザインを始めてまもなく、1年が経とうとしています👩🏻‍🎨

8月から2ヶ月間、株式会社クックパッドの生鮮ECサービス『クックパッドマート』でインターンをしました。デザイナーとして初めて現場に立って学んだことは、

強いデザイナーは、事業の未来を描いて導ける力を持っている！！ということです。

ユーザーだけでなくチームに対しても、デザインでできること。それは、相手の気持ちを想像したり、これいいよね〜を大事にするなど、どんな現場でも活用できるスキルでした。

💡 このnoteでわかること
・新しい環境でサービスの「らしさ」を掴むためにしたこと
・他業種と連携しながら、プロジェクトを推進できた実例
・心地の良いルール作りのために気をつけたこと
・クックパッド就業型インターンでできること

👤 ぜひ読んでほしいひと
・お世話になったひと
・デザイナーを目指しているひと

クックパッドマートは、新鮮でおいしい食材を注文できるネットスーパー

アプリで注文した商品を、指定した日付と場所で受け取ることができます。受け取り場所は、都内のコンビニやメトロにあります。

生産者や販売者からこだわりの食材を直接購入できるので、安心安全さらに新鮮！

私のおすすめは、梅やさん「焼き鳥セット」です。美味しいだけじゃなくて見た目のインパクトがすごいので、宅飲みで盛り上がります。

🍅　🍅　🍅

サービスの 「らしさ」 にこだわりつつ、ユーザーが飽きないを新しさ創る

会社やサービスにはそれぞれ個性があり、目に見えない「らしさ」があります。入社後1番の壁は、クックパッドマートの「らしさ」を壊さずに、ユーザーが飽きない新しさを創ることでした。

掴めずにいましたが、ずんこさんが雰囲気が近い画像をFigmaに貼り付けてくれました。その後、Pinterestや雑誌を読みあさりました。

そして行き着いたクックパッドマートマート「らしさ」を私なりの言葉で表現すると「人の気配を感じる、やさしい暖かさ」です。

「らしさ」を全体向けに言語化すると、ルールっぽくなってしまいます。しかし、自分の中に言葉があるとクリエイティブの軸になるのでおすすめです。

🍅　🍅　🍅

事業背景を熟知して、やる・やらないジャッジができたら、決めた方向に突っ走る

手を出さない領域や優先度の判断は、自分の弱みでした（気になったら即やってしまいたい派...🏃🏻‍♂️）
そんな中、まちぇりさんが課題分解を教えてくれました。大きな課題を分解し、やる・やらないを決めることで、目標に向かって自信を持ってスタートすることができます。

課題分解によって上手くいったプロジェクトを紹介します！少々マニアックなお話です...⚠️

まとめ
・現状の温度感を把握する
・理想を考えてみる
・実現できなかった歴史を熟知する
・課題分解＆優先順位づけをする
・解決策を決める

●課題

注文後にエラーが出たときに、スムーズに対処ができない

●現状

クックパッドマートは独自配送ルートで、商品をお届けしています。
生産者用の共同集荷所やトラック、受取り場所のどれかが満杯で、注文を承ることができない商品があると注文エラーとなります。

ユーザーは手動で該当商品を削除する必要があります。しかし、現状だと何をどれだけ削除すれば注文できるのかわからなかったので、エラーがでてもスムーズな買い物体験ができるように考えました！

●完成したデザイン

・注文できない商品を自動削除
・削除した商品リストの横にお気に入りボタンを配置

注文できる商品はスムーズに注文できて、注文できなかった商品は、お気に入りから簡単に注文できるようになりました！

- - -

●現状の温度感を把握する

CSのまりこさんにヒアリングしたり、エラーレポートの確認を行いました。早急かつ丁寧な対応が求められる課題であることがわかります。

●理想を考えてみる

できる・できないは置いておいて、これができたらいいよな〜を紙でアイデア出ししました。

●実現できなかった歴史を熟知する

事業は現状の仕様に行き着くまで、取捨選択のドラマがあります。なので、遠慮したり、知ったかぶりになるのではなく、色んなポジションの人から教えてもらう姿勢が入社後は大事だと思います。

ただ、新メンバーは、ユーザー目線に1番近い存在です。率直な意見を言うことは、新メンバーにしかできないことなので、どんどん頼るといいです💪

●課題分解＆優先順位づけをする

「注文後にエラーが出て注文できない」発生原因は5パターン。発生頻度が最も高いのは、共同集荷所での満杯エラーでした。

課題が大きすぎたので、できないことを分解。MUST/WANTで解決したい2つの課題がわかりました。

MUST：注文できる商品をスムーズに注文できる
WANT：注文できない商品を次回、スムーズに注文できる

ここから解決策となるアイデア発散します。

●解決策を決める

満杯エラーの判定は、共同集荷所 → トラック → 受け取り場所の順に処理が行われます。そのため、注文できない商品を削除しても、解決しない可能性は残ります。フェーズ1としては、この点は考えない判断をしました。そして解決策も絞り込みます！

MUST：注文できない商品を自動削除する
WANT：注文できない商品をお気に入り登録する

大事なもの以外を削ぎ落として、突っ走ることができた実例でした！

🍅　🍅　🍅

自分がいなくなっても、生きるデザインをする！

エンジニアや他のデザイナーへの引き継ぎ、スムーズにできていますか？
普段のデータ管理や共有ができていないと、お互いタイムロスになってしまいます。

私の汚データが、先輩たちの教えによって少しづつキレイになり、プロジェクトでも上手くいった出来事がありました。

まとめ
・デザイナーとして意思決定する
・考えた形跡を残す
・あらゆる想定をメモする

●課題

・冷蔵庫が開かないときの対処法が試されていない
・本当に必要なユーザーだけにオンライン解錠手段を提供する

●現状

ユーザーは、商品受け取り時にQRコードで冷蔵庫を解錠します。しかし、スマホや冷蔵庫の不具合で、開けられない場合があります。FAQに対処法は記載されていますが、サポートへのご連絡が絶えません。FAQで解決できた方がスピーディなので、対処法の提供方法を考え直しました！

●完成したデザイン

・受け取り画面から対処法への導線を配置
・文字だけでなく、画像も表示
・対処法とQRコードを同時に表示
・オンライン解錠の提供

冷蔵庫が開かないという普通ではない状況でも、焦らず対処法を試してもらえるようにしました。

- - -

●デザイナーとして意思決定する

案出し後は、上司に選んでもらうのではなく自分の推しを用意します。さらにその推しは、他の案よりも多少作り込みます。
自信のある案を持つことで、自分のデザインスピードも上がりますし、チーム内の判断軸にもなります。選んだ説明をするので、言語化ができるようになるメリットもあります◎

●考えた形跡を残す

進捗共有は毎日しました。MTG毎だと、メンバーは把握に時間がかかります。方向修正があった場合、間違った方向に突っ走っていた時間がもったいないです。
また、最終的に案が戻ることもあるので、すべてのデーターを透過度30%にして残します。

クックパッドマートは、進捗状況に関わらず、人に見てもらって意見を伝え合うことを大事にしてました。Slackで「このあと5分だけいい？」はあるあるです👀

特に新人の場合、先輩たちは心配してくれているので、どこまでできていて、どこで詰まっているのか、はすぐに伝えた方がいいです。インターン中は、すぐにZoomを繋いでくれたので安心して取り組めました。

●あらゆる想定をメモする

エンジニアは空気を読んでやってくれるすごい方たちですが、上図のようにメモで残したら喜んでもらいました。

🍅　🍅　🍅

ルール作りはHIGをベースで、ユーザーのメンタルモデルを優先する

ダイアログルールを決定し、コンポーネントを作成しました。作るに当たってHIGやマテリアルデザインなどを見て、クックパッドマート「らしさ」を保てるダイアログルールを目指しました！

まとめ
・ルールはなるべく少なくする
・例外を許さない
・客観的に判断できる軸を作る
・世界観を作る
・運用できる形にする

●目的

メンタルモデルにあう一貫した体験を提供して、ユーザーが常に期待するアクションをできるようにする

●完成したルール（一部抜粋）

・タイトルはアクションに対する質問、もしくは処理を予告する
・ボタンはタイトルに同意：右、拒否：左
・Image内にタイトルが入る場合テキストの内のタイトルをなくす

HIGベースで考えると、破壊的なアクションは左側にきます。しかし、「常にタイトルの質問に対して同意の場合は右」というユーザーの習慣を優先させることにしました。

- - -

●ルールはなるべく少なくする

ルールがありすぎると、自由な発散を妨げてしまいます。「これはしないでね」というNG例を作ると「これをしてください」よりも、考えられる幅が大きいからおすすめです。

●例外を許さない

ルールに当てはないものは決して許さず、ルールに当てハマるように考え直します。できなかったら、ルールをそもそも見直した方がいいです。１つ許してしまうと、どんどんルールは形骸化してしまいます。

●客観的に判断できる軸を作る

最初は「強い処理が実行される場合はキャンセル」という判断軸にしていたのですが「強い処理」は主観的な判断になってしまう...
そのため「このダイアログでアクションが完了するか？」といった誰でも同じ判断ができるような軸を用意しました。

●世界観を作る

私なりの「らしさ」である「人の気配を感じる、やさしい暖かさ」が感じられるコミュニケーションを、ダイアログでも目指しました。

そこで考えたのが「未来志向型」というキーワードです。

例えば、クックパッドマートは都内の一部地域が対象です。対象外のユーザーに対して、「できません」ではなく「今はできないから、あなたの地域を教えてね」と要望を出してもらう流れに変更しました。

こちらの方が将来使ってもらえる可能性が広がりませんか？？🙋🏻‍♀️

●運用できる形にする

ルールやコンポーネントは、使われないと意味がありません。デザイナーがあったら嬉しいルールにすることが大切です。なので、勝手に作るのではなく、たくさんFBをしてもらいました。朝会での発表や、Figmaに使い方を記しておくなど、ルールが浸透することを目指しました。

😭　😭　😭

最高で、大好きなチーム！

2ヶ月間本当にお世話になりました！いまだに寂しいです😭
朝会したい...

最初は、よねださんと一緒に働きたい！成果で恩返しがしたい！という気持ちでインターンを始めました。
よねださんは、去年デザイン知識ゼロの状態の私を拾ってくれた大恩人です。この1年のよねださんとの歩みはnoteもう1個かける...😭ので省きます笑

もちろん、一緒に働けたことは夢のようなことでしたが、他のメンバーの方も最高で最強でした。
毎日Zoomでフォローしてくださったずんこさんは、フォトショ教室開いてくださったり。まちぇりさんは、朝から「こうするのはどうだろう！！？」って駆け寄ってくれて。ときぽんさんには、将来のことや今までやってきたことをたくさん聞きました。大河さんも歩凡矢さんも業務中にはあまり関われなかったけど、朝会やランチでお話しました🥰

みなさんとても優しくて、たくさんの方にお世話になりました。改めてありがとうございました！！

たった1人との出会いで、こんなに素敵な人たちと出会えたこと、それだけでも感謝してもしきれないです。よねださんみたいに、誰かに愛をもって学びを与えられる人になりたいです。

🍅　🍅　🍅

絶賛就活中です！

今はサイバーエージェントのCLというメディアサービスでインターンをしています。12月からは制作会社さんでもインターンする予定です。違う挑戦になってくるのでワクワクしてます！
21卒ですがいろんな人と出会って、自分の選択肢を広げたいです。

ポートフォリオはこちらです。
お話してくださる方は、Twitterにご連絡ください☺️
👉@nonsugar5122_a

最後まで、ご覧いただきありがとうございました！！