商品加入购物车现在已是电商产品的标配，只要是电商产品，都在自己的APP上都加上了购物车功能。

1. 前言

我们还原一下我们生活中逛超市的场景：

一进超市的入口，首先是找一个购物车或者购物的篮子，然后开始按照自己的路线开始逛。（这个逛的路线是超市精心为用户设计的，确保你购买的过程中能尽可能的逛到用户需要买，想买且利润相对靠谱，购买频次高的商品品类）

一路逛过来，买一些必备的蔬菜，水果等消耗品。看到冷冻区商品打折，看看有没有自己想买的三文鱼有无特价，有就也放进购物篮子里。继续走，看到花车特价，翻一翻，什么蛋糕，饼干好像也可以屯一点，买买买。继续逛着，左翻翻右瞧瞧，有什么质量不错的入的了眼价格又合适的商品就放进去。

排队结账中，发现自己的购物车里好像有一些商品不是特别需要，或者有些超出预算，或者忽然想起家里还有，拿出来，不结算。到自己结账了，看到结帐区有一盒口香糖，顺便也拿一盒，随身带着。

日常的购物车的使用流程还原基本如上，从消费者一进门到结账出门，购物车一直在消费者身边，深度参与了购物的整个流程。

在电商产品中，购物车的功能与现实生活中很类似。

2. 购物车的作用

2.1 购物车的收藏功能

购物车的收藏是带着购买预期的收藏，而本身的收藏功能就是喜欢所以收集商品，暂时并没有购买的计划。

不知现在本身产品购物车与收藏功能用户的使用数，所以无法做出判断。就个人体验而言，我用各种电商产品的购物车比收藏功能次数要多。

2.2 购物车商品对比功能

（1）比价

同一商品不同商家提供的价格不同。用户同时添加在购物车对比，同一商品，挑选最低价的购买。

（2）对比商家

同一商品，价格差不多，对比商家的好评维度，哪个商家的好评多，目标商品卖的多，就买哪家

2.3 促进用户消费

购物车的存在隐含着用户一次性买单消费的暗示，且这种暗示已经潜移默化的内化成消费者共同的认知。我们在购物车中呈现的商品别表，有什么优惠信息都可以及时推送给用户。

（1）单品促销

单品降价了，可以直接在购物车的商品单品里呈现，刺激用户消费。

（2）组合促销

例如满200减20，可跨店。都是属于这种促销，也会刺激用户消费。提高消费者的消费单价。

（3）店铺促销

例如淘宝的店铺领券。一般都是满60包邮，而当前用户放在购物车准备购买的商品价格才49，促进用户领券再次挑选本店商品凑单购买，提高用户的消费单价。

（4）帮助用户下购买决策

库存紧张这样的字眼在购物车列表的单条商品中出现，也能帮助用户下购买的决定。

（5）当购物车的商品失效的情况下（库存不足/商家进行了调整）推荐类似的商品链接，帮助用户快速找到相似商品且刺激用户下购买的决定。

2.4 收集消费者喜好数据，为千人千面的消费推送做数据收集

每个人的消费喜好是不一样的，从人口基本属性来说，女人喜欢买衣服鞋子，男人喜欢买电子商品等等，性别不同，产品给用户推送的商品内容不一样。购物车的商品基本都是消费者自己心仪且有购买打算的商品，经过时间沉淀，每个人的购物喜好基本可以推算出来，以此为基础来做商品的推送，更加精准，促进消费者买单。

例如：现在的“猜你喜欢”这个栏目，完全是根据自己最近浏览的商品，放进购物车的商品进行的推送。

3. 购物车的入口与出口

4. 购物车的离线与在线

在PC端，有四种情况：

1. 用户未登录，打开浏览器，添加商品到购物车，然后关掉浏览器，再次打开同一个浏览器，购物车的商品还在；
2. 用户未登录，打开浏览器，添加购物车，直接登录购买，合并到已登录账户购物车；
3. 用户登录，添加商品到购物车，关闭浏览器，再次打开浏览器，不登录，购物车的商品不在；
4. 用户登录，添加商品到购物车，换个设备，打开浏览器登录，购物车的商品还在。

用户未登录的情况下难以实现数据一致的根源在于，目前为止没有安全可靠的办法获取设备唯一标识。如果将来如果有技术解决这个问题，用户在同一个设备中装多个浏览器都能保证数据一致。

这里带出的一个问题是登录是否需要前置的问题。

笔者私以为，PC端京东的体验比较好！

（图为未登录状态下添加商品到购物车）

可以将心仪的商品添加到购物车，在未登录的状态下，还可以对购物车的商品进行删除操作。除非要进行删除后续动作，例如移动我的关注才需要用户进行登录或者注册。

5. 加入购物车与立即购买的区别

（图为网易严选商品详情局部）

（图为京东商品详情局部）

（图为淘宝商品详情局部）

笔者对比了亚马逊，京东，淘宝，网易严选和小米有品，发现除了京东，其他的电商平台都是立即购买与加入购物车同时出现。

还原用户使用流程：

用户点击立即购买，进入结算流程。

用户点击加入购物车，依然可以去逛其他的商品，等逛得差不多了点击购物车查看都有些什么商品在购物车里，然后在对比，看看哪些符合预期是自己得心头好，怎样的购买方式更划算，在发生购买结算行为。

场景模拟还原：

（1）用户会在什么场景下尝试直接购买呢？

• 大明用户（用户画像概念来自于梁宁老师），明确知道自己要买什么
• 因当天商品有活动（团购，限时促销等与时间强关联得商品活动）

（2）用户在什么场景下会添加购物车呢？

• 就有点心动的商品，但是还没有到非买不可得地步
• 商品预售，活动预热等，看到消息，但是还未开售，商家只是对商品以及用户接受程度做一个试探

有一种说法是商业模式的不同决定了购物方式的不同，所以京东B2C就支持用户加入购物车，多种商品一次性付款，帮助用户节省运费以及获得更多折扣等。笔者认为这只是早期京东的一个产品设计架构的延续，现在的京东更多的是商家入驻提供丰富多样的商品，所以未来肯定还是会加上立即购买的button，方便用户能快速抢到自己心仪的产品，毕竟立即购买的路径更短嘛。

那什么情况下只用“立即购买”比较合适呢？

笔者认为，类似于机票，酒店这样的一次性购买产品比较适合立即购买，不加入购物车，还有那种家庭大宗商品，例如中央空调年终大放价，有时间期限的特价，可以直接只放一个“立即购买”，帮助用户下定购买的决策。

而且在表达“立即购买”的文案上也可以更加情景化。

（图为去哪儿机票预订截图）

（图为去哪儿网酒店预订页面）

还有类似于保险，企业服务，旅游产品等。都适合只放一个“抢购”这样的按钮帮助用户购下购买决策。

以此类推还可以推出其他消费场景：众筹/献爱心/抢购特价商品等。

总结：分场景去设计功能按钮，而不能简单的一刀切。

两种方式的主要区别：鼓励客户尽快去结账还是鼓励客户继续购买

6. 购物车中的商品逻辑

回顾一下电商产品为什么要做购物车的目的：

• 对用户来说，一是省钱，二是省事；
• 对平台来说，一是提高客单价，二是促进交易。

购物车承载在这么重要的一个愿景，那在购物车商品呈现上要多挖掘用户内心的小九九……

排序

购物车的商品排序是一个比较复杂的事情，影响商品排序的有：

1. 平台主推
2. 商品库存
3. 优惠幅度
4. 商品添加时间

以京东的购物车为例，用户点击购物车，默认全选，计算全部应付金额。

那这里的设计就需要注意到多元素：

首先，商品本身的属性信息呈现与库存状态，例如数量，颜色，尺码，材质选择，码数等，与之匹配的库存状态的匹配和呈现。

其次，商品的促销信息设计；

如图所示，笔者收集了一些市面上的销售玩法，不详尽的地方，欢迎指正。

那具体的排序就要看公司当前的需要了

例如：京东，打开购物车，同一时间有添加京东自营的商品到购物车，默认都是排在第一位；默认排序按照时间添加；商品库存状态出现异常（无库存）则默认排在后面。同一时间添加，出现更大优惠的商品往前排。

用户其实并不关心排序，他只关心自己放在购物车的东西闲暇的时候看一眼，心仪的产品降价了，买买买，自己喜欢的商品库存紧张了，赶紧下单买买买，跨店有活动了，凑单买买买，商品有团购价了，呼朋唤友买买买。

电商产品只要有购物车功能，那么牵涉到的其他的功能模块有：

• 订单模块
• 结算模块
• 搜索模块
• 会员系统
• 优惠活动
• 商品管理
• 注册登录

这里笔者只是列出来，在进行产品设计的时候会涉及其他哪些模块，具体设计不呈现。

7. 小米有品购物车反推

笔者要反推的是小米搜索商品–浏览–添加购物车这个流程：

测试环境：Android 6.0.1

手机：OPPO R9S Plus

有米有品版本号：2.2.3.126

先梳理下购物车的思维导图：

再梳理添加购物车的流程：

倘若是直接浏览，则流程很短相对会短一点。不过我们设定的流程是搜索商品——添加购物车，所以这里不展示浏览商品——添加购物车的流程图。

还原页面流程图：

（页面流程图）

如此，开始进入还原产品原型阶段：

（产品原型全图）

来看下细节：

（后续图片见大图）

从购物车添加这里走了一遍购买流程。

以上，便是还原小米有品搜索——添加购物车——以及购买的页面还原。

笔者梳理从购物车添加这里走了一遍购买流程：

小米有品做的很舒适的一点就是APP产品的登录后置，反推用户使用场景：

在电梯里面看到小米有品的广告，正好是自己想买的秋季产品，扫码下载一个，找到目标商品，添加购物车，这个时候才提示用户要登录。并非有明确目标的购买商品，所以这个时候，弱化登录相对来说是一个比较好的选择，产生添加购物车动作的时候才进行登录的指引，相对于用户一下载APP就让用户注册/登录的做法来说，没有那么强势，体验更加自然。

8. 总结

8.1 小米有品添加购物车的时候，添加立即购买按钮需要数据支撑

小米有品在添加购物车这个动作中，当需要选择商品参数的时候，给了用户一个更多的选项。笔者觉得会让添加购物车这个动作给用户一种变得冗长得感觉。推测出发点是为了促进用户得购买，倘若能得到内部在此步骤购买转化的数据，才能得出更加准确得是否需要在此界面添加“购买”按钮。

8.2 登录流程后置

小米有品的手机APP登录是前置的，用户一旦要添加购物车，就需要走登录or注册流程。这里可以参考当当APP的做法，用户未登录且能很好的保存未登录状态下放入购物车的商品。小米有品的PC端添加商品到购物车这里也是登录前置，这里可以参考京东PC端做法，支持未登录情况下添加商品到购物车，且支持删除，体验更顺畅自然。

8.3 小米有品的优惠活动需要更多花样

可能与小米有品是个新产品有很大的关系，所以他的促销方式比较局限。更多的是单品促销。

以上，欢迎批评指正。

本文由 @ 一个APP的诞生 原创发布于人人都是产品经理。未经许可，禁止转载

题图来自 Pexels ，基于 CC0 协议