重新思考移动应用的新手教学模式

今天的译文来自Theresa Neil,也就是《移动应用UI设计模式》(O’Reilly大公鸡)一书的作者;本文所讨论的话题也是从这本书延展出来的:作者在实战中运用自己书中归纳出的设计模式,遇到问题,继而开始重新思考…接下来进入译文。

对于设计师来说,设计模式库是很棒的灵感来源,不过常见的实践方式未必是最好的。本文中,我们将一起看一看为什么很多移动应用的新手教学模式并非那么有效,以及我们可以从游戏设计当中汲取到哪些理念来帮助我们选择更加有效的设计模式。

我们的《移动应用UI设计模式》一书推出之后,Intuit邀请我过去与他们的移动团队进行交流。一开始,我从比较高的层面讲述了设计模式在不同领域(时装、建筑、软件等等)当中的价值。讲好之后,他们的高级UX经理Alissa Briggs补充了一些案例,并告诉我,他们曾经仔细研究了我的书中关于“视觉吸引”的那一章(见“具有引导性的移动应用界面设计模式”一文),尝试了“对话框”、“提示”、“使用向导”、“幻灯片”等各种方式,但仍然无法有效的引导用户上手产品。这些本该相当具有“帮助意义”的界面,在实际当中使他们的用户感到迷茫和挫败。这让我很惊讶。

Intuit在他们的Snap Payroll应用中尝试过的一些教学,用到的模式包括对话框、提示、幻灯片和使用向导。

在这之后,我又与RetailMeNot合作,帮他们设计iOS与Android应用当中的新手教学。他们的产品团队希望确保用户能明确的了解其产品的价值主张,以及怎样使用特定的功能,例如收藏商铺和优惠券等等。

当时我们认为一个简短的使用向导(3步)或视频演示会比较有效;另外他们有些利益相关者认为幻灯片也是不错的方式,所以我们同样进行了尝试。但最终的测试结果是,这些方案非但没能吸引用户,反而让他们产生了负面感觉。

其中一名被测者告诉我:

“我只想立刻进入应用并进行探索。”

总结下来,在测试当中,用户要么跳过这些教学,要么就是对各种对话框、向导、视频演示或幻灯片当中的内容视而不见。更坏的情况是,这些教学会激怒那些想要立刻进入应用进行尝试的新用户。

RetailMeNot的一些测试UI稿,用到的设计模式包括幻灯片、视频演示、3步使用向导。

为什么这些模式都失败了?

为什么呢?我试着到游戏设计领域寻找答案。游戏设计师们从来都知道,你不能把新玩家一下子丢到战场当中,期待他们即刻开始享受游戏体验;否则他们在懂得怎样使用武器之前就会被干掉。

在游戏设计当中,使玩家从零起步深度参与进去的方法较其他领域来说更加成熟且有效。其实对于移动应用的设计来说,道理也是一样的。虽然不涉及虚拟的“生命值”和“死亡”这些概念,但是新手用户所体验到的挫败和迷茫感是类似的。如果你让太多新用户感受到这些,那么你的产品基本要game over了。

Portal会首先让新玩家进入一个安全的环境,去熟悉各种操作方法。

Extra Credits的在线视频系列深入的解析了游戏世界的方方面面。其中的“Tutorials 101”(Youtube)更是值得每个移动应用设计师观看和学习。该视频介绍了一些在游戏当中创建新手教学的基本规则,我们完全可以扩展到移动设计领域:

少些文字,多些互动。不要一股脑展示所有的教学内容。有意思,值得尝试。在实际使用中巩固学习效果。倾听用户的声音。规则1:少些文字,多些互动

当我们想要解释什么的时候,文字通常是最方便的工具。但是,当我们想让用户学习什么的时候,文字就不那么有效了。根据“Tutorials 101”的建议,我们应该避免依赖文字,因为“文字会打乱使用节奏,破坏沉浸感;即使那些特别需要帮助的用户也会轻易的跳过文字教学。”

太多的文字,相当于“告诉,而非演示”,这与移动应用的设计理念是相悖的。新手教学应该是“演示,而非告诉”;它应该具有交互性,让用户通过使用进行学习。只有让用户在“实战”之前进行演练,他们才能在真正需要完成任务的时候知道怎样去做;单靠“告诉”是没用的。

来看一些对比范例:

Boomerang vs. Mailbox

Android上的Boomerang应用,新手教学完全是“告诉”,而且文字太多了。

iOS上的Mailbox应用,具有交互性的新手教学,鼓励用户通过动手操作来学习。

DigiCal vs. Fantastical

Android上的DigiCal应用,教学中的文字与它们所描述的操作行为之间的剥离感太强了。

iOS上的Fantastical应用,在教学中邀请用户进行操作演练,以掌握那些在实际使用中用的到的手势。

Catch vs. Clear

Android上的Catch应用,通过使用向导展示特色功能及操作方式,但是用户无法进行操作,难以真正记住。

iOS上的Clear应用,默认视图中的任务本身就是教学内容,用户可以根据其中的文字描述对每一条项目进行操作练习。

(插几句:对于Clear的新手教学我个人持保留意见。至少我自己第一次使用时完全没耐心把那么多的“手势学习任务”一个个完成;手势太多,真完成了学习任务也记不住;如果删掉这些教学任务,到了真正需要的时候,貌似又找不到类似“帮助”的内容。不喜欢。- 译者C7210)

要点:如果有办法“演示”,就不要“告诉”。让用户通过操作来学习,文字只起到补充解释或邀请操作演练的目的。

规则2:不要一股脑展示所有的教学内容

“如果你一开始就展示所有的教学内容,想把所有东西都教给玩家,他们会不堪重负,失去参与的欲望。”Tutorials 101这样告诉我们。把“玩家”换成“用户”,这句话与移动设计的关联就很明显了。

如果新手教学中的信息量过大,那么即使用户真的会去学习,到了实际需要用到的时候,他们也会忘记之前学到的东西。要在用户需要帮助的时候,将教学信息以简短、易消化的碎片形式提供给他们。要知道,新手教学同样是使用户产生第一印象的地方,你想让用户产生“给我更多”的愿望,还是“少给我点吧”?

Dooo vs. Todoist

iOS上的Dooo应用,一上来就使用了11个界面展示新手教学内容。

iOS上的Todoist应用,每次只在当前需要的地方展示一条提示,例如添加任务或查看选项菜单。

UserTesting最近在“Six UX Lessons Learned From the New Facebook App,Paper”一文中确认,“用户更喜欢操作指导”,这里所说的“操作指导”指的就是应用在用户第一次实际使用时提供的一系列情境化的操作提示。

要点:不要在用户实际使用产品之前将所有的教学内容都展示给他们,而是在用户真正需要引导和帮助的时候提供最精简最有用的信息。

规则3:有意思,值得尝试

Tutorials 101中提到的规则是“让教学更加好玩”。当然,不是所有的移动应用都能和“好玩”搭上边,但正如视频中提到的“教学应该像游戏当中其他任何部分一样有趣”这个道理同样适用于移动设计领域。

即使我们很难让应用的新手教学变得真正好玩,将它设计的让用户感到有意思、值得尝试,并能与应用整体体验无缝整合起来也是很有必要的。

我们对比一下NBC News和Flipboard这两款阅读类应用的引导设计方式。NBC News使用了静态的幻灯片模式,其中除了字体还算“有趣”之外,整个教学从本质上讲就是平铺直叙:文字过多、信息量大、乏味、缺乏交互性。

而Flipboard(2013)给人的初体验则完全不同:没有文字性的介绍,界面下半部分会略微翻起一部分,让你可以看到“下面”还有东西;翻起的部分自动合上之后,你便知道可以将这部分“掀起”来查看更多内容。如果这时你还没有做出任何动作,界面底部会出现提示“向上翻页继续”。

而随后的每一次翻页动效都能增强用户对操作手势及其结果的关联感知。

要点:在教学中增加用户参与的深度。尝试在合适的地方增加“有意思”的交互元素,创建一种“快速学习、直接运用”的氛围。

规则4:在实际使用中巩固学习效果

还记得你在物理课上通过一个简单的实验理解了定律之后的兴奋感吗?这就是我们现在要说的。当然,在实验之前,老师已经解释过相关的概念了,但正是动手实验让你真正理解了知识。

移动应用中的新手教学也是同理。如果你已经按照前面三条规则去做了,那么这一条会显得非常自然。形式上可以很简单,例如,在可交互的新手教学中,如果用户完成了某个操作任务,便为其提供一些视觉或听觉上的反馈。然后,当用户在实际使用应用的过程中再次执行了这个操作,那么相同形式的视觉或听觉反馈便可以巩固他们的记忆(如果使用音效进行反馈,要记得提供设置,允许用户关掉音效,因为一旦用户熟悉了这一操作,反反复复的听觉反馈就会成为干扰)。

这个方式对于“不要一股脑展示所有的教学内容”这一规则也能起到补充作用。在用户实际使用的过程中,在他们已经了解了最基本的使用方法之后,通过提示引导用户逐步了解更多的“高级”功能,或是在他们正确的完成某些操作之后给到一些预期之外的反馈(例如某种“奖励”),你便可以使用户在实际使用应用的过程当中巩固他们所学到的。

Polar(左图)会在用户玩过几轮投票之后给到手势操作的提示。Duolingo(右图)则更加游戏化,当用户完成了特定的学习目标之后,会获得奖励并升级。

规则5:倾听用户的声音

考虑到你是花了几个月甚至更长时间去打造自家产品的“专家”,恐怕你并非向用户解释应用工作方法的最佳人选。正如Turorials 101中讲到的:

“当你作为设计师在一个项目里工作了一两年,你会很容易将那些对普通人来说难以理解的概念误认为是显而易见、符合直觉的。”

在这个问题上,简单而得当的可用性测试可以清除大部分的障碍。观察你的用户,看看他们卡在什么地方,在哪里遇到问题;在他们使用产品或原型的过程中,仔细倾听他们的各种看法和评论,同时记得不要立刻向他们提问,否则将导致他们无意之中猜测你想听到怎样的回答。

Snap Payroll的设计师们在可用性测试当中发现,操作指导(或称情境化提示)可以产生最好的教学效果。而我们为RetailMeNot进行了4轮可用性测试之后,得出了同样的结论。

要点:你认为自己在精心雕琢新手教学的设计,然而对产品的过分了解有可能蒙蔽你的双眼。不妨尝试可用性测试,让你的目标用户帮你发现问题所在,并进一步找到最适合自己产品的新手教学形式。

推荐阅读:关于移动应用的新手引导设计

移动应用UI设计模式

这是一本移动应用UI设计模式参考书,分10大类介绍了70个移动应用设计模式(包括反模式),用400多个屏幕截图和图解帮助读者理解和利用UI设计模式,以解决常见的设计难题,同时提供了“即学即用”式的技巧和经验…

相关书籍推荐

译文代表原作者观点。欢迎发表评论,或到译者微博进一步交流探讨。

本站原创编译文章。如需转载,请注明:本文来自Be For Web英文原文:http://www.smashingmagazine.com/2014/04/22/rethinking-mobile-tutorials…译者信息: C7210 - UX玩家、交互设计师、猫奴、guitar fucker,现就职于腾讯ISUX(上海)

时间: 2024-10-29 18:58:55

重新思考移动应用的新手教学模式的相关文章

转折号教育互动体验案例式教学颠覆传统教学模式

10月29日至10月30日为期两天的转折号教育"演讲与口才实战营"在南京市青少年训练基地十月军校顺利开展.据悉,该基地是陶行知教育先行者所建,为晓庄师范学院的大学生提供的一个科研实践讨论的场所.此次大学生演讲与口才集训历时2天一夜,参与人员皆为南京市各大高校的在校大学生,以大一大二为主,大三的学长们也有几个参与的,他们在本次实战营的组织和参与的热情程度上来讲,他们中的少数高年级学员起到了师哥师姐的表率作用,也能够在转折号教育教育机构搭建的平台上,施展自己的组织领导能力以及个人的演讲口才

photoshop Nik Collection新手教学教程分享

给各位photoshop软件的使用者们来详细的解析分享一下Nik Collection新手教学教程. 分享一览: Nik Collection介绍 免费是好事吗? 对各用家来说当然是好事,尤其是未接触过专业插件的用家正是体验的大好时机. 但对此插件的忠实用家来说便更加肯定Google已再无心发展这套后期插件,实在有点可惜. 本来是贵到令人却步的外挂 Google还未收购Nik Software之前,Nik是PS 插件界鼎鼎大名的一线公司,当年甚至有Nik software Podcast,每星期

云计算支持的操作系统课程教学模式探索

云计算支持的操作系统课程教学模式探索 欧阳纯萍 阳小华 余颖 李晓昀 操作系统课程因其内容抽象,与计算机硬件知识结合紧密等特点,被普遍认为是一门难教.难学的计算机专业核心课程.结合目前在教育领域广泛应用的云计算技术,从任务驱动式理论教学.自主式教学内容扩充.分层式教学实践三个主要环节对操作系统课程教学进行全面的改革和实践.实践证明该教学模式提升了学生对课程重点和难点的掌握程度,也提高了学生的自主学习能力,达到了计算机专业人才素质教育的目的. 云计算支持的操作系统课程教学模式探索

关于软件的思考(一)---面向对象、模式、框架

对象     软件是什么?这是一个很难说明的问题.简单的说,它是一些有逻辑的计算机代码.但是从另外的角度来说,它也有很多种意义也存在多种迷惑.比如,软件是不是一种工具?它和人的思维到底是什么关系?他应该不应该有个性甚至于有生命?软件的未来是什么样的?软件和人未来会是什么关系?        人类对于计算机软件的研究已经有几十年的历史,但是感觉上还是在软件发展的初级阶段.软件的发展方向不明确,软件自身的很多问题从产生以来就一直困扰着开发者.人们发明了多种开发语言,也发明了面向过程和面向对象两大类开

大视野:药品安全引发的思考 旅游电商的商业模式

2月6日,中国国际http://www.aliyun.com/zixun/aggregation/17573.html">广播电台<环球财经大视野>邀请<全体育>总编辑张路平,讨论了运动员的商业价值开发究竟谁说了算?此外,还邀请到<南方周末>记者雷磊,解读了"房姐"龚爱爱背后的神木"金钱游戏". 针对游泳奥运冠军孙杨日前被处罚的消息,张路平认为,孙杨确实违反了纪律,而通报批评.扣除训练津贴以及禁止其参加社会商业活动

案例学习 &#8211; 关于VSCO Cam的可用性测试

Visual Supply公司出品的VSCO Cam是一款时尚并强大的移动端照片处理应用,无论在App Store还是Google Play都有着4.5星的优异战绩.VSCO有一大批忠实的用户群,而且他们的Grid(应用内置与在线的照片流)当中有着很多我所见过的最美的照片.在2014年5月,他们成功融得4000万美元的投资. 可用性测试的目标 通过6个基本任务识别出VSCO当中的可用性问题及痛点.其中的3个任务直接来源于App Store的小编所撰写的简述: Visual Supply公司的这款

《突击风暴》国服二测玩家认可盛大改进

韩国第一人气网游<突击风暴>国服二测已于上周开启,经过一个周末的激烈厮杀,很多新老玩家对此次<突击风暴>新版体验表示认可,基于第一次测试中玩家提出的一些需改进问题,这个版本中已有优化改善.虽然此次版本仅开放了完整优化版本内容的30%,但与首测测试版本相比,内容确实已有很大改进,玩家们对后续即将开放的内容也充满期待. 新增新手教学模式 上手更快更容易 作为韩国FPS竞技网游的NO.1,无论从专业竞技手感,地图平衡,真实弹道等因素上,<突击风暴>的表现都属上乘,但在之前版本

10款开发教学网站推荐

  CODECADEMY 学习开发的最好去处,提供JS,HTML,CSS,PHP,Python,Ruby,APIs的教程,界面干净整洁,一步一步引导你学习知识,很适合新人入门.同时提供实验 CODE SCHOOL 提供Ruby, JavaScript, HTML/CSS& iOS开发教学,非常有意思的教学指导. 不过基本教程虽然免费,一些高级教程是收费的. CODE RACER Treehouse研发的创新开发教学网站. 与其说这是开发教学网站,不如说这是一个开发竞赛网站. 非常有序的学习方式.

利用博客提交作业的程序设计课程实践模式

(本文基于本人近三年来的工作写成,发表于<计算机教育>2014年第18期) 利用博客提交作业的程序设计课程实践模式 贺利坚  卢云宏 (烟台大学 计算机学院,山东 烟台 264005) 摘  要:探讨利用博客提交作业的实践教学模式改革,在合作.模仿.主动投入理念的支持下,保证教学效果,同时也解决了作业抄袭的顽症,在养成习惯等方面给学生带来了更多的机会和额外回报.关键词:程序设计:实践:博客:互联网 0  引  言 计算机类专业程序设计课程的教学改革一直是焦点话题.无论采用案例教学,还是培养抽象