BeFor Web
为网而生 - 关注移动互联网及AR/VR产品的用户体验设计

十佳应用的故事(1) - 想法、产品定义与交互设计

十佳应用的故事(1) - 想法、产品定义与交互设计

眼看着进入8月下旬,天气相比前面几周有所凉爽;所谓凉爽,也只是高温从40来度降到36、7度的样子。

刚刚过去的几天怕是要成为人生回忆当中的经典之一了。依次看掉Metallica和Korn的现场,回想起来,有好多像梦一样不那么真实的情景在里面:夏季的夜晚、暴躁的吉他音墙、灯光、嘶喊、摇摆、泪水、满眼的黑T恤和金属礼、散场后打不到车而坐在路灯下抽烟到半夜...然而,如果要我判断,是现在这样安静的坐在屋里吹着空调做博客更像真实的存在,还是那些回忆里的东西更像,我真的难以回答。

想吃曼妥思了。说正经的。本周及接下来一周的话题,原文来自Jeremy Olson,北卡罗来纳州大学生一枚,Languages的作者。关于产品是如何从想法概念开始最终走向市场,他所谈到的一些经验和实践方法,值得借鉴。

这里进入译文。之所以写这篇文章,是因为我相信,相比于失败,我们能从成功当中学到更多。爱迪生在发明电灯泡的过程中经历了数千次的失败,如果我们仍然要基于各种试验和错误来重新发明灯泡,那简直是愚蠢的。怎样从成功的产品中汲取经验?如今我们有了完整的实践模型。

移动应用产业当中有非常多的闪光点。虽然我很想说我的成功源于自己的才能,但事实并非如此。经过对那些在App Store当中获得成功的独立开发者的反复学习,我掌握了一些用来获取成功的基本原则和实践方法;我也希望这篇文章可以帮助各位读者学到同样的东西。

大想法

我的第一个应用,Grades,非常成功。媒体喜欢它,用户喜欢它,苹果也喜欢它。只是有一个问题:它不能帮我赚钱。当然,它还是可以带来些收入的,但不管怎么说,Grades还是太小众了,它所面向的就是那些需要在全学年当中跟踪自己学分的大学生。

01-grades-top-10-ios-app-idea-design.jpg

如果想要继续制作售价低廉的应用,那么我们的下一个产品必须足够“大”,它需要对几乎所有人都具有吸引力

当Sonico Mobile的创始人Alex Marktl来找我们合作一款离线翻译应用时,我们的机会来了。这是一个经过检验的市场,Sonico的iTranslate应用拥有超过3千万的用户,而且这个市场当中有一个巨大的缺口,那就是缺少一款价格合理、不需要网络连接的翻译应用。

我们了解了一些用户对于iTranslate的反馈,研究了同类产品的竞争状况,然后我们非常确信,这块市场当中的机遇是相当巨大的。此外,我的四人团队对于教育和语言方面的产品真的很有热情。市场、机遇、热情都在眼前,简直是完美的状况。

我们通过Skype聊了几轮,讨论了具体的合作协议,然后准备开工。

(捣乱分子:关于产品的想法是至关重要的。新的Languages应用与之前的Grades相比,虽然吸引到的媒体报道的规模是相似的,但Languages在一天当中带来的收入抵得上Grades两年的水平!)

对产品进行定义

虽然我很想直接开始画线框图,不过我们还是以研究作为起点,首先对新产品需要解决的问题进行定义。

竞品纵览

02-competitors-large-top-10-ios-app-idea-design.png

点击查看大图

App Store非常伟大的一点在于,它是世界上少数几个能让你轻松找到潜在竞争对手相关信息的应用市场之一。简单的搜索一下,看看竞品的功能、排名、用户评价及推广方式,看看有多少用户愿意付费,这些都是帮你深入了解目标市场的绝佳方法。诸如App Annie这样的网站甚至可以帮你分析竞品的排名状况。

我们选取了一打最棒的竞品,分析它们的优势和不足,以及我们可以怎样击败它们。我们了解到,虽然市面上确实有一些离线翻译应用,但它们要么设计的很差劲,要么售价太贵。我们知道自己可以做的更好。

用户体验测绘

对产品进行定义的时候,我们聚焦于思考怎样帮助人们解决生活当中遇到的一些实际问题,而不是凭空列出一堆很酷的功能。我们将这个过程叫做“用户体验测绘”。测绘工作通常需要花上1到3天来进行,期间,我们会:

  • 分析用户在不使用移动应用的情况下的日常行为经验,发现他们在实际生活中遇到的问题。
  • 进行头脑风暴,设想出一种能够帮助人们解决这些问题的最理想化的应用软件。
  • 选择需要聚焦的核心问题,确定哪些功能在实际产品的第一版当中是可行的。
第1步:定义用户角色

作为设计师,我们需要具有充分的同理心,去尽可能地了解用户当前的感受以及他们的思维进程(推荐阅读:八个小方法,帮你成为更具同理心的设计师)。走出门去,与人们进行交谈,这可以帮你增长不少见解;不过在眼前的项目当中,由于我们对于翻译类产品已经非常熟悉了,所以在这个阶段里我们并没有花时间和潜在用户进行直接对话。

03-l-users-top-10-ios-app-idea-design.png

点击查看大图

取而代之的,我们直接开始就潜在用户的人格特征进行头脑风暴。

接下来,我们选择了那些我们最需要关注的目标用户特征,并将它们写入用户角色当中。

04-l-personas-top-10-ios-app-idea-design.png

点击查看大图

用户角色是一种包含了目标用户群人格特征的虚构人物。虽然其本身是虚构的,但用户角色应该基于真人,并且应该准确的抽象出真实用户的特质。没有人物进行参考对照,用户体验测绘工作将很难进行。

在我们的用户角色中,Emily是一名21岁的大学生,在埃默里大学(Emory University)学习法语。她在语言方面没什么特殊的天分,但很喜欢法语,希望自己能试着读懂法文著作,而且盼望着到法国留学。

我们一共创建了3个用户角色,他们涵盖了目标用户群当中大部分的关键人格特征:Emily,学生;Johann,欧洲商旅人士(后来的事实证明了我们的推测:应用销售额的70%都来自美国本土以外的用户);Paul,搞IT的,爱好学习新语言。

第2步:描绘用户在没有移动应用帮助下的行为与体验

05-personas2-top-10-ios-app-idea-design.png

点击查看大图

为了描绘出用户的现状,我们挑选出了与“翻译”相关的三个最关键的体验模式——个人翻译、社会化翻译和行程当中的翻译。

接下来,我们对用户角色在这些体验当中的行为及可能遇到的问题进行了头脑风暴。举个例子,对于第一类,个人翻译,Johann会通过不同的语言向他的客户们发邮件,期间遇到不确定的单词时,他需要拿出词典查找。

第3步:讨论最理想的辅助方式

我们描绘出了目标用户在没有应用辅助的情况下是怎样完成任务的,接下来就需要对我们的应用可以怎样辅助他们完成这些任务进行头脑风暴了。这个过程中我们不会去考虑盈利、预算、时间节点等方面的因素,焦点完全集中在那些帮用户解决实际问题的创意设想上面。

第4步:做减法

06-finally-top-10-ios-app-idea-design.jpg

这个环节是非常残酷的。我们之前已经得到了一大堆很酷的功能设想,而现在则需要砍掉当中的绝大一部分。好的设计,更多的是来自于减法,而非加法。你要找到那些有待解决的最核心的问题,在产品的第一版当中,将全部功能和设计都聚焦在这类问题上,而将不相关的、非本质的、拍脑袋想出来的东西全部移除。

“抛光”一款应用需要花费大量的时间。所以,如果一上来的功能范围过于宽泛,你的应用就很难聚焦,而你几乎没办法使当中的任何一个功能达到完美的体验状态。

07-contexts-top-10-ios-app-idea-design.png

点击查看大图

到这里,我们就得到了具有一定试验性的1.0版本的定义。现在我们知道这个应用究竟是关于什么的了。你可以到我们的博客当中了解更多关于用户体验测绘方面的信息

产品定义

经过了用户体验测绘阶段的工作,现在我们可以给出关于产品本质的定义声明了:

一个可以帮助用户迅速查找单词及其定义的多语种离线字典,售价99美分。

这份声明让我们在接下来的设计开发工作当中能够保持良好的聚焦。它就像试纸一样,帮助我们对接下来有可能产生的任何新想法进行评判;如果新设想新功能有悖于这份定义声明,那么它至少不会出现在1.0版本当中。

草图和交互原型

到了将我们抽象的想法塑造成具体蓝图的时候了。

我们首先会把若干界面之间的流程关系大致梳理出来。如今,在类似的阶段当中,我会以草图的形式为主,并通过POP这样的工具将草图分享给不在本地的团队成员或客户;不过在当时,我们主要是通过OmniGraffle来创建粗交互原型的。

别让我思考

在这个阶段,我们的目标是通过符合直觉、操作简便的界面来帮助用户解决问题。本质上讲,我们的工作就是避免用户思考界面,让他们将注意力集中在内容上面。

这可是个大话题,Steve Krug曾经写过一本经典的书,Don't Make Me Think,如果你还没读过的话,现在是时候了;很棒的一本书。

别让我做事

08-mockup-top-10-ios-app-idea-design.jpg

人们不喜欢做事,所以我们总是尽最大可能避免他们进行不必要的操作,或是被不相关的信息所干扰。上图当中的线框图展示了我们是怎样完成这个目标的。我们希望用户查找单词的过程尽量简短,所以在用户输入单词关键字时,与其他多数应用提供搜索建议的做法有所不同,我们会直接将对应这些搜索建议的单词翻译展示出来。我们还找到了一种解决语言切换问题的方法,也就是允许用户输入任何一种语言的单词,然后在界面左侧显示某种语言的翻译结果,在右侧显示另外一种语言的结果。

像人类一样思考

09-dictionary-shelf-top-10-ios-app-idea-design.png

我们希望我们的词典外观能给用户带来真实的感觉

因为这是一款离线翻译应用,所以我们希望能给用户带来一种强烈的印象,就是这些词典是真实存在于他们手机当中的。我们希望词典给用户的感觉并不是云端数据库当中的一堆数据,而是像真实的词典那样可以让他们随时随处打开使用。我们使用了摆满词典的书架形象作为隐喻,与用户进行快速直接的沟通。

随着触控界面的不断成熟,用户其实不再那么需要拟物化的界面来了解外观与功能之间的关联了。不过有时,仿真效果的隐喻确实可以提升用户的期望,带来一些纯数码界面所无法产生的使用体验。

持续探索

线框图在外观上有些丑陋,因为这个阶段不需要任何视觉设计方面的因素介入。我们不会直接打开Photoshop创建界面,因为相对丑陋的草图或线框图可以让我们聚焦在交互方面的问题上,使我们可以更快速的探索大量的想法。

随手将想法画出来只需要几秒钟,我们对这个阶段的工作甚至乐此不疲了。想法越多越好,我们要把每块石头都翻过来,寻找任何一个值得仔细推敲的想法。

有时你会发现,折腾来折腾去,最早的想法却是最好的,但要发现和证明这一点,你必须尝试过其他的方式才可以。我和一些设计师进行过相关的交流——他们做出的应用都是我相当喜欢的——大家有一点共识:通往成功设计方案的秘诀,不是“天才”,而是持续不断的探索。他们在找到一个不错的解决方案之后不会驻足不前,他们会一直前行,直到尝试过能够想到的全部方案

待续:十佳应用的故事(2) - 视觉设计与开发

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

本站原创编译文章。如需转载,请注明:本文来自Be For Web
译者信息: C7210 - 交互设计师、UX热爱者、译者、猫奴、音乐玩家,现就职于大众点评网用户体验设计部(DPUX)
评论 (17)
刚开始做交互的小白,读完受益匪浅,感谢译者!
有用就好,谢谢支持
博主好, 我是一名学做开发的学生,现在在实习。慢慢的我对于做产品有了很大的兴趣,我对用户体验情有独钟,感觉很神奇,喜欢研究。但是我没有相关的经验,投了简历也没有消息了。总是愁找不到一个可以学习的机会。看了博主的文章,觉得是不是我也可以按照博主开发一款产品的思路进行下去开发自己的产品。 我发现,研究人也是很难的。倒不如做开发的生活清闲了。但是我还是想试一试。 博主,我想问你一些问题,进行用户角色定义的时候,是针对产品的适合人群而有针对性的定义呢?还是按照生活中的人进行分类定义?是头脑风暴出来的这些角色的特点么?其次,走出门去和用户交流,是找用户模型中的用户吗?该以什么方式说服他们和我们合作,毕竟他们都是陌生人啊?目前就想到了这些,希望博主能给我回复。解决我的疑惑。
hi,“针对产品的适合人群而有针对性的定义呢?还是按照生活中的人进行分类定义?”,我个人来说,总结下来更多的是基于生活中一些特定的熟人来抽象出一个或若干个“人群”。“自己认识或有所了解的人”是抽象的一个基础。至于“走出门去与陌生人直接交流”,我只在这方面做过到情境中(比如咖啡厅)为陌生人展示设计原型来获取反馈。希望能帮到你。
很不错的文章!我是做技术和产品经理出身的,对于这方面一直很感兴趣,和团队也一直致力于做好的用户体验的产品,读完此文仍然受益匪浅,一个好的设计一定是基于好的设计方法和流程,有坚实的基础才能真正发挥好的idea最大的潜力。
是的!多多交流:)
文章超棒,为我们展示了一个产品整个过程,受益匪浅,感谢译者!
谢谢支持:)
好适合讲自己的作品集...
这也是不错的思路~启发了我~谢谢
是的,打算将来也这么写点什么..
同事在群里推荐的,感觉非常受用,制作思路清晰,核心内容也讲的很清楚,谢谢分享~
有用就好,多多交流:)
很好的文章,感谢译者的辛劳。
谢谢支持
很棒的文章,让我了解到一个产品的是经过怎样的思考、分析并打磨出来的:)
是的,我也很喜欢读这样的过程
发表评论