粉时代

05 | 产品细节剖析,让你看看大厂是如何做设计的!

粉时代

如何让自己的产品在保证基本的可用性和易用性的同时,还能让界面看起来柔和、更富有亲和力?一个产品能留住用户的虽然是内容本身的质量与吸引力,但一个小小的细节却能够阻止用户的流失,成为内容转化的最后一道防线,让人眼前一亮,值得借鉴。

01.「微信」简便且高效的图片翻译功能产品体验:

在微信的聊天对话框中打开英文图片,点击下方的翻译功能按钮,即可翻译图片上的外文,并以中文显示。

设计思考:

在我们的生活中,有时候多多少会遇到一些英文,比如进口食品包装、药物说明、护肤品等,其中就有一部分是纯英文说明,无论自己多么博学多才,但不见得都能理解英文。记得之前有一次,我自己的电脑蓝屏,出现的全是英文,虽然自己也是一直提倡用互联网解决问题,且也有一些拍译软件,但一想着需要下载注册,没准儿还要先看广告或收费,且天生对英文有一种与生俱来陌生感,还未开始便放弃了,于是成了伸手党,去请求别人帮助。

微信的图片翻译功能就是专为解决这一问题而生。通过在对话框中点击图片直接翻译,看到一道绿色的光由上而下扫过之后,图片中的英文就变成了中文,着实方便,比起以前通过第三方或先提取图片中的文字来翻译,操作简单且效率还提升了很多,可以说是一个非常实用的小功能。

02.「橙」不一样的的登录方式产品体验:

在橙APP的登录页面,区别了常见的登录界面样式,使用对话聊天的方式按流程提示用户完成登录,界面流程方式新颖,浓厚的社交行业属性。

设计思考:

在任何应用中,要想有自己的“私密”领地,都绕不开登录/注册的流程,但凡手持智能手机又想玩的开的用户,对登录的流程是非常熟悉的,比如手机号+验证码、一键登录、第三方登录,无外乎这几种常规的登录方式,如果想来点“刺激”的,无非就是加个logo、贴个插图、来点动效等,见怪不怪了。

橙APP的登录方式虽然同样是手机号+验证码登录,但在流程样式上却非常新颖。鉴于应用本身属于社交行业,通过对话询问的方式让用户按照流程输入了手机号和验证码,给用户造成这不是对使用该APP设置门槛的错觉,降低用户的防备心理(很多产品用户量的增长都被挡在了登录之门外),让用户不知不觉在聊天过程中完成了登录流程操作,其方式非常友好且登录的过程是愉快的,同时还兼带了浓浓的社交行业属性,通过更直观的登录场景感受,拉近用户跟产品之间的距离,使用户的印象更加深刻。

03.「高德地图」桌面一键导航-出行更高效产品体验:

通过高德地图的收藏夹,点击收藏地址右侧的功能菜单,在弹窗中将该地址“添加快捷导航到桌面”,后续就不用每次输入常用的目的地了,直接通过桌面的图标入口即可一键导航。

设计思考:

对于在外的工作人员,导航算是手机必备的软件,以前只是纯粹的导航认路,而随着汽车量的增长,各地交通逐渐开始变得紧张,那么不管我们是否知道路线,驾驶之前都会习惯性打开地图导航,随时观察路线拥堵情况来思考是否有更换更优路线的需求,于是就按照惯例打开导航、录入目的地、选择路线......等一系列的常规操作,日复一日,似乎没有觉得什么不妥。

高德地图的桌面一键导航功能,为长期有驾驶需求的用户提供了更为便捷的操作,将经常使用的目的地添加的收藏夹,再添加到桌面以生成目的地导航便捷入口,有需要时桌面点击即可,系统将自动规划最优路线,通过最便捷的方式一键导航,再也不用日复一日的重复之前的操作了。站在设计师的角度,在解决用户需求时,操作越复杂、步骤越多,用户的选择条件、视觉负担及时间成本就越多,出错的情况也越多,故而用户流失的可能性就越大。高德地图通过一键导航简化操作流程,通过合理的操作路径,降低用户时间成本,有效提升了使用频率及粘性。

04.「爱奇艺阅读」性别选择-更明确的指引和提示产品体验:

首次进入爱奇艺阅读APP,在性别选择页面中,男生和女生的头像通过动画的形式反复左右替换,用强视觉提醒的方式推动用户进行选择操作,以便于提供更匹配的内容资源。

设计思考:

大部分新闻或阅读类型的APP,在用户首次进入应用时,都有类似性别、行业、爱好之类的选择,其主要目的是确定用户的属性,并提供更加匹配该属性的内容资源来提升用户的满意度。其流程也是千篇一律,以建议性的提醒用户去做选择,如无需要直接跳过即可。

爱奇艺阅读首次即进入APP时,以动态的性别头像插图反复左右切换的动效方式来提示有用户选择性别,相比常见的静态按钮直接显示在那里会更加友好,不会过于生硬、冷冰冰,其动画视觉样式给予明确的指引和提示,更能引起用户的注意,通过强烈的视觉提醒促使用户更高效的完成当前任务。

类似这种选择且非强制性的前置页面,很多设计师只是按部就班当做一个流程,其实要想做好并非仅仅如此,可以通过趣味化、情感化、动效等方式增强用户去选择的欲望,以提高操作几率,用户一旦选择,进入应用之后所看的内容定然更符合自身的需求,也能提高用户的满意度,其满意度的高低能决定用户的去留及转化,所以应用中,用户的前置选择对产品的重要性可想而知。

05.「饿了么」合适的时间、合适的提醒产品体验:

如果在饿了么有正在进行中的订单,再次进入应用时,右下角会提供一个查看的快捷入口,点击可快速进入该订单查看进度或骑手配送状态。

设计思考:

随着外卖行业的普及,给我们的生活带来了很大的便利,尤其是一日三餐,我们只需花几分钟的时间在外卖平台上下单,其他的事情交给商家和外卖小哥,很大程度上缩短了我们去店途中和店里的等待时间,特别是对上班族来说,真的是太便利了。不过外卖平台不像京东淘宝-人们可以无忧无虑的逛上几个小时,通常都是目标明确的用户,在短时间内完成自己的需求,要么下单、要么查看配送进度。

如果在饿了么有订单存在,再次进入首页,右下角会提示配送信息,点击直接进入查看详情。从表面上看,右下角的入口虽然提供了快捷通道,但似乎不太友好,总是会遮挡部分内容。其实并非如此,是因产品根据用户的使用场景进行行为预判而设计的快捷入口,在正常情况下,从下单到完结一般在30分钟左右,如果用户存在未完结订单且在短时间内再次进入平台,80%以上的用户此时需求为查询配送进度,因此,右下角的进度提示正是在合适的时间给予用户合适的提醒,根据用户的场景需求提供了最为便捷的解决方案,由此可见、利大于弊。

06.「搜狗输入法」教你少打字、多开挂产品体验:

进入搜狗输入法的设置中,可开启开挂模式,里面的三连发、回声、重要的事情说三遍分别对应不同的效果。

设计思考:

搜狗输入法在业界虽不敢说是最牛,但一定是数一数二的存在,发展至今,不仅仅是在满足用户的基本需求,还提供了让用户感到惊喜的功能,而现在更是研发了很多“黑科技”。

从搜狗输入法左侧的logo中进入工具选项,在设置中即可选择开挂模式(真实效果见上图)。正如字面的意思,搜狗输入法通过智能帮助用户自动完成一些列的复制粘贴工作,瞬间让打字刷屏的手速快到逆天,且操作简单、轻松完成,方便用户在开怼、卖萌、刷屏过程中直接碾压对方的打字速度。开挂功能可谓是实用性与趣味性兼备,让我们在日常中,面对不同的社交需求时带来贴心的改变。

(凡事有一个度,刷屏如果没有用对场景,可能会遭到对方的反感,事在人为。就像之前的“拍一拍”功能面世,却有人在上班时间拿去拍领导、拍老板,后果就不说了,刀可切菜亦可伤人)

07.「美团」垃圾分类-解决餐后垃圾分类之忧产品体验:

美团我的页面,推荐工具的“垃圾分类”功能,能帮助我们进行识别因外卖产出的垃圾类型,便于跟线下对应的垃圾桶“对号入座”,减少不必要的垃圾混合而增加清洁工人的工作量。

设计思考:

外卖平台的兴起,给我们的生活带来了很大的便利,同时也产生了一些危害,首当其冲就是环境的污染。比如包装盒、包装袋、餐具等大量生活垃圾的产出,确实在外卖行业普及后,乱扔垃圾的情况跟随着疯速增长,虽然这些属于个人情况,但也有部分用户因不知垃圾如何分类,而将所有垃圾聚集在一起,然后就成清洁工的事情,最终无端增加垃圾分类的工作难度。

美团的“垃圾分类”功能对卫生环保方面增添了一份力量,当用户不知道自己产出的生活垃圾是何种类型时,可通过查看常见垃圾类型提示或搜索来确定类型,方便用户按类型将垃圾丢入对应的垃圾桶,解决餐后垃圾分类之忧,帮助养成良好的垃圾分类习惯,助力垃圾分类落地。还能消除用户对“外卖垃圾分类麻烦”的顾虑,利用线上垃圾类型的普及,为绿色发展及环境保护贡献自己的一份力量。

08.「优酷」个性化弹幕设置-看剧互动两不误产品体验:

在优酷APP开着弹幕看片时,可通过弹幕设置调整字体的不透明度、行数、大小及速度来设定最适合自己样式。

设计思考:

弹幕,用户非常熟悉的一个词,很多时候在看影片时,弹幕里面的内容远远要比影片带来的乐趣多很多,除了能从中获得群众的陪伴增加愉悦感外,还可以带动视频的观看氛围,让活跃的用户有了表达自我的动力和热情。但对于“键盘侠”来说,仅仅在上方显示的几行弹幕根本无法满足自己看影片互动及调侃的需求。

优酷的弹幕设置中,可以根据自己的实际需求对弹幕字体大小、透明度、区域等参数进行设置,针对喜好调侃互动的用户来说,使用满屏半透明度字体样式的弹幕无疑是最好的选择,互动看片两不误。

09.「随便走」AR导航-“傻瓜”式操作,老少皆宜产品体验:

使用随便走导航,全程利用AR实景,通过3D立体形式的方向引导,帮助我们找到周边的任何一个地方。

设计思考:

导航是我们出行必备的工具,目前高德和百度在该领域各自独霸一方,看似很牛叉,但并不是万能的。比如老人操作起来有一定的难度,经常各种功能找不到还说不好用;又比如我们在陌生的重庆市,可能你从这南面1楼进去,北面就在20楼,毫不夸张,如果通过常规的地图导航去找人,我建议你最好吃个早餐再出去,等找到人之后就可以吃夜宵了;再比如......不比了。

随便走APP是一款便捷式轻量导航工具,主打“让生活乐趣一目了然”。利用“AR全息实景”的展现方式,改变了必须要有地图的模式,对于我们找周边的美食、酒店、公交、厕所、景点等需求,进行穿透式3D立体指引,操作简单,不管前、后、左、右、上、下都有非常明显的视觉引导,只有你想不到,没有它找不到,对于长期生活在大城市的用户,交通复杂、道巷纵横,很可能我就在你“隔壁”,你却找不到我“老王”。此外,随便走APP操作简单,学习成本基本为零,对家中老人而言,也是一款不错的导航工具。

10.「微信读书」模拟现实的行为动作产品体验:

在微信读书的书架页面,点击书籍以及书本翻页,都使模拟了现实生活中较为自然且真实的从书架拿书、及各个角度翻页的效果。

设计思考:

看书APP虽然众多,但真正能坚持下去、养成习惯的没有几个人能做到,站在平台的角度思考,毕竟书本的内容是平台无法修改的,除了提供优质的资源并给予方向指引外,其他便是通过设计体验来提升用户的好感度了。

微信读书APP从书架的拿书动作到书本的翻页,都模拟了现实生活中用户看书的行为动作,大家都知道,真正喜欢阅读的人,是不会在意这些所谓的横竖及交互效果的,但前面都说了,这种人毕竟在于少数。因为受众的差别,模拟现实其最主要的作用就是为了吸引眼球,模拟用户的实际行为,将其代入真实的情境中,使用户对产品产生深刻的认同感,则看着更加舒心,待用户提升忠诚且养成看书习惯之后,这些作用就会慢慢变得微不足道。