恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
外卖产品用户体验分析
0.0°
2017-10-09 原创文章 经验/观点 举报 4314 2 11 1

外卖产品用户体验分析


分析的目标

通过对主流产品的分析、改进焦耳外卖的用户体验。


分析对象

美团外卖、百度外卖、饿了么、口碑外卖、焦耳外卖。


分析角度

一切以用户为中心,主要分析内容为产品体验要素的结构层、框架层、表现层。从结构层开始更多的是研究用户体验部分,结构层关注产品的交互以及信息架构,框架层关注产品的界面设计,表现层关注单个页面的的视觉体验。除焦耳外卖外其他产品都是平台型产品,与焦耳外卖结构有所不同,基于我们的分析目的,我们主要分析的是用户浏览菜品-选择菜品-等待送达(催单、退单)三个模块。


点餐页面 

Image title


导航栏

五款产品点餐页面结构基本一致主要为侧栏导航+菜品区域

Image title

对比分析:侧栏导航宽度一般为80px或者85px,高度百度外卖为50px、美团外卖为46px、口碑外卖为44px、饿了么为54px。


解决方案:实际使用中口碑外卖单行点击区域高度过小,所以单行点击区域高度定义为50-54px比较合适,宽度定义为80px比较合适。保持原字号13,字体颜色默认状态为#666,选中状态为加粗#333或者主题色,分割线由通栏变为不通栏的形式,减少视觉干扰。


其他元素:四款平台产品除百度外卖外点菜后都在菜品导航区域有小红点提示在此分类下点菜数量。


菜品区域

菜品区域用户关注度是菜品图片>价格>名称>菜品信息、已售数量


Image title



对比分析:百度外卖菜品区域视线流:菜品图片>名称>价格>商品信息

美团外卖菜品区域视线流:名称>图片>价格>菜品信息

口碑外卖菜品区域视线流:名称>图片>价格>月销>商品信息(菜品月销售数量与商品信息做了层级的区分,相比于其他平台层级多了一层)

饿了么菜品区域视线流:图片>名称>价格>月销售>菜品信息

焦耳菜品区域视线流:名称>菜品图片>价格>菜品说明  

 

其他元素:口碑外卖对招牌、新品菜品会在名称右侧标注。饿了么对招牌、新品菜品会在菜品图片上方标注。美团外卖对新品、网友推荐会在价格上方标注。


解决方案:用户关注度与视觉流应保持一致性所以对焦耳菜品区域做一些调整。增大菜品图片到95*95,名称字号保持14号、颜色#333,增大价格字号为18号 加粗 ,商品说明与月销售数颜色,字号大小保持一致。


优惠券 

Image title

对比分析:五个平台都有优惠券,其中百度、口碑是通栏的,美团 、饿了么不通栏

其中三家平台对优惠券进行了拟物化的设计。


解决方案:焦耳优惠券没有进行拟物化设计,且不够突出,优惠券对单量有很大的促进作用,可以对优惠券的设计做点文章。


banner

对比分析:商家页面百度外卖、美团外卖、焦耳外卖有banner,百度外卖为通栏banner只会展示单个,美团外卖为不通栏banner,上下排列展示。焦耳banner不通栏,轮播。


解决方案:由于焦耳banner 尺寸小且滚动造成了信息传达的困难,调整方案为加大banner尺寸或者取消banner。


提交订单页面 

Image title


对比分析:提交订单页面,五个平台一般分为送餐信息、订单详情、其他(备注、发票)三个信息组,除口碑外卖外页面信息都是送餐信息>订单信息>其他的顺序,所以不对页面信息顺序做调整。


首先来看送餐信息,送餐信息组主要包含姓名、手机号、地址三个信息,在提交订单页面用户更为关注的是送餐地址,排序方式应该是送餐地址>姓名>手机号。所以焦耳提交订单可做一些调整:去掉送货地址、送达时间两个标题,送餐地址信息突出显示于最上方,姓名及手机号显示在送餐地址下方。


订单详情信息组一般包含店名、菜品信息、包装配送费、优惠信息及价格。其中店名、菜品信息、餐盒配送费可作为一个信息组,优惠信息可以作为一个信息组。


五个平台中只有焦耳、美团外卖在菜品信息中存在菜品图片,站在用户的角度考虑,用户在对菜品信息足够确认才会在浏览菜品页面进入提交订单页面,所以不必要过多的去呈现菜品信息。进入提交订单页面用户更为关注的是送餐信息以及优惠信息,所以在提交订单页面取消菜品图片,以列表显示菜品名称、数量、单价。


提交订单页面中优惠信息(代金券、团购折扣、代金券)应该作为重要信息去呈现,用户进入提交订单页面主要目的是为了确定最后支付价格,站在产品角度,需要促进用户进行付款所以显示出优惠金额至关重要,对于这种可以促进转化的信息可以重复出现,所以在订单详情与底bar都显示出已优惠金额。


底bar一般由支付金额、提交按钮构成,四个平台点击提交订单按钮是进入到付款页面,而焦耳因为只有一种支付方式所以直接弹出微信付款窗口,所以在这个界面用户要进行的下一步操作是付款,而不是提交订单,所以提交订单按钮改为立即支付/确认付款按钮较为符合用户预期。

更新:2017-10-09

收藏

2人已收藏

匹诺曹

行走在路上的苦行僧。

  • 14

    作品

  • 9

    粉丝

  • 26

    关注

  • 移动端UI规范
  • 吃饭儿管理系统UI kit
  • FOUND(摄影资讯)
  • 小练习

    猜你喜欢

      2017-10-09 原创文章 经验/观点 举报 4314 2 11 1

      外卖产品用户体验分析

      0.0°

      你确定要举报外卖产品用户体验分析

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年09月30日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      11
      2
      1

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录