微交互的设计案例与思考中篇
设计师和初级产品经理在面试中不能很好回答APP设计好在哪里,并非是由于平时使用太少,而往往因为缺乏一种视角,即产品是为人而设计的。当我们意识到使用产品的是人,人具有感性层面,就会发现使用功能强大、信息准确和流程最优等客观化标准评价的不足。
微交互的核心在于产品细节,在上一章(点击查看)中,我们介绍了为懒而做的设计和为等待而做的设计。本章我们将聚焦人的感受层面,分享第三和第四部分,即懂礼貌的设计和为舒适而做的设计。
三、懂礼貌的设计:具有一名好服务员的礼仪
人在与数字设备相处的行为模式和人与人之间是类似的,交互设计者常常使用对话框和表单完成两者之间的沟通。日常生活中,我们与他人相处常见四种模式:与老板,与亲人,与同事,和与服务员。人们在使用产品时所期待的应是最后一种。
当我们在高档的西餐厅就餐,会发现好的服务员不必卑躬屈膝,但一定是客户至上的,在我们需要的时候提供帮助,不问过多烦人的问题。做一名好的服务员也许不难,但当交互设计者深陷在产品的功能、信息、流程和商业逻辑中,经常就把礼仪这件事抛之脑后了。
案例一word和page的退出保存对话框:不问已经就坐的顾客是否吃饭
对程序设计而言,流程判断节点的是和非都是必须考虑的范围,但对人而言,在特定条件下人具有的可推断的行为。例如顾客走进一家餐厅就坐,服务员应该问您想吃点什么?,而不是问您要吃饭吗?。顾客到餐厅当然是来吃饭的,如果他不想吃了,只要能够离开就好了。在流程图和逻辑上,顾客存在离开的可能,是否吃饭也的确在吃什么之前,但这并不意味着交互设计要以这种方式问话。
今天我们在MAC上使用word和page编辑同一篇文档,点击关闭会发现弹出的对话框是不同的。微软word对话框会问是否保存,而苹果page对话框则问存在哪里,同时提供不保存的按钮。word的做法即在问就座的顾客是否吃饭,用户花费数小时写的文档,为什么不保存?而page的设计者就聪明多了,将是否保存带入到保存到哪的问题中。不问已经就座的顾客是否吃饭,核心是交互设计应从人的行为模式出发,脱离程序思维,这样用户就不会觉得产品表现的刻板、愚蠢和失礼。
案例二京东和淘宝退出订单支付:不过度问烦人的问题
不论我们在餐厅、商店还是理发店,当我们说明要求后,都希望服务者能够快速理解,而不是反复确认。经常网购的朋友会发现,京东商城和淘宝在退出确认订单和支付的界面是不同的。
在退出确认订单界面时,京东用模态对话框问便宜不等人,请三思而行,我再想想or去意已决,淘宝则不问。对多数用户而言,地址是默认填充的,退出订单等需要时再买并不付出什么代价,在这里京东让用户确认自己的行为是非常让人厌烦的。
而在退出支付界面时,京东仍然用模态对话框问确认要离开收银台?超出时间订单会被取消,请尽快支付,继续支付or确认离开,淘宝则不问,直接显示待支付的订单,如果用户不管,订单会自动删除。在这里,京东更加失礼,用户明明已经点击退出支付,为什么还要问,甚至要求用户尽快支付。
京东所展示的正是过度问烦人问题的服务员形象,让用户反反复复确认自己的行为,感到厌烦和丧失信心,相比之下,淘宝好多了。
案例三麦当劳自助点餐与饿了么提交订单:不问问题而是提供选择
回答问题与选择截然不同,前者让人感觉是被动的,被压制的行为,是日常生活中与上司和长辈间的对话模式;后者则会让人感觉是自主的,可控的行为。聪明的服务者不会强迫用户回答问题。
麦当劳设计了超级棒的自助点餐系统,但在对话框交互使用上不尽人意。当人们选完需要的食品后,屏幕弹出对话框问是否外带,选择之后屏幕又弹出对话框问是否确认订单,选择后屏幕又弹出对话框问是否送到餐桌。这种连续的独占态YN发问让用户感到霸道和压制。同时由于一旦回答就无法返回上一层,用户潜意识会担心自己选错,倍感压力。
虽然信息是必须向用户询问的,但麦当劳使用了错误的方式,饿了么则做得好多了。在饿了么的订单确认里,商品明细,是否匿名,用餐人数等必要信息,是让用户选择而不是逐个回答,一并确认提交。
案例四轻芒和知乎的推荐信息:不强行推荐服务
出于业务或商业需要,有时候产品必须向用户推荐信息和服务,但这不一定就和用户体验相违背。当我们走进麦当劳的时候,门口的展板,餐厅内的墙壁,服务台上都是推荐产品的广告,甚至在我们就餐中会发现,连食品的的垫纸上都是新品广告,但我们从未感觉这影响了我们就餐的体验。麦当劳摆放在那里,需要就买,不需要可以不看,不是强推给顾客的。
有一款APP叫轻芒杂志,每隔几天打开,文章上就会叠一摞卡片消息,分别来自该公司CEO、PM、设计、运营和客服的各种消息。更糟糕的是,这些卡片根本无法移除,盖在文章上无法阅读文章内容,只有一个一个点开看完关闭才能消除。这绝不是一个好服务员的体贴,而是愚蠢服务员的喋喋不休。
相比之下,知乎首页的付费Live呈现就好多了,这是用户打开应用第一眼就会看到的,但却不会感觉因为其影响了正常使用。知乎在这里非常聪明的使用了泳道模式,每个Live项目在卡片里以缩略态方式呈现,这些卡片可以横向滑动,在小面积内具有极高的信息呈现效率,不干扰用户操作。不强推服务给顾客,是好服务员应有的礼仪。
案例五京东和阿里闲鱼:记住顾客的喜好
我们每天都承受着移动产品各种推送的消息轰炸,从短信唤醒,到邮件活动,再到微信优惠券,可是当我们打开,很快就丧失信心了:我家里明明有空调,你推什么空调大促?我明明是个男子,你怎么推女装打折呢?几次下来,再推送的消息躺在了短信、邮件和微信消息堆里不再被打开,成为了垃圾。
虽然APP可以不知道我是谁,但是我可一直在使用这款软件啊,从行为中分析我的偏好,记住我的喜好,为我做个性化推荐让我开心很难吗?多数APP却根本不关心这一点,但有一款产品好像不一样,这款产品就是阿里旗下的二手平台闲鱼。通过记录搜索和浏览行为,闲鱼的iOS通知、首页置顶和前几页的商品都是用户所关心喜好的,这是一位能记住顾客喜欢的服务员,丝毫不让人感觉是打扰,而是感到十分贴心。
理解使用产品的是人,人具有主观感受,我们就将以全新的视角重新审视和设计产品的交互形式。我们为产品设计出好服务员一样的礼仪,但我们很快发现这样的感觉还不够,因为有一个客观事实存在:所有的交互形式都最终在设备上呈现,而人通过眼睛浏览阅读和手指点击拖动使用设备。
四为舒适而做的设计:舒适是好用的前提
三年前我购买了当时摄像头达4100W像素的NOKIALUMIA1020。当我在父亲面前显摆这个黑科技产品时,父亲拿过手机大概看了20秒时间,说了一句令我至今难忘的话这手机不好,握在手里不舒服。想想也对,一部整天在手里使用的手机,如果拿着不舒服,还提什么别的呢。
案例一OFO和摩拜单车的键盘输入:为舒适的输入优化
我们其实没有发觉,生活中很多事物都是被优化过的。当我们每天乘坐电梯,用手指去按楼层的按钮,那按钮刚好是我们拇指的大小。而当我们坐在电脑前工作,键盘的大小则刚好是我们食指的宽度,鼠标是我们手掌的宽度。这些都不是巧合,而是为了更舒适的操作而设计的。
去年的一个冬夜,我走出地铁找到一辆OFO,使用键盘输入车牌号,输错了一位,结果不得不提交报错重新解锁另外一辆。后来我仔细想了想,原来我之所以输错的原因来自OFO不合理的软键盘设计。
OFO的解锁场景要比一般输入苛刻,原因在于用户此时目光需要聚焦三处:车牌、键盘、和输入框。但是OFO却设计了一个糟糕的键盘,不但浪费了7和9下面的空间,还用两个数字键的面积重复了一个本来在输入框旁边就存在的确认键,这样键盘被划分成了四列,每个数字键都小于食指的宽度。摩拜单车,和支付宝输入金额的软键盘,都采用三列。让用户不输错最好的办法不是提醒,而是舒适的输入。
案例二Path的抽屉交互模式:为舒适的浏览优化
在移动设备上,抽屉交互最早出现在2012年的Path上,当时被称为神交互。原因在于那时智能手机刚刚出现,屏幕大小是3。5英寸,Path的抽屉模型将菜单和消息列表收敛到顶部导航中,最大限度的解放了屏幕可用显示区域,让用户舒适的浏览列表,不被底部导航遮盖。但随着智能手机屏幕尺寸变大,这种结构的优势减弱,劣势凸显(菜单的层级过深,菜单唤出按钮点击频繁),最终被微信这种底部浅宽导航取代。
当我们今天使用以地图为中心的产品,比如滴滴打车,摩拜单车,会发而Path所努力的方向和解决的问题仍具有巨大价值。为了更有效率的利用显示区域,最小遮盖地图,舒适的浏览和操作地图,这些产品仍然使用的是抽屉模型。
理解用户的需要,调整信息展示的层级,解放屏幕可用区域,是Path所体现的为舒适浏览所做的设计。
案例三微信、轻芒和好奇心人报:舒适的阅读应只有内容
今天的智能手机越来越大,但我们看看家里书架上的书籍和杂志就会发现,即使常见最大的手机屏幕面积,也比不上一本书籍或杂志。今天我们已经逐渐习惯了使用智能手机阅读,比如使用微信浏览公众号文章,或使用杂志APP阅读精选内容。
在微信浏览器内阅读内容并不是经过优化的舒适阅读,顶部的黑色调航条让我们在滑动屏幕的时候,减小了阅读面积,同时感受到强烈的视觉遮盖感。既然我们不曾在杂志和书籍上并看到导航,那么为什么我们要在手机上必须看到?
不是每个APP都像微信一样。轻芒使用白色的顶部导航和底部输入评论,相比之下接近杂志的感觉,但关闭的位置欠考虑,随着手机变大和单手操作习惯,对角顶部绝不是一个合适的返回位置。好奇心日报则让我们看到了真正优秀的交互设计,在用户滑动浏览的时候,屏幕干净的没有任何多余的东西,这不正是我们所期待的阅读吗?舒适的阅读就应该像书籍和杂志一样只有内容。
案例四iBooks和微信读书的亮度调节:舒适的操作是直接的
当我们用勺子吃饭,希望直接握住柄就能使用,而不是使用复杂的操作形式,这是为什么对幼儿来说勺子比筷子更容易使用的原因。同样,我们为了能够更快速的调节播放器的音量,在耳机线上增加波轮,也希望用手指滚动就能调整音量,而不是显示对话框操作。对人来说,最舒适的操作都是直接操作,但糟糕的交互设计不是,它们让人倍感蹩脚。
人们在移动设备上使用阅读软件,由于长时间观看,对亮度的要求和调节都更加苛刻。当我们使用iBooks阅读的时候,调整亮度的操作:
点击界面唤起菜单
点击顶部亮度按钮显示亮度条
滑动亮度条
点击屏幕关闭亮度条
点击屏幕会到阅读状态
这是一个不直接操作的糟糕设计,没有人会用这种方式调整亮度,人们宁愿使用今天iOS的系统亮度调节:
上滑屏幕
拖动亮度条
下滑屏幕回到阅读
但这仍然是一个不直接操作的设计。它们都来自以体验著称的苹果公司。
难道想调节播放器的音量就不能直接滚动耳机线上的波轮,而非要用对话框么?微信阅读不是这样做的:设计者在这里使用了系统的多点触控,用户只要双指在屏幕上下滑动屏幕即可,这个操作虽然可见性差,但读书APP并非暂时使用,用户在长时间阅读中一但熟悉,就会爱不释手。
案例五麦当劳卫生间标志和小米电视软键盘:避免暂态下的新奇操作
新鲜有趣的设计和交互形式往往能够吸引和打动人,但要分场合。2个月前我在一家麦当劳写文档,期间当我去卫生间的时候,由于无法快速识别标志,傻呆呆的停留了半分钟。M的创意画用错了地方,快餐厅的卫生间是暂时属性,90的顾客都是首次来到这扇门前,需要专注对比两扇门上的图形才能区分男女,当然如果这个创意放在90用户都熟悉的环境则很棒。
同样的例子,小米电视机在搜索输入时使用了和大家平时习惯不一样的软键盘,由于无法和用户心理的QWERTY键盘模型产生映射,用户会蹩脚的输入字母。小米的特殊键盘用错了地方,电视不是一个输入设备,搜索的软键盘只是暂时态使用,人们无法通过经常使用增加经验,所以就会一直觉得不舒适。
暂时态下应避免新奇的操作形式,这会让用户迷惑不知所措,无法舒适操作。
设计界伟大的DieterRams曾经说:
设计和艺术是不同的,但很多人都没有认识到这一点,设计是为了人而产生的,如果你不明白人,你就不能理解什么是好的设计。
当我们理解了最终使用产品的是人,人具有感性层面,我们就将从全新的视角看我们手机中的APP,从而开始感知和理解到伟大产品的动人细节。感谢大家阅读。
【未完待续】
相关阅读
微交互的设计案例与思考(上篇)
短发女生适合烫羊毛卷吗女生头发卷卷的时髦更减龄羊毛卷发型是今年的发型流行趋势之一,火遍全网,越来越多的小姐姐们被种草了。那么剪短发的女生适合烫羊毛卷这款发型吗?答案当然是可以的,小编这就为大家推荐几款适合短发女生的羊毛卷发……
赶到现场造句用赶到现场造句大全九十一、鸟松分驻所副所长李崇雄表示,意外发生后,肇事驾驶立即打119求救,鸟松消防分队赶到现场搜救,但,体重上百公斤的吴姓男子被救起来时已经没有生命迹象。九十二、警方赶到……
中秋征文中秋又到了750字中秋又到了,吃月饼的时候也到了。今天,我看了看日历,原来每年的中秋节又到了。我急忙去街上买月饼,正好碰上了我的小学同学,我和他打了声招呼,他也叫了下我。然后我就去挑选月饼……
眼泪不会落心情日记从来没有想过有一天会突然的落泪,一直以为眼泪是我最珍贵的朋友,它是唯一的能听我心情的朋友,是能懂我的朋友。可我从来没想过有一天眼泪也会离我而去。从小我想爸爸妈妈的时候,我……
校园的大樟树我们校园的东面有几棵十分高大的樟树,已经有一百多岁了。古老的樟树像忠诚的士兵,守护着我们的校园,成了校园一道亮丽的风景。樟树非常粗壮,需要好几个小朋友手拉手才能围得过来。……
孕期不同周期乳房护理科普常识女人在怀孕期间,身体会经历一个较大的变化过程,由于每个人的体质不同,所以怀孕的症状也有所不同。但是很多孕妈妈都会发现,怀孕后自己的乳房有一些变化,接下来小编来介绍孕期不同周期乳……
肾虚阳痿之间的联系肾虚阳痿有两种关系。阳痿是男性最不愿意谈到的词语,每次谈到,必然与早泄、肾虚挂钩,习惯性认为阳痿是肾虚的结果。然而,阳痿与肾虚之间并没有什么必然的联系,只是很多人经常把阳痿与肾……
五年级学生写给父亲的一封信亲爱的父亲:您好!我们父女俩人许久没有见面了。现在进入深冬,寒风刺骨,您一定要多穿衣服,照顾好自己的身体啊!上次您探望我已经是三个月前。在您离开的那一天,我站……
寒露到要藏脚润肺首选百合莲子寒露不能露脚民间有句谚语叫白露不露身,寒露不露脚,这句话是说,白露时节的时候,老人和小孩子就不要赤膊了,而到了寒露的时候,就要注意足部保暖了。因此,老年人要注意穿上……
外公家的田园作文无论是身处学校还是步入社会,大家都有写作文的经历,对作文很是熟悉吧,作文根据体裁的不同可以分为记叙文、说明文、应用文、议论文。还是对作文一筹莫展吗?下面是小编为大家整理的外公家……
妈妈叫我起床作文5篇我们的妈妈在我们上学的时期经常叫我们起床,对于这样的事情我相信大家都有经历过。以下是小编为大家分享的妈妈叫我起床作文,欢迎借鉴!妈妈叫我起床作文1叫睡懒觉的孩子起床,每个……
关于同桌的你作文400字同桌的你,一对善解人意的大眼睛,似乎能看透我的心。下面是小编整理的关于同桌的你作文400字,希望对大家有帮助!关于同桌的你作文400字1现在我是二年级的小学生了,说起我的……
初中环保作文拯救地球拯救地球迷迷糊糊地进入梦里,一个很大很大的幽浮从几千年前飞到了地球上,它的后面还跟着很多很多的幽浮兵团。人们的眼前瞬间出现了好多好多从未见过的外星人,惊吓得手足无措,落荒……
关于笑的优秀作文600字我审视那声音的主人:一身朴素的衣装,裤脚被水打湿了,那鞋子更不用说了,就像在泥坑里打滚的孩子。我将目光往上抬:脸像枯树皮,更像泥泞的公路坑坑洼洼,皱纹已经爬满了那历经沧桑的。面……
也许,最难忘的是彼此ta说,当你想我的时候,请回想我的模样。一首歌曲。会想到你。一些字眼。会想到你。一篇文字。会想到你。一部电影。会想到你。一张侧脸。会想到你。一个笑容。会想到你。一点温暖。……
校园里的新鲜事小学1000字作文最近学校有什么新鲜事?对于天天忙于学习的我们来说,当然是体育比赛了!比赛,调节着我们的学习生活,是我们枯燥学习的点缀。同时,也增加我们团体的凝聚力。随着下午上……
爸爸的手作文汇总爸爸的手爸爸有一双粗糙的手,有一双黑黑的手,还有一双有力的手,这双手托起了我们一家人的幸福,托起了四口人的生活,托起了我们头上的一片蓝天。今天,爸爸的手完整地呈现在……
鲁迅名人读书的故事鲁迅,原名周樟寿,1898年改为周树人,笔名鲁迅,字豫山、豫亭,后改名为豫才。下面就是小编整理的鲁迅名人读书的故事,一起来看一下吧。1。理发付钱在厦门大学教书时,鲁……
真情无价作文600字现在,我只剩下了一个亲人,我觉得我像从天堂掉进了低谷,我才知道真情是无价的!小编给大家提供真情无价作文600字,欢迎参考!真情无价作文600字【一】这部电影取材于云南怒江……
初中作文运动的好处说到运动,很多人可能对此再熟悉不过了,但是真正了解运动,能够做到多运动的同学有多少呢?那么今天我就要给大家来说一说这运动的好处。从小的来说,运动能使人强健体魄。那就……
家庭生活趣事作文500字家庭趣事作文500字(一)我的家庭有3位成员:爸爸、妈妈和我。我们住在一间一百多平方米的房间里(楼房内)。我爱我的爸爸、妈妈,也爱我的家。一进门,就可以看到一间宽敞……
关于赞美小蜜蜂的作文导语:蜜蜂很勤劳,每天早上很早就出去采蜜,一次又一次。下面是小编整理的一些关于蜜蜂的作文,欢迎查阅。【篇一:小蜜蜂】蜜蜂的样子很稀奇,小脑袋像一颗小豆豆,原来蜜蜂也爱臭美……
相遇星期五一天,我正在津津有味地看着《鲁滨孙漂流记》,忽然,我感觉到一阵旋风,把我从现实世界给卷入了浩瀚无穷的书海中。我来到了书的世界,而且眼前的景象正是我所看的书的那一幕:破陋不……
暑假生活我的愿望树我有一棵愿望树,书上长满了各种颜色的果实mdash;mdash;ldquo;愿望果rdquo;。每颗愿望果都代表着我不同的愿望。看呀!这里有一颗绿色的愿望果,代表着我的愿……