Daily Cocoda - フードデリバリーアプリ制作
Overview
Date : 2019年9月
Time : 1日
Type : practice
Tools : figma
Challenge : フードデリバリーアプリのHOME画面、検索結果画面、商品購入画面の制作
与えられた要件：
・ペルソナ ＝ 20代会社員/食事は外食多め
・ユースケース ＝ オフィスでのランチ/一人暮らしの休日のご飯
・ユースケース ＝ オフィスでのランチ/一人暮らしの休日のご飯
Process
1. リサーチ
※長くなるので、最後に記載しました
※長くなるので、最後に記載しました
2. コンセプトメイキング
●ステートメント
食生活を改善したい人のためのデリバリーアプリ
食生活を改善したい人のためのデリバリーアプリ
●ペルソナ/ユーザーの特徴
・20代会社員
・食事は外食多め
・お腹が空いた時はコンビニなどで適当に空腹を満たす
・あまり自炊をしない
・面倒臭がり、効率主義
・平日は仕事が忙しくランチの時間を取れない
・休日は家でゴロゴロ
●ユーザーの課題
・コンビニ食などが多く、飽きた＆食事が偏っている
・生きていく上で必要な栄養素をあまり摂取できていない
●コア体験
アプリ一つで健康に優しい食事ができる＆毎日必要な栄養素を摂取できる
・20代会社員
・食事は外食多め
・お腹が空いた時はコンビニなどで適当に空腹を満たす
・あまり自炊をしない
・面倒臭がり、効率主義
・平日は仕事が忙しくランチの時間を取れない
・休日は家でゴロゴロ
●ユーザーの課題
・コンビニ食などが多く、飽きた＆食事が偏っている
・生きていく上で必要な栄養素をあまり摂取できていない
●コア体験
アプリ一つで健康に優しい食事ができる＆毎日必要な栄養素を摂取できる
●コア機能（他のデリバリーアプリとの差別化ポイント）
・健康に配慮した食事のラインナップ
・カロリーや栄養素の表示
・食事のおすすめポイントを一言で表示『1/2日分の野菜摂取』など
・摂取したい栄養素が含まれた食事の絞り込み検索
・栄養素の説明（＋αとして）
└詳しくみるをタップすると栄養素の説明に飛ぶ
●デザインの方向性
○見やすい分かりやすい
└料金を見やすく
└店舗名はアイコンでも表示して感覚的に分かるように
└カートに入れている商品のウィジェット化
└カートの中身はスクロールしなくても下部に固定して合計の金額が分かるように（スクロールしないと合計金額わからないのはストレス）
○ヘルシーで美味しそうな雰囲気
└色使い
└写真
・食生活が悪い自覚はあるので、どうにか改善したい
・健康的な食事を心がけたい
・かといって自炊は面倒臭い
・コンビニは飽きた
・毎回外食は高い
・毎回コンビニや店を探して行くのが面倒臭い
・食べたいものが食べたい時間に近くに届けば良いなぁ
・できるだけ節約したい
・健康に配慮した食事のラインナップ
・カロリーや栄養素の表示
・食事のおすすめポイントを一言で表示『1/2日分の野菜摂取』など
・摂取したい栄養素が含まれた食事の絞り込み検索
・栄養素の説明（＋αとして）
└詳しくみるをタップすると栄養素の説明に飛ぶ
●デザインの方向性
○見やすい分かりやすい
└料金を見やすく
└店舗名はアイコンでも表示して感覚的に分かるように
└カートに入れている商品のウィジェット化
└カートの中身はスクロールしなくても下部に固定して合計の金額が分かるように（スクロールしないと合計金額わからないのはストレス）
○ヘルシーで美味しそうな雰囲気
└色使い
└写真
3. 行動/操作のシナリオ作成
●価値シナリオ
（①ユーザーの欲求/ユーザーがやりたいこと(価値) ②価値と関連のあるシーン）
・食生活が悪い自覚はあるので、どうにか改善したい
・健康的な食事を心がけたい
・かといって自炊は面倒臭い
・コンビニは飽きた
・毎回外食は高い
・毎回コンビニや店を探して行くのが面倒臭い
・食べたいものが食べたい時間に近くに届けば良いなぁ
・できるだけ節約したい
②価値と（アプリが）関連のあるシーン
・休日に家にこもっている時に、食べたいものを注文すると家に届く
・平日にオフィスで働いている時に、食べたいものを注文するとオフィスに届く
└健康的な食事が届く！
・休日に家にこもっている時に、食べたいものを注文すると家に届く
・平日にオフィスで働いている時に、食べたいものを注文するとオフィスに届く
└健康的な食事が届く！
●行動シナリオ（①行動ストーリー②アプリ上で発生するタスク）
①行動ストーリー ○休日家パターン
せっかくの休日、外に出たくないけど、今食べたいものが家にない・・・
コンビニに買いに行くのも、着替えて化粧して面倒くさいなぁ
あ！友達に勧められたデリバリーアプリ使ってみるか！
食べたいものを検索したら、店舗や価格、カロリーなどで比較して選択できるし、
カロリーだけじゃなくて『1日に必要な野菜の○分の1を摂取』とか出てくるから、
健康を意識した食事ができそう！
○平日オフィスパターン
今日はバタバタしていて、ゆっくり外食してランチをとる時間がなさそうだなぁ
コンビニのご飯は健康に悪いし飽きたし、何か別のものを食べたいなぁ
周りの同僚が使ってるデリバリーアプリ使ってみるか・・・
でも昼前に大事なミーティングがあるから頼めないんだよなぁ
今頼んだら冷めちゃうしなぁ
おお！時間を指定して予約配達もできるのか！
しかも、自分が受け取らなくても指定した場所に置いといてくれるなんて・・・
これなら、朝のうちに頼んで置いておいてもらおう〜
せっかくの休日、外に出たくないけど、今食べたいものが家にない・・・
コンビニに買いに行くのも、着替えて化粧して面倒くさいなぁ
あ！友達に勧められたデリバリーアプリ使ってみるか！
食べたいものを検索したら、店舗や価格、カロリーなどで比較して選択できるし、
カロリーだけじゃなくて『1日に必要な野菜の○分の1を摂取』とか出てくるから、
健康を意識した食事ができそう！
○平日オフィスパターン
今日はバタバタしていて、ゆっくり外食してランチをとる時間がなさそうだなぁ
コンビニのご飯は健康に悪いし飽きたし、何か別のものを食べたいなぁ
周りの同僚が使ってるデリバリーアプリ使ってみるか・・・
でも昼前に大事なミーティングがあるから頼めないんだよなぁ
今頼んだら冷めちゃうしなぁ
おお！時間を指定して予約配達もできるのか！
しかも、自分が受け取らなくても指定した場所に置いといてくれるなんて・・・
これなら、朝のうちに頼んで置いておいてもらおう〜
②アプリ上で発生するユーザーのタスク
・ログイン（決済や個人情報の登録）
└アレルギー登録なども事前にできる（このアプリは一人利用がメイン）
・配達場所の指定
・配達時間の指定
・食べたい食事の検索
・決済手段の選択
●操作シナリオ
食べたい食事を検索→決定→ログイン or ログインせずに配達場所と時間の指定→決済選択→配送
4. コンテンツ分類軸の設計
✔️コンテンツが持っている属性を元にする視点で考える
●検索絞り込み
└摂取したい栄養素ごと
└食べたい食事の指名検索
└店舗検索
└カロリーの度合い
●食事の比較検討に必要な情報
└カロリー
└配達時間
└店名
└摂取できる栄養素
└オススメの一言『野菜1日分が摂取できる』
（レビューや評価は今回は省きました。他人の評価ではなく、自分に必要な栄養素を自分の判断で摂取してほしいため。食事の味＜健康を意識して選択）
●配達場所の選択
└現在地
└自宅を登録
└オフィスを登録
└その都度住所を入力
5. UIモデルを設計 -UI Flowsの作成
●オブジェクト：ユーザーがみるもの
- 料理（タイトル、説明文、写真、店舗名）
- カロリー
- 配達時間
- 栄養素
○アクション：ユーザーがすること
- 食事の検索
- 絞り込み検索
- 配達場所や配達時間の指定
- 食事の注文（サイズや個数決め）
- （会員登録）
●改善点
○『カートを確認する』→『カートに入れる』→『注文する』というフローにおけるボタンの役割とデザインの変化がわかりにくい
○『カートを確認する』と『カートに入れる』は、異なる意味を持つにも関わらず、同じボタンを使用しているのは、ユーザー体験が良くない
○べた塗り→アウトラインへの変化かつ、一番大事な『注文する』ボタンのみ、アイコンがないのは良くない、プライマリボタンこそ一番情報のコントラストを高く強調する
○カロリーと時間表示の間の『/』が『〜分の一』にも捉えられてしまうので、『・』などに変える必要がある
○2枚目の左右marginを意味もなくバラバラになてしまっているのは良くない
-------------＋α リサーチについて
●デリバリーアプリ
○Uber eatsの問題点
・例えば、『タピオカ』と検索した時の検索結果は、店舗の写真が表示される（ハンバーガーの写真など）が、ハンバーガーではなくタピオカを探しているのでストレス
▶︎検索した商品の写真を表示し、店舗はロゴで視覚的に分かるように小さく表示
○楽天デリバリーの問題点
・食べたい食べ物をキーワードで検索できない、なぜ店名のみしか検索できないの？
▶︎食べ物でも店舗でも検索できるようにする
・食事の写真が美味しそうじゃない
・情報の優劣がなくて見にくい
○出前館
・UIめっちゃ好き見やすい
・何分で到着するかが強調されてて良い
○ドミノピザ
・UXはよくないけど（戻るボタンがない画面があってタスキルするしかなかった）UIは世界観があって素敵
・・・・・・検索結果・・・・・・
・・・・・・商品詳細・・・・・・
・・・・・・カート内・・・・・・
（同じ親会社なのでUNIQLOとGUが同じ笑）
