淘宝特色聊天:聊天宝贝的差异化设计

21天Excel零基础速成训练营,导师带学+答疑辅导+实战作业,让你真正掌握Excel技能,了解一下>>

本文将以聊天宝贝设计为例,展示设计师在淘宝特色聊天中的思考和实践。enjoy~

在淘宝,每天有上亿人使用聊天功能。与其他IM产品不同,淘宝的聊天场景具备其特色的电商因素,如用户与客服询问宝贝/解决订单问题,商家在群中推广活动/与粉丝会员发放权益,好友间交流分享宝贝等,这决定了淘宝IM电商特色的基因。而在设计中,我们需要挖掘其中的差异。

本文将以聊天宝贝设计为例,展示设计师在淘宝特色聊天中的思考和实践。

淘宝特色聊天-聊天宝贝的差异化设计

我们将聊天宝贝全链路划分为两个场景:发宝贝,看宝贝。继而针对这两个场景拆解用户体验目标/商业目标并挖掘设计的发力机会。

淘宝特色聊天-聊天宝贝的差异化设计

旧版本聊天宝贝链路痛点列举:

淘宝特色聊天-聊天宝贝的差异化设计

▲宝贝卡片(商品识别度低)&发宝贝工具(搜索难用)

宝贝卡片升级

1. 什么样的卡片适合呈现聊天宝贝

淘宝的主营类目更侧重于服饰时尚类,用户主要以图片中的信息认知商品,因此小图消息卡片并不适合承载该类目商品,使用更大的商品图有助于用户对服饰时尚类商品认知的提升。其他app聊天中的商品卡片基本采用与其他卡片通用的小图卡片。

淘宝特色聊天-聊天宝贝的差异化设计

▲ 微信/钉钉针对聊天宝贝的处理

2. 淘宝特色的聊天宝贝卡片设计

在思考聊天宝贝卡片的设计时,我们要考虑两个方向,差异性与信息承载力。

差异性:因为消息的复杂程度,消息同时支持着手淘多个业务。卡片的类型众多,形态各异又存在一定的共性,宝贝作为手淘的核心产品,一方面需要表现出与其他卡片的差异性,一方面需要在表现差异性的同时需要具备很好的辨识度和手淘特有的本质。

淘宝特色聊天-聊天宝贝的差异化设计

▲ 新旧宝贝卡片对比

信息承载力:针对于淘宝主导的服饰时尚类类目,更大的图片有助于用户对商品的认知。

淘宝特色聊天-聊天宝贝的差异化设计

聊天宝贝的核心诉求是转化,更多维度的商品信息透出可以更吸引消费者。淘宝提供了多种维度的信息让用户了解宝贝,例如优惠、用户评价、商品核心属性等。我们尝试将这些信息简化归类,适当的在聊天宝贝中透出,为消费者提供更多的认知商品维度。

淘宝特色聊天-聊天宝贝的差异化设计

▲ 宝贝赋能图例

淘宝提供了丰富多样的促销活动,我们提炼这些促销信息元素,使聊天宝贝可以同步透出参与的重要活动,使淘宝商品在全链路上的信息保持一致,增加用户认知聊天宝贝的维度。

淘宝特色聊天-聊天宝贝的差异化设计

▲ 促销活动图例

3. 上线效果

从3月份灰度测试到如今全量上线,带来的数据提升符合我们的预期,点击率大幅提升,曝光率也高于之前预期效果。

发宝贝工具设计

1. 在聊天中及时发送宝贝

上文提到淘宝中的聊天主要场景都是与宝贝相关,因而在聊天中发送宝贝功能也是淘宝特色的必备功能。对于发宝贝工具,核心要解决的是怎么发-发宝贝链路设计及发什么-可发宝贝池设计两部分。

2. 发宝贝的链路设计

对于发宝贝工具,我们将其定位为聊天附加工具,置于加号功能拓展区首位。

淘宝特色聊天-聊天宝贝的差异化设计

▲宝贝功能处于功能拓展区首位

用户在使用发宝贝工具时,需要了解宝贝信息,需要有明显的发送行动指引,部分用户在某些场景下需要发送多个宝贝及搜索宝贝。

淘宝特色聊天-聊天宝贝的差异化设计

▲发宝贝工具中的宝贝列表 &发宝贝工具中选中行动点

淘宝特色聊天-聊天宝贝的差异化设计

▲发宝贝工具中搜索 &发宝贝工具中多选

用户在发送宝贝时需要具体发送那些宝贝呢?我们将于用户相关的宝贝逐一例举,包含最近的聊天中、购物车中,收藏夹中……并根据用户发送宝贝习惯及主要的聊天场景的对来源进行排序。

淘宝特色聊天-聊天宝贝的差异化设计

▲针对用户习惯/聊天场景因素对宝贝池来源排序

整体演示动画:

淘宝特色聊天-聊天宝贝的差异化设计

写在最后

针对聊天宝贝的可优化方向不止这些,还包括宝贝卡片中具体的内容深化,发宝贝的快捷方式,宝贝的互动等方向可以继续深挖等等,设计师们会继续探索。如果你有好的建议或创意,也欢迎一起讨论。

 

作者:消息平台组,公众号:淘宝设计

来源:https://mp.weixin.qq.com/s/RCcKOUvZTv4ky14Sl_YtBA

题图来自Unsplash,基于CC0协议

评论
欢迎留言讨论~!