为10%而设计——京东逛频道改版

用户头像
深圳/艺术工作者/2年前/989浏览
为10%而设计——京东逛频道改版
用户头像
洪草莓

当图形在界面中只占了10%的像素,设计师可以做什么?

好久不见。

最近刚完成京东「逛」频道的体验提升,距离上次的改版设计已过去一年有余。每每向大家介绍京东「逛」频道时,总会得到这样的疑问:

“这界面看上去有90%都是用户生产的内容,你设计了什么?”

于是,就有了这期的选题🤷🏻‍♀️。

一、做设计减法 聚焦内容本身

「逛」频道作为京东主站最大的视频内容场域,PGC内容在界面中占据相当大的视觉比重。

此时,前台信息的叠加在实际应用过程中,经常遇到内容质量上的不可控因素。

因此我们开始为信息做减法,让用户能更聚焦于内容本身。

比如一开始的沉浸式设计在切量测试中发现,由于非定制化素材,大部分PGC视频自带的字幕与前台信息产生较大程度的重叠。

在简化信息层级后,扩大了原等高区域内的可视范围,也更适用于京东「逛」多元化的PGC内容,同时降低前台信息对用户浏览的干扰。

原沉浸式版头在切量测试后做出简化

再比如新手引导,相比左边A版的步骤介绍(新用户需经过4次点击才能进入浏览内容),右边B版的微引导则无需打断用户动线:

在新用户正常浏览过程中辅助提示当前的操作,降低了用户的行为门槛以减少首次触达频道的跳失率。

A/B版新手引导设计,你更喜欢哪个?

二、设计乘法 用场景串起内容

目前京东「逛」频道的内容大部分以产品介绍和测评为主,相比其他平台的娱乐化内容,这类专业干货对于普通用户来说,始终缺少浏览的动力:

毕竟谁也不想辛苦上一天班,回家刷手机还得费神上课。

因此我们把“场景”做为用户浏览的钩子,把逛频道里的内容串起来讲。

比如在频道二楼,这个“场景”就是用户的生活方式——每个人不同的角色、喜好等构成自己的生活方式。

在京东「逛」实验版中,设计将多品类内容打包组合呈现,让用户从生活方式-内容-品,迅速代入到应用场景当中。

逛频道的实验版设计打通用户-生活方式-内容-品

再比如在搜索,这个“场景”就是用户所面临的问题:

就像我们寻医问诊时,通常会问医生“我感冒了该吃什么药”,而非具体到“XX厂家的阿莫西林效果如何”...

用户的诉求经常是因当前所遇到的问题而出发。

在逛频道里,大量种草和测评内容正好成为从问题-品这中间的一环,所以在搜索中融入问答、解决方案,进一步引导用户找到最适合自己的单品。

用频道特有的种草内容连接用户-问答-内容-品

最后,我们再次回到开头的问题——当图形在界面中只占了10%的像素,设计可以做什么。

无论是上面说到的京东逛频道设计、或是拓展到更多领域里的产品设计,除了对图形、界面等显性内容的设计之外,设计更多聚焦于内容背后的逻辑、上下游的连通和行为的牵引上:

最终,

让用户在产品中的一切皆为

沉浸、流转、意料之中。

10
阅读原文
|
举报
|
9
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
新拟态风格 UI设计组件库
UI 登录界面设计模板包
钱包ui模板
【新年UI图标】美食icon
高级感金属拟物 UI设计组件库
【新年UI图标】积分icon
UI通用设计素材1
APP/小程序商业项目UI模板|99个高保真UI+79个原型
UI应用平面图标
【新年UI图标】银行卡icon
【新年UI图标】体育icon
【新年UI图标】相机icon
科技医疗透明柜UI界面设计
新能源APP应用UIKit
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
户外旅行飞机情侣假日出行
【新年UI图标】礼物/活动icon
【新年UI图标】活动icon
【新年UI图标】旅行icon
盲盒APP UI设计
手表表盘UI系列
我的钱包-UI界面设计-app
智能家居中心 简约 UI设计组件库
你可能喜欢
相关收藏夹
地产VI
地产VI
地产VI
地产VI
大家都在看
登录注册