所有分类
  • 所有分类
  • 未分类

淘宝美食怎么挑?吃货们看完这一篇就够了

在我们的前两篇系列文章《淘宝首页2018:回归初心,化繁为简》、《淘宝频道去哪儿了:频道体系设计升级》中,已经带大家对本次淘宝首页、频道升级背后的设计故事有了比较全面的了解。首页“我的频道”板块之中,具体的导购频道又将如何在这次升级中实现蜕变?这些导购频道的背后有着怎样的设计思考?本文将以吃货们的最爱——美食频道“汇吃”为例,介绍美食场景导购背后的设计探索。

环境与现状

01|首页与频道升级

2017版的淘宝首页强调的是场景化的导购概念,通过“我淘我家”、“淘遍全球”、“时尚大咖”等场景,聚合相似的垂直导购频道。而在2018版的淘宝中,更强调每个导购频道的场景垂直性,及其自身的特征与个性。从原来定坑的出现方式变成了根据用户行为,在猜你喜欢feed流中混排,进行个性化展示。

淘宝美食怎么挑?吃货们看完这一篇就够了

02|食品行业导购

食品是在整个淘系内消费占比很大的一个垂直行业,但在淘宝内还没有特征明确、功能清晰的食品类导购产品。用户如果想要购买美食,只能在搜索框通过搜索相关字段进行查找并查看相关的推荐字段,或是在现有的“生活家”、“有好货”、“必买清单”等导购频道下浏览查看。搜索的方式找到的美食比较有限,导购频道推荐的食品也相对大众化,且导购的方式也较为单一,难以帮助用户发现千奇百怪的美食。

在这样的大背景下,“汇吃”频道便应运而生,旨在打造吃喝消费的第一入口,帮助用户发现新奇有趣的美食,满足广大吃货们对吃的追求

设计目标

基于以上业务背景,我们提炼出设计层面的目标。

01|频道心智表达

频道心智表达是指通过设计使得用户能快速清晰的明确产品是什么,能为用户带来什么价值。通过与项目组同学的讨论,频道的功能定位“帮助用户发现新奇有趣的美食,提升种草过程的愉悦感”。清晰明确的心智能强化用户对频道的认知。从而提升用户浏览时的愉悦度,更能提升用户对产品的使用粘性。

02|产品导购效率

产品定位上,主要是帮助用户提供发现美食的内容导购,其核心价值是帮助用户种草,满足用户逛的诉求。设计的另一目标则是提升信息的传达效率,提升用户的浏览效率,尽可能多的为吃货们种草。

在确定设计目标的同时,我们也需要确定衡量设计目标的相应客观数据。数据衡量指标可以帮助我们清晰化设计目标,同时可以帮助迭代之后的设计方案。

淘宝美食怎么挑?吃货们看完这一篇就够了

体验定位分析

在开展具体设计工作前,我们从三个维度进行分析,帮助我们明确产品的体验定位。

01|用户诉求

食品行业的用户整体偏年轻化,尤其是在零食、坚果、冲饮类,高价值用户整体集中在1-3线城市。我们选择了若干目标用户进行深度访谈,了解吃货们的购买偏好和浏览习惯,最终为频道构建了用户画像。

淘宝美食怎么挑?吃货们看完这一篇就够了

从用户视角出发,提炼产品体验的关键词为有趣的、活泼的、轻松的

02|平台特性

用户所熟知的淘宝是万能的,无奇不有、丰富多样,因此,在淘内的食品导购产品与外部其它产品相比,也应该丰富有趣的。此外,结合阿里巴巴的天然背书,要求我们的产品是具有品质感、信赖度的。

从平台视角出发,提炼产品体验的关键词为趣味性、丰富性和品质感

03|业务特性

食品行业

不同的垂直行业天然存在较大差异性,相比其它服饰、家装、3C等行业,食品行业客单价低,用户决策成本低,多是依赖于商品图片和价格,不太关注商品其它的利益点。

内容导购

内容类导购更进一步优化信息内容,拓展商品广度,从单纯推荐商品到推荐一种价值观,帮助用户决策,对用户有较强的吸引力。其形式也更加多样,包括图文、视频、社区等。

从业务视角出发,提炼产品体验的关键词为吸引人的、高效率、丰富感、内容感

04|体验定位

通过以上不同维度的分析,得出“趣味性”、“丰富性”、“内容感”、“发现感”等关键词,最终综合收拢汇总出“汇吃”频道的体验定位——淘遍新奇特美食

淘宝美食怎么挑?吃货们看完这一篇就够了

设计策略:心智分层设计

在频道首页的框架上,我们根据用户的浏览路径,采用分层设计的策略。将首页分成“是什么”、“干什么”和“有什么”三个部分,不同阶段满足用户的预期,并希望分别能达到“焦点式”、“承接式”和“沉浸式”的体验感受。

淘宝美食怎么挑?吃货们看完这一篇就够了

头部区块是用户进入频道后第一眼认知的区块。我们通过精细化、综艺化的形式对内容进行包装,帮助用户在进入频道后,能快速完成心智的对焦和匹配,了解频道的调性和功能。

颈部区块的作用是维持住用户的浏览兴趣。通过算法进行人与货的标签匹配,向用户展示个性化内容,抓住用户兴趣,减少在该区块的跳失。

通过之前模块的筛选,能够进入尾部区块浏览的用户是频道的核心用户,因此在该区域的内容应最大限度还原内容本身,把各种有趣的美食呈献给用户。

具体做了什么

01|头部心智栏目:内容呈现高效化

内容调性提炼

在前期,我们会深入到内容的定义中,和运营同学一起讨论该把怎样的内容呈现给用户。

淘宝美食怎么挑?吃货们看完这一篇就够了

最终“汇吃”频道的心智栏目确定在两个类型:“今日网红味”——以视频吃播的形式,介绍当下最流行热门的新奇事物;“每周食令”——以图文的形式,介绍时下最应季的食物及文化。

栏目框架设计

确定了内容的具体类型和调性,就要对其设计在页面上的展现形式。在初期,我们进行了不同的尝试,包括视频的沉浸感、内容感等设计方向。

淘宝美食怎么挑?吃货们看完这一篇就够了

淘宝美食怎么挑?吃货们看完这一篇就够了

最终考虑到平衡效率与氛围,以及多档栏目的心智,采用了卡片的设计形式,在背景层使用当期栏目的封面图,更有整体感和沉浸感。

淘宝美食怎么挑?吃货们看完这一篇就够了

视觉调性把控

在完成心智栏目的框架设计之后,我们对视觉表现进行了深入的探索,主要分为logo字体设计和图片品质把控。

在logo字体设计上,前期进行了不同方向的探索。考虑到字体识别性和频道的特色心智,最终选择手写体的设计方案,更具轻松活力。

淘宝美食怎么挑?吃货们看完这一篇就够了

在图片影像上,我们输出了严格的视觉规范,包括弱网状态下的静态图片,以及wifi状态下的5秒视频切片。并且在后期实际生产中,对达人的生产内容进行严格把控,以保证最终的呈现质量。

淘宝美食怎么挑?吃货们看完这一篇就够了

在频道上线后,通过设计师的指导和达人机构的协作配合,使得栏目图片、视频的质量越来越符合预期的设定。尤其是有清晰特写和试吃过程的视频内容,都能有较好的点击和转化,得到吃货们的认可。

淘宝美食怎么挑?吃货们看完这一篇就够了

详情页展示设计

在完成入口的设计之后,我们也对栏目的详情展示进行了设计,主要包括完整视频的规范和详情页的规范。设计了结合栏目名称的视频片头,并提供给内容生产者。

淘宝美食怎么挑?吃货们看完这一篇就够了

02|腰部个性化内容:导购效率化

该区块的作用主要是抓住用户兴趣,降低用户在此区块的跳失,因此我们设计了三个区块来实现这一目标。

盘点内容模块

商品盘点是频道核心的内容之一,主要包括PGC的盘点和算法盘点,将相同主题性质的商品聚合到一起,提升用户的浏览效率。通过口味维度与用户需求进行匹配。在交互上,通过上下滑动屏幕来切换多个商品的展现,提升效率。

淘宝美食怎么挑?吃货们看完这一篇就够了

在承接页中,我们为不同的口味的人群设计了相应的氛围图片,使得氛围感更强烈。对于商品,使用单列的展现形式,清晰化呈现每个商品的利益点,方便用户比对不同商品间的差别。

淘宝美食怎么挑?吃货们看完这一篇就够了

营销内容模块

食品行业天然客单价较低,促销活动也相对较多,因此设计了营销模块,用来承接价格敏感型用户,防止该部分用户的流失。对于二级页也设计了相应的氛围图片,保证体验的延续性。

区别于盘点型商品内容,对于营销折扣型的商品展现使用的双列的形式,能够在单位屏幕面积内,最大限度展现图片面积,提升浏览效率。

淘宝美食怎么挑?吃货们看完这一篇就够了

03|Feeds内容:浏览节奏感

对于Feeds内容,我们确定了双列的呈现结构,在单屏空间内展示效率更高,更利于图片的展示,更能体现内容趣味感和丰富性。

对于视频内容,设计了9:16的沉浸式样式,定义了有序的排列规则,以保证在视频自动播放情况下的产品性能流畅度。穿插营销活动、节点等其它内容类型,提升浏览时候的节奏感。

淘宝美食怎么挑?吃货们看完这一篇就够了

Feeds内容来源于海量的达人,相比头部心智栏目的内容生产者,这部分达人的能力是参差不齐的,因此无法像心智栏目一样一一强控。我们输出了优秀的图片案例,和图片制作tips,给到内容生产者,包括不同类目商品的多种构图、色调参考。并定期和达人进行沟通交流,发现达人在内容生产中的实际问题,及时对图片规范进行调整,逐步优化图片呈现效果。

淘宝美食怎么挑?吃货们看完这一篇就够了

节点二级页设计

节点是以最小颗粒度聚合不同的内容和商品的一种内容组织形式,在汇吃频道中,我们设计了类目导购和地域导购两种形式,满足有细分流量目的用户的诉求。在头部,通过强氛围感的图片来是用户明确当前的维度心智。由于各个节点的内容形式和数量是参差不齐的,我们确定了模块化的展现形式,并不制定严格的排列规则,而是方便各个内容模块之间组合不同的呈现方式,满足不同节点的内容分发需求。

淘宝美食怎么挑?吃货们看完这一篇就够了

写在最后

产品的从0到1是一个非常有趣的过程,尤其是针对美食这样的垂直行业。设计师在产出方案的过程中,不单单只是设计一个静态的页面,而是要充分了解其背后的商业逻辑、货品内容构成和算法逻辑等,才能产出更有针对性的设计方案。以及在产品开发中,除了跟进技术的还原度以外,更要跟进运营对于商品的选择和内容的生产,才能保证最终的呈现效果。

原文始发于微信公众号(淘宝设计):淘宝美食怎么挑?吃货们看完这一篇就够了

原文链接:https://www.uiya.cn/11045.html,转载请注明出处。

0
分享海报

评论0

没有账号? 注册  忘记密码?