• HOME
  • >
  • blog
  • >
  • 【わかりやすい視覚設計を解説!】アプリデザインのUX改善×Ai機能サービスとは?「クックパッド編」

【わかりやすい視覚設計を解説!】アプリデザインのUX改善×Ai機能サービスとは?「クックパッド編」

投稿日:

はじめに

サイトを利用した時、こんなUXになったらいいのに…と思ったことありませんか。

ここでは色々なシステムやサイトのUX改修を勝手におこない、より良いユーザビリティを目指し、提案します。

今回は料理レシピ投稿・検索サービス「クックパッド」アプリについて考えてみました。
本記事では「クックパッド」IOSアプリのトレンド画面を改修します。

商号
クックパッド株式会社(COOKPAD Inc.)
資本金
5,286,015,000円(2020/12現在)
従業員数
547人(2020/12現在)
業界
料理レシピを主としたインターネット業
サービス紹介
クックパットアプリ(App Storeプレビュー)

現状の課題/改修の方向性

今回のターゲットであるクックパッドアプリのサービスを調査したところ、ユーザーが「レシピを投稿する」「レシピを探す」どちらも行っており、それによって、レシピの量産と人件費の削減を実現しているのではと感じました。また、つくれぽ機能があることによりそのレシピの信憑性を確認でき、レシピの質を保っていると見受けられます。

つまり、クックパッドのサービスは「レシピの量産」「人件費の削減」「レシピの質の維持」これらを同時に行うことによって、他のレシピアプリにはない大きな強みになります。

その強みをもっと活かす事ができれば、クックパットアプリはもう一つのSNSとして幅広いユーザーから重宝されるサービスとしてさらに成長できるのではと思いました。

クックパッドアプリのユーザーは大きく以下の2種類に分けられ、どちらも満足させる必要があります。

  • レシピを探したい(見たい)ユーザー
  • レシピを投稿したいユーザー

まず①「レシピを探したいユーザー」に対して、アプリの操作性には大きな問題は見受けられませんでしたが、機能面でより理想的なサービスを提供するために以下の改修案を考えました。

  • ユーザーの目的に合わせたコンテンツの強化
  • ユーザーの利用シーンを考えたコンテンツ配置
  • ユーザー間コミュニケーションを活発にするための情報設計

また、②「レシピを投稿したいユーザー」に対して、以下の改善案を考えました。

  • 操作性を意識したUI改善
  • 投稿したものに対するポジティブな評価が視覚的にわかるUX設計
  • より投稿したくなるポイント制度の導入

まずは以下の画面案をご覧ください。

※プレミアム会員の場合の画面案

UXUI改善後のクックパッドの画像

改修案

UX及び情報設計

現在のクックパッドアプリのトレンドの画面では、自分に合ったレシピが探しにくい、レシピ投稿までの導線が遠いなどの懸念点を含め、よりユーザー観点からの改善の余地が考えられます。対策として、現状の「トレンド」画面を「ホーム」画面に概念を広げ、カテゴリーやコンテンツをより充実させ、各カテゴリーへの(サマリー機能を兼ねた)入り口として活用するような工夫が必要です。

ヘッダー

  • ユーザーの幅広い年齢層を考えてメニューを押しやすい大きさに変更
  • 利便性の高い3つの新機能(AIおすすめ料理/食材購入/新規投稿)ボタンを設置

追従フッター

  • 各種をわかりやすいネーミングに変更
  • 既存メニューのクリップ機能は同じ内容、動作数なので、クリップを削除
  • プレミアム機能が収集されているページに飛ぶプレミアムとマイページを追加

新サービス提案

コンテンツ領域(既存コンテンツの見直し及び新コンテンツ追加)

  • レシピを探すのも億劫な方に「今の気分に合わせて料理を提案」を追加
  • 既存コンテンツをユーザーのニーズ(想定)に合わせて再編成(人気のテーマTOP10、今日のおすすめ料理、話題のタグ)
  • 撮影した手元の食材をAIが分析し、その食材に合わせたレシピを提案する「AIおすすめ料理」を追加
  • 料理に必要な食材を選び注文すると、提携したスーパーからお届けする「食材配送」を追加
  • レシピの信憑性の確認と投稿者のモチベーション向上のため、レシピに投稿者といいね数、つくれぽ数を表示
  • アプリから簡単に自分のレシピを投稿できる機能を追加

UIコンセプト

コンテンツを上記ほど充実させると複雑化する可能性があるため、コンテンツを整理し、適切な場所に配置する必要があります。

全体のデザインコンセプトとして、曲線や角丸をシンボルとしました。ファーストビューの背景の図形はテーブルをイメージし、「今日のテーブルに並ぶ料理は?」という意味がこめられています。テーブルに料理が並んであることを想像することで、料理するモチベーションが上がることを意識しています。また、曲線を使うことでターゲットである女性に、親しみやすく使用してもらうことを目的としています。

まとめ

ユーザーの利用目的の1つとして「レシピを探したい(見たい)」とありますが、実はその目的の根源は別にある事が多く、その目的を深堀していくことで、ユーザー自身でも気づかなかった本当の目的や悩みが解決できるサービスが提供できます。

今回の改善案の1つ例として「外食は高いからご飯を作らなきゃいけない。何を作るかは決まってないけど、なるべく手間のかからない”レシピを探したい”」という悩みを解決するために考えた「今日は何作る?」コンテンツは、「ご飯を作らなきゃいけない」という言葉にポジティブな印象が薄く、料理をするのに気だるい印象があるため、モチベーションをあげるためにも、なぜかやってしまう心理テストに似たUIにし、気分でポチポチ押すだけで今の自分にピッタリな料理が提案されるような対策を施すことで解決を試みました。

根源であるユーザーの目的や悩みを見つけ、UXデザインで解決することで、ユーザーに長く愛されるサービスとなります。

ユーザーの目線に立ち、「どこがストレスなのか」「求めているものは何か」をきちんと把握・仮設に基づいた検証を繰り返しながら改善していくことが、UXデザインにおいて大事なポイントとなります。

【今すぐにでもデザイン思考を重視したプロジェクトを推進したい場合は】

UXデザインコンサル会社 / Webコンサル会社へ業務を委託するというやり方が考えられます。

幅広い業種・規模での経験があるUXDoctorでは、経験に基づきUI/UXデザインコンサル会社の選び方を無料公開しております。

UI/UXデザインコンサル会社の選び方を無料公開してます。

どんな基準で、何を見ればいいか分からない方におすすめです。

資料をダウンロード

error: Content is protected !!