UI/UE产品体验日记丨21期
Hello大家好,我是杜昭
日更100个产品案例解读,完成了✌️
今天分享96-100个案例
日更100天挑战总结
到今天为止正好写完了第100篇更新,其实对我来说,这次的100天挑战是要比去年的100天挑战难度高很多的。
因为去年作者平均是晚上六点半下班,今年平均是晚上九点半下班。新公司的工作强度比较大,下班时间比较晚,经常是到家的时候已经11点了,然后写更新要写到12点多。
在这个过程中又经历了结婚和生病以及很多次的加班加到11点多一点才到家,但是我觉得如果你不逼自己,你不推着自己向前走,那总有一天这个社会会推着你向前走,让你更痛苦。
去年完成日更100天挑战之后,我获得了很多东西,包括收入上的,工作机会上的以及薪资涨幅上的。这次更新100天之后,其实作者觉得对于自己的提升是没有上一次大的,差距可以说非常大。我在更新50天的时候其实就已经感受到了这个问题,所以后一段时间主要就是在想这个问题的原因。
当我们想从40分进步到60分的时候,需要的方法是A。但是当我们想从60分进步到80分。那之前的方法A就已经不太管用了,需要的是方法B。
之前作者是在一家创业公司负责一款比较简单的产品,但是后来作者到京东健康之后,负责的产品在业务复杂度和用户规模上来说,都相差巨大,工作的过程也比较痛苦。
但也恰好是这种痛苦,让作者慢慢的完善了自己继续向上成长的路径,对方案B的具体做法有了一些总结和思考。
在这两次日更挑战的过程中。我曾经有三次是比较明显的感觉到自己的专业能力变强了。分别是写出了《用户体验拆解》、《十问》和《用户体验量化》这三部分内容之后。
其中《十问》曾经在这次的更新挑战中写到过,《用户体验拆解》和《用户体验量化》这两部分内容,还没有公开分享过。
所以作者做了一次直播,和大家聊一聊用户体验拆解这一部分的内容以及近期工作中几个比较好的案例。感兴趣的同学加微信duzhao0001,已经分享过了,但可以看录播的。要预先说明的是,这次直播并不是免费的哈。
96:淘宝详情页,用快速切换商品的方式帮用户进行购买决策
大家带来的是淘宝中的一个案例:
最近作者的鼠标丢了,想在淘宝上重新买一个,在挑选的过程中发现了一个很不错的设计。
我们买东西的时候。最常见的一种行为就是货比三家,会查看多个商品,最后再决定购买哪个。
在淘宝详情页里,我们可以从屏幕顶部向下拖动,就可以得到下面这张图片的样式。在顶部的这个区域,就能够直接显示用户最近查看的一些商品,点击之后呢,就可以快速切换过去了。省去了之前点击返回,然后重新找到之前浏览的商品,这样一长串的流程。

这种设计能帮用户快速的对比多个待选择商品的信息。我们都知道,如果用户查看了十几种商品,那他最终可能会购买的概率就会比较低,就是说用户选择越多,它做决策就会越困难,购买的转化率就会越低。
作者理解,这其中的原因可能是用户在很多个商品中。无法清晰有效的对比每一种商品的功能、质量、以及价格等等很多种信息,所以最后用户的思维就会比较混乱,那在用户不能明确的知道这些信息的时候,他购买的概率自然就会比较低。
所以淘宝用了这种方法快速的帮助用户去找到多个商品。这样用户就可以提高对比信息时的效率。那用户对于每一种商品的优势劣势等等价格这些信息都很清楚,那他购买的概率自然就更高了。
作者之前也听某位圈内大佬讲过一个理论,叫能量桥理论,大致是说:用户做出任何行为都会消耗一定的能量,那用户最终决定购买需要消耗比较多的能量。所以如果用户浏览了很多个商品,每次浏览的时候都消耗一定的能量,那么,最终用户可能剩余能量就不够支撑他去完成购买的这个行为。放在这里也是比较合适的。
97:京东健康PK春雨医生,你认为哪种设计更好?
给大家带来的是京东健康中的一个案例。场景如下:
我们在使用在线问诊的功能时。经常有一个需求是按照科室来选择医生,然后再进行具体问题的询问。
这个行为很好理解,因为每个医生他擅长的领域都是不同的,就像我们设计师,有的人是做UI设计,有的做交互设计,有的做平面设计一样。
那在选择医生的时候。京东健康和春雨医生两个产品中就有不太相同的设计,如下图:
春雨医生
京东健康
作者是觉得京东健康中的设计更好一些,用户在问诊时往往只知道自己的症状是什么,或知道自己的疾病名称是什么这个时候。
这个时候,按照科室来找医生,用户很有可能就不知道自己的这个症状属于哪个科室的范围之内。即使是线下就诊的情况,也经常有跑错科室的时候,更别说线上了。
所以这个时候像京东健康这样,在每个科室下面写出来这个科室包含的常见的疾病,是能够帮助用户更准确地进行科室选择的。
而春雨医生仅仅把每个科室的名称写出来,再搭配一个图标,对用户的帮助几乎没有。
就像一个设计领域之外的人,我们要给他解释画一张海报属于平面设计,制定一些逻辑和操作方式,属于交互设计,他也很难理解一样。
98:对比腾讯视频和优酷的设计方案,你觉得哪种更好?
给大家带来的是腾讯视频中的一个案例。场景如下:
这几天放假在家看脱口秀大会,那用手机看当然没有用电视看更爽了,所以作者一直是用手机投屏到电视上,在用腾讯视频和优酷视频两款产品进行投屏的时候,作者发现这两个产品在投屏的设计上区别比较大。今天就聊聊这两种设计。
首先我们来看优酷,在投屏之后整个页面都变成了功能区。例如音量增大、音量减小、上一集、下一集等等。如下图:
这种设计舒服的地方就在于。投屏之后操作比较方便。例如调整音量的时候可以直接点击屏幕,不需要再去拿电视遥控器了。这样就避免了用多个设备来进行控制,并且这个操作区域非常大,使用的时候效率很高,也不容易出错。
然后我们看腾讯视频,我们可以看到,在这个页面里投屏之后,操作区比较小也不能调节音量。本来作者是认为优酷的这种设计远远好于腾讯视频,但仔细想了一下,发现可能两种设计的目的就是不一样的,所以没有办法直接来评价哪种方案更好。
一种设计方案好与不好这个问题到底应该怎么评价呢?
有的人说要从用户体验来衡量,体验好的那方案就好,体验差的那方案就差。这种说法对,但是不全对。
还有一种说法是,要从商业目标的角度来看一种设计方案,如果能让公司卖掉更多的货,赚到更多的钱,那方案就是好的,相反就是不好的。这种说法同样不全对。
那作者的理解是这样的:
我们评价一个设计方案的好坏,要看的是它是否完成了我们在做设计之前制定的目标。结合今天的案例来看:
腾讯视频中虽然他的操作体验没有优酷好,但是它为给下方的更多其他视频产生了很多曝光机会,可能用户本来只看一个视频,现在变成了看两个。
那用户停留在产品中的时长就增加了,这种方案的设计目标可能就不是操作体验,而是能让用户观看更多的视频。
而优酷中的设计方案,它的设计目标可能就单纯是投屏之后的操作体验。所以作者说,这两种方案没有办法直接去对比哪一种更好,因为两个产品的设计目标可能是不一样的。
作者在四五年前刚刚开始学设计的时候,听到过一句话,到今天印象都非常深,就是: 做设计的第一步是设计需求分析,要了解我们接到的这个需求,它的目标是什么?如果你连目标都不理解的话,那你做出来的方案可能就与公司想要的南辕北辙。那自然你的设计方案就不会得到认可。
99:淘宝用地图显示物流信息,到底比文字好在哪?
给大家带来的是淘宝中的一个案例:
下面这个页面截图大家应该都不陌生了,就是在淘宝里面的物流信息页面,作者记得在几年之前,我们在查看物流信息的时候,给出的都是文字性的信息。
就是一个竖着的进度条,上面会显示卖家已发货,已到达某个城市,某个站点已发出等等这样的信息,但是后来慢慢就变成了这种地图的形式,作者一开始也没有去仔细想过其中的原因,但是昨天突然想到了一点儿东西,在这里和大家分享一下,用地图显示物流信息,到底比文字好在哪?

现在的电商产品用户,他们对于物流的时效性要求都是比较高的,物流越快,那用户的体验就会越好,京东快递和顺丰快递在这个时效性上都做得比较好,包括物流也是京东的的核心竞争力之一。
那么用地图的方式,首先第一点好处是它相对于文字,可以让用户更了解配送的进度,比如说之前我在北京买一个手机发到广州,然后文字显示已到达某某城市,其实这个城市用户是不了解的。
用户根本就不知道到达这个城市了,那距离终点站还有多远,对于进度是没有明确的感知的。
并且图片性的东西相对于文字,它表达的信息更加丰富和直观,能够添加一些情感化的东。
例如说当天气不好,或物流出现一些问题的时候,都可以在图片上用一些相应的动画来表现,这样用户就可能给予更多的理解。
比如说美团外卖骑手在配送的时候就会。如果天气不好就会显示对应的骑士小哥被雨淋的动画,显得非常辛苦,这样差评率就会减少很多,放在这里也是同样的。
用这种地图每次进入的时候,都会从起点开始向终点走一遍,这样用户就能够比较清晰地感觉到商品离自己越来越接近,缓解用户心理上的焦虑。
100:微信“长按图片”改版案例
大家好我是杜昭,今天是日更100天挑战的第100天,挑战完成!今天给大家带来的是微信中长按图片后弹窗页面的改版案例,页面如下:

大家想一下该页面改版的目的是什么呢?
作者认为首先是增加了该页面的扩展性,可以容纳更多的功能。改版前是list结构,优点是清晰易读,视线顺序自上而下十分流畅,缺点是页面容载能力差。例如再增加更多的功能就会让这个底部弹层遮挡过多的页面内容,改版后是宫格结构,页面扩展性更强,展示效率更高,可以容载更多的信息;
但有一点要吐槽的是:改版后作者第一次使用时,找“识别图中二维码”花费了一定的时间,这里的视觉表现有些弱了,除了对改版后页面不熟悉之外,作者认为在空间上给了最重的权重,但视觉上做的很轻,第一次使用寻找会花费相应的时间,如果视觉上更突出一些就更加完美了。
(当长按的图片中没有二维码时,则不会有识别二维码这个选项)













































































