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

电商类APP系列2:商品卡片竞品分析(附报告PDF

原创文章 分类: 经验/观点 版权:
540 5 2 0
2019-04-25
2.3
目录

一 项目背景
二 竞品概述
三 竞品目标功能对比
·卡片功能入口
·卡片内容
四 竞品目标功能纵向对比
·淘宝
·天猫
·考拉
·1688
五 竞品重点功能横向对比
·商品单品
·频道
·榜单
·关键词
六 总结


项目背景


1. 关于卡片化设计

安卓5.0Lillipop提出了MD设计语言,其中最重要的就是魔法纸片的概念——把真实物理世界中承载信息的“纸张”概念带入屏幕中,它拥有现实中的厚度、惯性和反馈。

魔法纸片是卡片化设计的前身,卡片的优势毋庸置疑:它可以将内容固定为不同的区块,统一容器,便于理解和记忆;又利于一稿适配不同尺寸的适配;而在卡片内可以搭建不同的内容,去满足各种的商业和业务需求。

从14年谷歌这一设计概念推出之后,卡片化设计逐渐风靡,也被引入IOS设计之中,如今已经成为各类APP表现层的常态,电商APP商品卡片化就是其中一种。

Image title

2. 我们为什么要做卡片化?

为了在原有商品feed流的基础上,丰富运营维度。借助卡片这一容器,承载除了商品之外的更多内容,给用户提供场景化推荐信息,比如搭配推荐、关键词细分、运营活动、榜单等。

目标:吸引用户在浏览中二次跳转,给其他页面引流,增加用户的使用时长和参与度,减少页面流失。



竞品概述

在竞品选择上,我们依旧选择淘宝、京东、拼多多、天猫这几款流量顶级的产品,以及1688、当当、唯品会、盒马生鲜、严选、考拉、咸鱼、转转等垂直类电商的产品。

经过进一步的分析,京东、拼多多、严选、唯品会并没有对商品卡片做多样化设计,依旧是常规的的单品卡片,因为此次不列入分析。

Image title



竞品目标功能

1. 卡片功能入口

电商类商品卡片形式丰富,常见于APP首页瀑布流、品类页、搜索结果页、为你推荐等等,此类卡片通常为竖版,基本结构为图片+商品信息。

当然除了常规商品卡片之外,还有秒杀、拼团、导购类商品卡片,第二类卡片不在此次分析范围内。

Image title


2. 卡片内容

通过对比和分析竞品的商品卡片,探索卡片具体可以承载的内容和信息。

根据分析,除了承载常规的商品之外,卡片还可以承载产品内部的频道、主题,各个榜单,搜索关键词,品牌,类目以及各种运营内容,具体见下图表格:

Image title



竞品目标功能纵向对比

1. 淘宝

淘宝的商品卡片在常规单品卡片的基础上,增加了:

搭配推荐:相关商品9宫格展示,点击进入搭配推荐页 相关频道推荐:ifashion、咸鱼、小黑盒、全球购、聚划算等频道,点击进入频道页 淘宝经验:可查看相关商品(左滑更多,点击进入商详页、点击底部切入淘宝经验tab

关键词筛选,点击进入关键词搜索结果页。

Image title


2. 天猫

天猫的商品卡片样式非常丰富,在首页商品瀑布流里,卡片包含推荐文案;而在天猫超市、天猫国际的频道里,商品卡片包含加入购物车按钮。

除此以外,卡片内容还包含店铺推荐:

推荐商品相关店铺:点击后直接进入店铺页; 榜单推荐为热销榜单:点击进入榜单页; 品牌推荐:商品品牌筛选结果页。

Image title


3. 考拉

考拉的单品卡片有两种:一种常规卡片、第二种包含实时用户评论。

必买清单和正在热议为社区内UGC或者PGC的内容,榜单为PGC或者OGC内容:点击后为文章类榜单列表页;分类推荐:点击后为筛选搜索结果页。

可能感兴趣则根据用户浏览数据,推荐3种类别。

Image title


4. 1688

1688首页FEED流和搜索结果页feed流的卡片整体结构虽然一致(图片+标题+介绍+按钮),但是设计风格差异比较大。

前者延续了淘宝的设计风格,在主题市场推荐和榜单推荐卡片中,都采用了轻量化、大圆角风格;而搜索结果页里,榜单和主题市场视觉上更加突出,单品卡片则展示更多的信息,优惠标签、发货地、回头率。

Image title



重点功能横向对比

1. 商品单品

单品是商品卡片最基本、最基础的内容构成,这个我们就不多说了。商品卡片最基础内容——商品图片、标题、价格。

商品卡片通常有竖版卡片和横版列表两种表现形式,很多APP都可以根据用户习惯在这两种形式之间进行切换,比如:淘宝、京东。

也有一些产品是只有竖版卡片的,此类对图片有更大的展示空间,适合服装饰品等以图片视觉为卖点的商品,比如主打穿搭的蘑菇街、主营水果蔬菜的每日优鲜。而横版列表可以展示更多的文字介绍信息,适合标品,或者说对图片不敏感的商品,比如叮当快药的药品、京东得电子产品、美妆日化等。

一个很典型的案例就是天猫搜索服装和美妆,搜索结果页里商品卡片有明显的区别。当然因为本司产品的定位为第一种,我们此次分析只聚焦于竖版卡片。

Image title


2. 频道

卡片承载频道功能,适合综合型电商类、产品体量庞大且品类丰富的产品。通过竞品分析我们可以看到,只有淘宝系的三款产品——淘宝、天猫、1688拥有此功能。

频道功能通常在搜索结果页feed流中出现,比如淘宝就根据搜索词推荐各种相关导购频道,如ifashion、小黑盒、天猫国际、天天特卖、极有家、每日好店等。

而在表现层上,淘宝和1688的卡片基本与常规商品卡片保持一致,均为单张商品图+文本信息的结构。相比而言,天猫的频道功能从视觉上看却更加突出,纯色渐变背景、1个or3个商品、点击按钮……这些设计上的视觉引导都体现出天猫频道功能有更高的权重。

Image title


3. 榜单

榜单也是商品运营维度中的一种,点击后进入榜单列表页,常见的榜单有热销榜、人气榜、趋势榜、好评榜等,也可以根据品类制作各种细分榜单。榜单类卡片的基础是榜单名称、介绍等基础信息,除此以外,还会通过按钮等CTA的设计,引导用户点击。

通过对竞品的分析对比,榜单卡片通常展示3-4个商品,给用户以内容丰富的预期;包含排名的角标,强化传递“榜单”这一信息,可以说是利用从众心理去激起用户想要了解的欲望,比如天猫和考拉。

也有产品显示单张商品图的、比如1688,卡片显示单个商品能够与其他商品卡片保持更好的一致性,当然缺点也是在此了,因为过强的一致性而不够突出。

具体选择单个还是三四个图显示,需要我们根据产品各个功能的权重去衡量具体的表现方式。

Image title


4. 关键词

关键词推荐是各个竞品中使用率比较高的一个功能,主要使用在APP首页的feed流中以及搜索结果页feed流中。

在首页feed流,关键词根据用户的历史浏览、购买记录等推荐相应的品类,点击后进入该词的搜索结果页,比如1688和转转、盒马都是如此;而在搜索结果页feed流中,关键词功能有两种,一种是筛选,比如淘宝会根据筛选里的分类,随机推荐各种筛选,比如价格区间、品牌、风格、参数等,点击后进入筛选结果页,关闭筛选词可退出。

第二种是添加搜索词,点击后依旧是搜索结果页,多个关键词组合后更精细搜索。比较适合商品品类、种类丰富的平台,比如淘宝和1688。

Image title



总结

本次报告主要对相应竞品的商品卡片入口、卡片内容、具体承载功能进行分析和总结。

建议结合具体功能内容及业务偏重,选择适合的呈现方式。如榜单推荐、店铺推荐类以入口展示为主,可以增加视觉吸引力,使用多个产品图模式展示;具体商品和以内容及价格展示为主,需要偏重浏览效率及内容完整性,使用单张图列表模式展示。

除此之外,建议以上模块加入CTA按钮,吸引潜在客户的注意力,诱使他们点击跳转、进入下一个阶段。


关注公众号「白鹭漫谈」,回复005,可以获得商品卡片竞品分析报告PDF(如下

Image title


 


白鹭漫谈

设计驱动增长

11粉丝/2关注

小有见解
为什么很多Redesign都失败了电商APP系列:“秒杀”模块竞品分析报告

扫描二维码
去手机端查看海报

白鹭漫谈

TA已经获得1枚勋章啦

  • 成就勋章

    • 特别勋章

    • 身份勋章

  • 已拥有

  • 作品

    创造者才是真正的享受者。

  • 经验

    经验是一所好学校,可它的学生却经常旷课。

  • 活跃

    大神都是从围观群众开始的

  • 拓展

    作品、经验、活跃还不能满足你?

京ICP备14007358号-1 / 京公网安备11010802014104号 / Powered by 2008-2019 UI.CN