9&10月 | UX设计师的产品体验日记

36天前发布

原创文章 / UI / 观点
周周seal 原创,如需商业用途或转载请与周周seal联系,谢谢配合。

产品体验专题不定期更新,体验内容主要围绕产品方向、交互与视觉方向、运营策略方向。

01.「美团」消息模块的人性化用户体验


关键词:

#消息推送、#易用性、#设计逻辑


产品体验:

美团消息列表按照业务类型进行分组归类,同一个业务的消息在一个分组里面,用户查找方便。点击消息列表其中一列后进入该分组消息列表,标题栏右侧可以设置消息提醒,关闭通知后该类型的优惠消息仅通过消息中心的红点提醒。


设计思考:

消息模块主要用于消息分发,唤醒沉默用户,提高留存及用户活跃度,但如果设计不好容易给用户造成干扰,骚扰用户,从而提高了用户的卸载率;另一方面,运营利用“虚假”标题吸引用户,过多的“无价值”内容造成用户反感与麻木。美团在消息模块不仅提供了清除未读功能,还可以让用户自己决定,设置各分组是否提醒消息,并采取了超过30天消息回收的机制,避免过多的消息造成信息的冗余。




02.「支付宝」输入车牌号流程用户体验极佳


关键词:

#效率、#易用性、#设计逻辑


产品体验&设计思考:

①、输入车牌时唤出的键盘显示城市缩写,用户可直接选择,选择后自动切换为数字&字母键盘,省去了中英文、数字之间的键盘切换的步骤,减少了用户的操作时间;

②、点击车牌号下面的勾选框后可以把车牌信息同步到车主档案,下次停车缴费更方便。




03.「盒马」可快速浏览商品详情,加入购物车更方便


关键词:

#效率、#易用性、#设计逻辑


产品体验&设计思考:

①、点击首页下方猜你喜欢信息流区域商品卡片后不再直接跳转到商品详情页,而是添加了一个中转页面(官方叫法为微详情页面),其逻辑与淘宝新改版的首页信息流一样,都是为了增加商品的曝光几率和时间;

②、更新版本后首次进入到微详情页面会引导用户,提示“双击图片以下区域可直接加入购物车哦”。这个交互手势的加入极大程度方便了左手操作时的不变,为方便用户操作提供了另一种交互方式。




04.「小猿搜题&作业帮」视觉对比分析


关键词:

#视觉、#情感化、#品牌


产品体验&设计思考:

①、选择身份页面的角色插画比较:小猿搜题的插图中学生和家长的形象区分的不够明显,作业帮的学生形象背着双肩包,写作业的形态以及家长抱肩膀的权威形象生动,对比明显;

②、首页头部主功能拍照搜题区:小猿搜题的视觉样式老旧,扁平的图标放在大色块区域稍显过时;作业帮的相机图标采用微质感,以及背景的插图的情感化表达可以为用户提供情感价值,更容易打动人心;

③、下拉刷新:小猿搜题首页的信息结构采用的是信息流的形式,所以下拉刷新的时候只有卡片下滑反弹的微动效;作业帮下拉刷新后,拍照搜索区下面的内容也会随之更新,并且顶部“100分”的微动效凸显品牌个性,有利于品牌传播。




05.「百度地图」可快速切换路线,有效提升用户效率


关键词:

#效率、#易用性、#快捷操作


产品体验:

用户输入起点与终点位置,app规划好路线,选择其中一种方案进入到线路方案详细页面后,如果想切换到其他路线则不用返回到上一级,直接滑动顶部轮播卡片即可切换。


设计思考:

还记得上个月分享的飞猪买机票时可快速切换城市的分享案例么?其实不管是行程路线还是购票,每个产品的业务可能是不一样的,但是用户体验确是可以互现借鉴与学习的。如何信息排布、减少操作时间/步骤、增加快捷操作,这些作为设计师都是应该考虑的事情。




06.「淘宝」99划算节是如何通过标签样式帮助用户快速做出选择的?


关键词:

#信息呈现、#小细节、#设计逻辑


产品体验:

99划算节算是淘宝的一场大型活动(S级),和618、双11并列。平台将比照双11和618的优惠力度,给出超百亿补贴,从而吸引大量用户参与。活动商品支持跨店满减,分别为每满200-15、每满300-30。这就会导致用户需要从购物车里选择相同档位活动的商品,来计算出最优惠的方式。

淘宝平台在99划算节标签上做出区分,满200-15的活动商品的标签为橙色,满300-30的活动商品的标签为红色。用户无需点进商品详情页面来查看此商品的活动规则,只需通过商品列表中的标签即可区分。


设计思考:

活动标签上做颜色区分,虽然是很小的细节处理,但是却大大的解决了用户的痛点,提升了用户的购买效率。标签系统可谓是产品非常关键的部分之一。平台利用标签可以对不同用户群体分层,提高流量的分发效率。那么如何使用标签,创造商业价值值得我们思考,作为设计师,平时在使用产品的时候需要多加留意,这样我们在实际工作中才会从更多的角度去思考如何帮助产品做的更好,而不是仅仅从美观上面提供自己微弱的价值。




07.「淘宝」APP优化取件码,退货更方便


关键词:

#信息呈现、#效率、#人性化


产品体验:

很多人都在淘宝上退过货,如果选择上门取件,需要把取件码提供给快递员。以前的取件码是根据算法给出的一串数字,同时退多个物品时不容易记住,找取件码非常麻烦。现在优化后的取件码为寄件人手机尾号后四位+包裹编号的形式,用户只需要记住每个包裹是几号包裹就好了,同时也减少了快递员等待的时间。


设计思考:

虽说取件码的优化很大程度上提升了用户体验,但是也存在一个隐患。比如说快递员未按照约定的时间点来上门取货,以前会打电话给客户希望提供取件码,而现在优化后的取件码每个人比较固定,容易被记住,很难保证被无良的快递员直接填写,而菜鸟裹裹里的物流客服却总是联系不上,有待改进。




08.「淘宝」在下单选择颜色时支持浏览大图


关键词:

#信息引导、#效率、#转化率


产品体验&设计思考:

当购买颜色较多的商品时,用户把商品加入购物车或是直接下单后会底部浮层提示用户选择颜色、尺码以及数量。在之前的版本中,用户是无法看到商品大图的,如果不确定要购买的颜色则需要退回商品详情页面重新查看商品大图,一定程度上减少了用户购买的转化。新版本的页面在浮层内加入了展示图,并配有缩放icon,首次进入此页面会有动画引导。动画引导的方式可以在短时间内让用户了解到产品的新功能,引导性强,用户能直观的主要到产品的信息表达。思考一下,在大家公司产品上线新功能时是怎么做用户引导的呢?




09.「便利蜂」是如何利用查找门店功能做店铺营销的?


关键词:

#信息呈现、#营销、#门店引流


产品体验:

点击首页功能入口区的查找门店icon进入页面后,可以看到地图上分布着便利蜂门店的坐标点,底部展示当前离用户最近的门店信息。门店信息卡片下面露出今日特惠卡片的一部分,表示下方还有内容,向上滑动即可把卡片全部展示出来,这样设计既可让用户感知到下方还有内容没有完全展示,又不会占用地图区域太大的空间。


设计思考:

便利蜂门店经常会有东西按时间段打折,今日特惠板块可以让用户在到店之前就知道哪些商品在做实时促销,从而结合距离与优惠选择自己想去的店铺。对于便利店商家来说,商品的保质期是非常短的,平台会根据商品的保质期来进行促销、下架、回收等处理。如何把促销信息分不同场景展示给用户,从而实现各门店的最大利益化是平台应该思考的事情。




10.「自如」我的页面换新升级


关键词:

#视觉、#改版、#个人中心


产品体验&设计思考:

自如的用户群体比较年轻化,「我的」页面视觉风格过时,升级势在必行。随着iOS系统的升级,大留白大标题的版式设计的方式越受人们追捧,从版面上我们可以看出,新版的页面优化了头部区域的展示,并用卡片进行模块化设计,整体感觉更加圆润了一些。大标题让整个页面的信息更加有层次感。可以看出新版本的我的页面更加注重用户的房屋管理及平台服务,弱化了社区活动,为用户打造更加专业、更有品质的租房平台。




11.「飞猪」酒店商品详情页细节优化


关键词:

#视觉、#细节、#榜单


产品体验&设计思考:

飞猪APP酒店板块的商品详情页优化后首屏的信息承载量更多了。头部商家环境图比例2:1,评分模块浮在图片之上,利用Z轴空间,高度上节省了很多。页面增加了很多细节,比如防过敏床品等商品属性前的对勾,文字颜色与字重上面的区分。除此之外,新版页面加入了榜单,对于用户来说,平台的榜单具有一定权威性,可以通过榜单减少自己的决策成本,提高选择的效率;对于商家来说,可以利用平台的榜单带来更多的流量,也希望看到榜单上的商家哪些方面做得好,从而运用到自己的产品运营上。可谓一举两得。




12.「滴滴出行」途经点功能上线,最多可添加两个途经点


关键词:

#好功能、#易用性、#用户体验


产品体验:

在导航中输入目的地时,点击右侧“+”号,添加途经点,或是地图上选点添加。


设计思考:

当用户出行要达到多个地点时,需要思考如何规划路线,什么路线最优以避免绕路。比如朋友聚会散场,想要开车分别送到不同目的地等场景。推出此功能后可以为用户动态规划最短路线,可谓是提升效率的工具。




13.「百度」APP点赞功能趣味性十足


关键词:

#趣味性、#动效、#惊喜


产品体验:

点赞时会冒出“国庆”,“气球”,“五角星”,“快乐”等图形,就像礼花绽放一样炫目,视觉冲击力强,给人眼前一亮的感觉。


设计思考:

百度APP的点赞动效可谓是趣味十足,不仅可以给用户带来惊喜,又烘托了节日气氛。在如今的产品设计当中,产品体验所涵盖的范畴其实要远超可用性。体验所涉及到的维度更多,美学特征,体验上的愉悦感,还要给人充满乐趣的感受。




14.「盒马」APP是怎样利用表情拉近用户之间距离的?


关键词:

#趣味性、#动效、#视觉、#高效


产品体验:

当评价商品选择好评或差评时,表情动效生动形象,极具趣味性。选择好评或差评后,会显示对应属性的标签,满足了用户想要简短、快速表达的互动模式。


设计思考:

表情可以有效表达情绪,是人们网络沟通中 不可或缺的工具,合理设计表情有利于提高用户活跃度。emoji的广泛使用形成了用户对表情的认知和习惯,所以盒马APP的表情肤色采用黄色,设计风格为轻质感型,都非常符合主流的设计风格,加之生动有趣的动效表达容易让用户产生共鸣,从而拉近与用户之间的距离。




15.「航旅纵横」接送机功能是如何让用户快速下单的?


关键词:

#用户引导、#效率、#易用性


产品体验&设计思考:

当进入到接送机页面后,最近的行程会自动带入到表单中,并根据计划起飞时间及行驶里程自动计算出用车时间,采用Snackbar的设计形式,既不会强打断用户当前的操作,又可以起到引导用户的作用。

点击选择用车时间区域,底部浮窗默认选择推荐的用车时间,用户也可以在此基础上修改。点击确定后即可选择车型及商家,然后确认订单,整个流程快速高效,省去了用户比对航班,计算用车时间等步骤。




9&10 月份产品体验合集到此结束,欢迎一起交流讨论。



23
- 位站酷推荐设计师推荐 -

声明:站酷(ZCOOL)内网友所发表的所有内容及言论仅代表其本人,并不反映任何站酷(ZCOOL)之意见及观点。

    文章信息

    • 文章标签

    没有新消息