UE交互设计之产品原型制作
在将抽象的产品需求具体化的环节中,制作产品原型是关键的一个环节,因为它要将大量的信息转化为可视化的图形。
产品原型是用于表达产品功能和内容的示意图。一份完整的产品原型要能够清楚地交代:产品包括哪些功能、哪些内容;产品分为几个界面,功能和内容在界面中如何布局;包括用户流程在内的所有用户与产品的交互细节如何设计。概括来说,产品原型要涵盖三个要素:元素、界面、交互。
通常情况下,产品原型是由产品经理和交互设计师一起完成的。那么为什么不是由产品经理确定产品原型的功能和内容,然后将产品原型的制作工作全权交给交互设计师呢?因为从某种意义上来说,制作产品原型仍然属于规划产品功能的工作范畴,产品经理规划产品功能并不是对产品功能进行简单的罗列,而是要在产品策略的指导下,在产品价值、产品可用性和技术成本之间寻找最佳的平衡点,而产品原型正好是完成这项工作的最佳工具。相对来说,交互设计师虽然在交互设计上更加专业,能够确保产品的可用性,但是在对产品价值(主要是用户需求)和技术可行性的把握上,以及对产品策略的理解上,远远不如产品经理。因此,通常的做法是:产品经理负责制作最原始版本的产品原型,在产品原始的功能、内容相对确定的情况下,再由交互设计师对产品原型进行优化,进一步提升产品的可用性。
一、产品原型的重要性
1.有助于完善、优化产品需求方案
在此之前,产品需求还停留在抽象、模糊的概念阶段,产品经理对它的思考可能没法做到足够的深入,而制作好的产品原型已经非常接近最终的产品成品了,所以通过制作产品原型,可以帮助产品经理把产品需求考虑得更加清楚。
在制作产品原型的过程中,一方面,可以模拟不同的用户场景,试用规划的“产品功能”,这样就能够轻松发现遗漏的功能模块、逻辑分支,以及其他一些细节;另一方面,还可以分别以用户、UI设计师、开发工程师的视角审视产品原型,发现其中的不足并加以改进。这样,通过不断地修改产品原型,对产品需求的思考越深入,产品需求方案也就越完善、越合理。
2.方便对产品需求进行评估
一旦产品需求进入开发环节,再进行需求变更所要付出的代价往往是巨大的——视觉设计师要重新设计视觉DEMO,开发工程师要重新进行系统设计并修改代码,这样不仅有大量的时间和资源被浪费,项目进度也无法按原计划推进。因此,在我们投入大量资源进行实际设计和开发之前,对规划的产品功能进行评估,确保产品需求是正确的、合理的就非常有必要了。
相对于使用文档,使用产品原型进行产品需求评估更加具有可操作性。一方面,产品原型的制作成本并不是很高,多数时候比用文字描述功能方便得多,修改也非常容易;另一方面,产品原型将产品需求形象具体地展示在我们的面前,这种可视化的方式能够大幅提升产品需求评估的准确性。
产品需求的评估包括三个层面:
首先是产品价值的评估。
产品价值包括产品对用户的价值和产品对公司的价值。产品对用户的价值,即产品给用户带来的利益,产品满足了用户哪些需求,帮助用户解决了哪些问题;产品对公司的价值,即产品给公司带来的利益,如产品市场占有率的提升,产品利润的增加等。
首先要保证产品对于用户来说是有价值的。如果条件允许,交互设计师应该向目标用户演示产品原型,从用户那里获取宝贵意见,确保规划的产品功能是用户所需要的。
产品对用户的价值和产品对公司的价值在多数时候是统一的,产品给用户带去价值的同时也会促进公司价值的增长。但有时候两者也会有冲突。比如,通过部分产品功能对用户进行收费,可以促进公司收入的增长,但势必就会损害到用户的利益。当两者冲突的时候,产品需求要对它们进行平衡,体现产品整体价值的最大化。
除此之外,对于产品需求如何更好地体现产品价值,不同的人从不同的角度考虑,也会有不同的看法。因此,在产品需求进入实际设计和开发之前,务必进行产品需求确认,即召集所有产品相关方(老板、其他相关产品的产品经理、客服代表等),在产品原型的基础上对产品需求进行讨论,消除分歧并达成意见统一,以杜绝产品需求进入实际设计和开发之后因产品相关方提出新的要求而导致需求变更。
其次是产品可用性的评估。
产品对于用户仅仅是有用的,这还远远不够,它还必须足够好用。产品经理要和交互设计师一起不断地提升产品的可用性,让不同类型的用户都能够很好地使用产品。
产品原型让产品可用性评估变得更加容易,产品的界面设计和交互设计是否足 够友好在图纸上变得一目了然,而且我们还可以通过不同的产品原型来对比不同的想法。当然,如果这样还不能确保实现最佳的用户体验效果,那么我们还可以用产品原型进行产品可用性测试,通过邀请目标用户试用产品原型,来确定产品功能的实现方式是不是符合用户的期望。
最后是产品技术可行性的评估。
产品不仅是有用的,而且是好用的,但是如果实现不了,那也是枉然。经验丰富的产品经理能够准确地判断出产品功能是否具有可行性,不过找开发人员来进行深入评估,依然十分有必要。
产品的技术可行性评估要明确:产品的技术实现方案是否全面,有没有遗漏了哪些分支;在现有的条件下,能否实现所有的功能,存在哪些难以克服的障碍;产品的技术方案是否存在风险,我们可以有哪些预防方案。
总而言之,产品需求在进入实际设计和开发之前,要进行详细的评估,确保产品功能符合用户的需求,对于用户来说是足够好用的,并且能够通过技术手段实现。这些评估工作的开展通常是基于产品原型进行的。随着评估工作的进行,产品原型也会被不断优化,所以一份产品原型从刚开始的初稿到最终的定稿通常要经过多次反复的版本修改。
3.有效降低与团队成员间的沟通成本
产品原型的重要性还体现在它能够有效降低与团队成员间的沟通成本。
在实际工作中,产品经理需要向很多人描述产品需求,如高层、业务相关方、开发工程师、设计师、测试人员等。而产品需求往往信息量非常大,写成文档动辄几页、几十页,不仅产品经理描述起来难度非常大,而且他人要在短时间内深入理解也非常困难。而产品原型最大的优势就是能够将产品需求以图形化的方式进行演示,使产品需求一目了然,大幅提升沟通效率。例如,有经验的开发人员对着几张原型图,不用过多的解释,就能够马上明白需要编写哪些功 能模块,以及这些功能模块间是怎样的逻辑关系。
二、如何制作产品原型
制作产品原型不用拘泥于工具,用原型制作软件(Axure、Balsamiq)、流程图软件(Visio)、图像处理软件(Photoshop)、办公软件(Word、Excel、PowerPoint)、HTML编辑器(Dreamweaver),抑或是直接在纸张上手绘,都是可以的,关键就在于哪个工具对于你来说操作最方便,且能够清晰地表达产品原型的所有要素。
在这些工具中,Axure由于操作简单、功能强大,受到多数人的推崇。大部分时候,我们可以借助Axure来快速地完成产品原型的制作;遇到Axure较难制作的部分,则可以辅以其他工具来配合完成,比如,复杂的表格可以在Excel中制作好后再截图到Axure的产品原型主体中。
在所有产品原型的交付件中,最常见的就是线框图。
那么制作产品原型时,我们需要重点注意哪几点呢?
1.元素(产品功能和内容)要完整且细节明确
产品原型是用于表达产品功能和内容的示意图,因此,产品原型首先要保证产品功能和内容是完整的。在制作产品原型时,要尽可能考虑周全,尤其要注意不要遗漏一些特殊或极端情况下的功能或内容。
比如,搜索结果页面的原型不仅要考虑搜索有结果的情况下应该显示什么内容,而且要考虑搜索无结果的情况下应该显示什么内容。
另外,对每个元素的描述要落实到具体细节上,避免过于空泛。
比如,页面中包含地图,我们不能仅仅画一个方框来表示地图,而应该将地图中所有的元素(各种控制按钮等)全表示出来。
如果有必要,我们还可以以注释的形式对一些难以用简单图形表达的功能或内容加以必要的说明。
总而言之,产品原型的元素及其细节是产品原型不可或缺的组成部分。元素不完整或是细节描述不到位,都会影响基于产品原型的产品需求讨论的沟通效率。如果产品需求因此无法得到确定,那么产品原型也就需要返工修改。
2.交互设计要同时体现产品价值和产品可用性
有了产品原型的元素,就可以在产品原型中对元素进行界面设计和交互设计了。
界面设计主要是确定产品分为几个界面,功能和内容在界面中如何布局;交互设计主要是确定产品与用户如何进行交互,产品如何响应用户的每次操作。
一方面,对各元素的交互设计要能够使产品价值最大化。
比如,在对视频网站首页进行布局时,要考虑到各内容模块(一般会有电影、 电视剧、视频等内容模块)的优先级,这样才有利于将网站的优势资源优先推荐给用户。
比如,注册流程是要求用户在一个界面内一次性完成,还是在多个界面内分步骤完成,判断的依据应该是哪种方案更有利于提升注册用户数。
另一方面,对各元素的交互设计要能够使产品更易用。
比如,用户的浏览习惯是从上到下、从左到右,因此,用户最关注的信息应尽量放在页面头部的左侧。
总而言之,产品原型的交互设计既要有助于凸显产品的价值,又要有助于提升产品的可用性。
3.产品原型不应该有过多的视觉设计元素
最后,需要特别强调的是,产品原型不应该有过多的视觉设计元素。
很多人为了让产品原型更加美观,或是更加接近最终的产品效果,喜欢在制作产品原型的同时进行局部的视觉设计,比如,对界面进行配色,添加装饰性图片。事实上,这些工作应该是在产品原型确定之后,由视觉设计师在设计视觉DEMO的时候进行的。
那么我们为什么要将产品原型和视觉DEMO这么严格地区别开来,而不在制作产品原型时完成部分的视觉设计工作呢?制作产品原型的目的是为了更加形象地表达产品需求,以方便产品需求的评估、确定工作。在这个环节,大家关注的焦点是“规划的产品功能是否合理”,以及“产品功能的交互设计是否合理”,而不是“界面是否美观,吸引人”。如果在产品原型中加入过多的视觉设计元素,那么往往会吸引大家去关注尚不成熟的视觉方案,而没法将注意力完全集中在本应重点讨论的产品功能和交互方案上。
因此,产品原型应该摒弃视觉元素,务求原汁原味地展示产品需求,重点体现产品的价值和可用性。