原文作者知乎先小龙


推荐人:郭子迎

根据调查,2016年全球购物车放弃率在75%左右,这个数字恐怕比我们想象中的高了很多。而导致这个的原因其中包括:

  1. 过高的额外成本,例如运费、税费等
  2. 注册流程的中断
  3. 支付流程的中断,例如支付流程繁琐、余额不足等
  4. 过高的商品价格,没有优惠
  5. 用户仅仅是用于收藏
  6. 商品因为缺货或下架等无法购买

接下来,慢慢剖析一下一个合格的购物车的基本设计。

目录: 1、购物车的作用
2、购物车的入口设计
3、立即结算和加入购物车的区别
4、加入购物车的前置流程
5、购物车系统与其他系统的关联
6、购物车的产品结构
7、点击购物车之后是弹出弹窗还是跳转页
8、如何减库存
9、唤醒

一、购物车的作用

购物车不是简单的一个添加商品然后下单的功能,背后设计的内容比较复杂,他能够与会员系统、商品系统、库存系统、订单系统等紧密结合,设计购物车的时候要考虑到与其他系统产生的关联关系。
购物车的作用是什么?

产品设计-电商前台-购物车设计总结 - 图1

产品设计-电商前台-购物车设计总结 - 图2

二、购物车的入口设计

所谓入口设计就是能和购物车产生交互的入口。而我们在设计入口的时候,应该将自己融入场景,应需而现,通常在搜索列表页面、商品详情页面、秒杀、专题等活动页面出现,通常在这些场景中,用户是需要做出购买决策的,当然,也可能是用于商品收藏。
另外,入口也可能来自于用户的收藏夹、历史订单中。
入口设计的目的在于能够让用户基于不同场景将商品添加到购物车或者到购物车结算。
而在入口设计中,会衍生出另外一个谈的比较多的话题,就是立即购买和加入购物车的区别。

三、立即购买和加入购物车的区别

以下是淘宝和京东商品详情页立即购买和加入购物车的截图。

产品设计-电商前台-购物车设计总结 - 图3

从本质上来说,淘宝是C2C的,是由各个卖家独立管理或发货的;而京东是B2C的,是大部分是自营的,有统一的物流体系。
就像去逛菜市场,不可能把每个摊位的菜都放到菜篮子了再去一一结账,而在沃尔玛购物,则可以将选购商品放到购物车了再到收银台付账。当然,像京东的秒杀商品也是提供立即购买的,因为大家都希望用最短的流程和时间购买这件秒杀商品。
设计立即购买还是加入购物车绝对不是一个0和1的问题,应该按照场景来定。

四、加入购物车的前置流程

根据实测显示,淘宝、京东、美团等平台的流程是点击“加入购物车后”,是成功将商品加入购物车,提交订单的时候才提示登录/注册。
而唯品会点击“加入购物车”时就需要登录/注册。
而我更倾向于建议先让用户加入购物车,在结算的时候再弹出登录框,过早提醒会中断用户的浏览过程。
而若不登录加入购物车会出现一个问题,特别是在PC端,如果用户清理了浏览器cookie的话,购物车里面的商品就会灰飞烟灭,这一点用户体验不是很友好,但用户主动清理cookie的情况比较少。

五、购物车系统与其他系统的关联

购物车与订单系统
在购物车下单之后,需要把购物车里面的商品信息提交到订单系统。
购物车与库存系统
如果是加入购物车减库存,这个时候就要考虑在库存系统中做减库存操作。
购物车与价格系统
若商品加入购物车后,商家修改了商品价格,那么购物车的价格也相应的调整。
购物车与促销系统
购物车自动关联该账户下的优惠信息。
以上只是简单的说明购物车与其他系统之间会产生的交互,在设计购物车的时候,要仔细考虑和其他系统产生的交互,如果考虑不全面,可能会导致商品数量出现问题、结算信息出现问题等。

六、购物车的产品结构

购物车常见的产品结构如下图:

产品设计-电商前台-购物车设计总结 - 图4

关于购物车的智能推荐,建议不要推荐同类商品,而是推荐周边商品或配套商品。比如我往购物车里面添加了一台电脑,更完美的推荐应该是推荐鼠标、键盘这类的周边商品,用户一看,这款键盘很帅啊,说不定就促进转化了。但是,如果又推荐电脑给用户,用户忽然看到推荐的电脑也很棒,然后,他又陷入了深深的纠结中,反而增加了购物车的放弃率。

在购物车列表中,以下几点需要重点关注:

(1)自动勾选本次挑选的商品
因为用户很可能把购物车当做收藏夹或者暂存库来用,购物车可能沉淀了很多商品,而用户本次购买的商品可能是用户购买优先级高的,就需要本次付款的,所以最好的处理方式应该是自动勾选本次挑选的商品。

(2)排序问题
购物车内的商品排序也是一门艺术,同理,需要将最近添加的商品放在前面,让用户一眼就看得见它。有人可能就说了,可以把时间久的商品放在前面来提醒用户还有没有下单的商品,达到唤醒的目的,但是我想说的是:用户当下的需求是什么,你得先满足了。

(3)合计处理
目前淘宝、京东的做法都是按照店铺合计商品的,这样做的底层逻辑在于批量选择一个店铺的商品结算后能够对应到统一的物流和商家。
因为添加的商品可能因为排序问题和合计处理之间的矛盾,一般的做法是将最新添加商品的所在分类排到前面来。
(4)上限商品数量
京东购物车上线数量是200件,而淘宝我还没有测出来,因为我已经测到2010件都是可以添加的到购物车并下单的。而唯品会是同款商品限购2件。这跟平台的具体形态有关。

(5)购物车商品的异常处理
添加到购物车的商品,可能因为下架、缺货、促销等原因处于异常状态,通常处理方法是将该商品信息至于灰色并提示无货,置于不可勾选状态。

七、点击购物车之后是弹出弹窗还是跳转页面(让用户选择去结算还是再逛逛)?

这个问题的本质在与鼓励用户尽快结账还是继续购买。
对于男性用户来说,购买目标明确,就是要买这个东西,所以我们更希望是跳转页面希望用户尽快结账。
如果是客单件低,可以让用户继续逛逛,凑单什么的。
如果是客单价高,例如买电器,更多的可能是让用户直接去结算。
另外个是基于用户行为数据的,根据用户的行为数据分析,用户的特征及喜好是怎样的,根据用户的喜好来。
所以,最好的解决方法是根据基于用户画像及行为数据的解决方案。

八、如何减库存

购物车设计中比较关键的一点就是:何时减库存?
减库存常见的做法有三种:

产品设计-电商前台-购物车设计总结 - 图5

以上的优缺点只是相对的,并不重要(所以我用了灰色)。
重要的是场景融合,平台自身的情况是什么,根据情况分析,甚至于目前我正在做的平台是卖虚拟商品的,根本就没有减库存这一说。而且即便是减库存的方式有缺点,我们也可以通过一些机制去弥补这些缺点。
我在测试的时候,把京东自营的外星人笔记本电脑都全部下订单了,再加入购物车时提示无货了。而已经下了的订单提示需要在24小时内支付(紧俏商品会有单独的时间限制),否则商品就会释放(总不能占着茅坑不拉屎吧)。而自主或被动的取消订单后,该商品就会恢复库存。

产品设计-电商前台-购物车设计总结 - 图6

而比如唯品会,加入购物车之后便会减库存,但是需要在20分钟内提交订单,提交订单后需要在30分钟内完成支付,否则该商品就会释放到库存中。因为唯品会做的是折扣抢购商品,必须要尽快将商品释放到库存中,让真正需要购买的用户能够买到。

九、唤醒

开篇提到,购物车因为种种原因放弃率是很高的,那么降低放弃率的方法有哪些呢?

  1. 发放优惠券等
  2. 把配送的下限调到最低
  3. 运费减免或凑单
  4. 发送营销短信/邮件

有关调查显示,在1小时内发送首条挽回短信/邮件客户完成交易的概率高达19.8%,而如果是延迟至24小时之后,成交率却骤降至11.6%。

我昨天在唯品会添加到购物车商品,下午给我发了一条短信提示,今天发了一条短信提示。而且你看昨天的短信,告诉我送了我一个30元的优惠券,就问你有没有有一点心动?但是值得注意的是,有个短信发送的时间是早上9:56,正是我工作很忙的时候,要么是短信都不打开,要么是打开看了之后没有时间去购物车下单,转过身,又忘却在了无边无际的工作与烟花柳巷中。所以,提醒的时间就显得尤为重要了,建议在晚上6-9点之间向用户发送短信,这样的唤醒几率更高。

产品设计-电商前台-购物车设计总结 - 图7

说在最后,这只是讲解了一些购物车的常见设计,而具体情况需要具体分析。不在于优缺点,而在于场景。