Daily Cocoda! Day7 「フードデリバリーアプリのリスト画面」

『都内に住む会社員向け/食べたいものがすぐに見つかるフードデリバリーアプリ』

時間がない会社員が短い時間で食べたいものを選ベルように、トップ画面で複数のカテゴリを閲覧できるようにしました。「どんなものが食べたいか」「どれくらい早く食べられそうか」「おすすめの食べ物は何か」によって主に食べ物を選択するのではと思ったので、食べ物の種類、お届け時間、人気のお店ごとにお店を絞り込めるようにしました。

プロセス（3時間）

1. 参考UIの収集

   • Pnterest、Dribbleでいくつか参考になりそうな画面を収集

   • 他のフードデリバリーアプリ（UberEats,楽天デリバリー）の画面の問題点を考えてみる

     トップ画面で店名のみ表示されているものが多く、忙しい人にとっては絞り込みにくいのが問題ではと思った

     →どのような画面にしたら条件を絞り込みやすいかを考えてみることにした

   • 条件の絞り込みかたを見るためにAirbnb、DelishKitchenのトップ画面を参考にした

2. ツールでのデザイン

   • 写真とアイコンは素材集から持ってきた
   • 「食べ物の種類」は1つが伝える情報量が少なく種類が多いのでボタン式に横に並べる
   • 「お届け時間」、「人気のお店」はお店の細かい情報も伝える必要があるため大きめに配置。
   • 「人気のお店」は、「お届け時間」で表示できる店舗数と比べ特に表示する個数の制限が決まっていないため、スクロールしやすいように下に無限に続くように配置

反省点と次やること

• できたこと

  絞り込みのパターンを複数個考えて表現すること
  
  

• できなかったこと

  アイコンなどを作る力があまりなく、ビジュアルの細かい詰めがうまくいっていないのでは（パスをいじるのウルトラ苦手）

  あまりガイドラインを意識できていない（フォントのサイズなども既存の画面からいちいち持ってきたりしているのでなんか非効率な気がする）

  本当にユーザーが求めているのか？までは検証できていない

  
  

• 次やること

  もう少しビジュアルに時間を割く、アイコンなども１から作ってみる

  ターゲットに実際に使って意見をもらう

  ガイドラインの全量把握→意識できそうな箇所をピックアップしてお題に取り組む

  時間を意識する