什么才是正确的原型设计？

Posted 2020-09-04

草图，线框图，设计草稿，高分辨率的可视效果：原型对交互式应用发展的作用是必不可少的。下面跟大家一起探讨一下其中的联系和区别，哪些方式适用于哪些项目。

在电子产品的开发中没有一个最终目的是原型。原型的目标是将想法，功能，内容形象地表达出来，以此得到反馈并改进产品。交互设计中最重要的挑战往往是界面：它应该是友好的，直观的，最好是一目了然的。

在开发的过程中会不断地出现一些必须用原型的方式来解释的问题：用户感知到了什么元素？组件是如何交互的，整个系统背后的逻辑是怎样的？这种逻辑用户是否能快速的理解？操作是否会令人困惑？原型能够帮助解答建立在使用价值之上的实际问题，以此做出最好的设计方案。

但是什么样的原型适合一个交互项目的什么阶段呢？它应该尽量精致还是应该简易、快速？是否还能用工具对原型做一些快速的交互呢？

从低保真到高保真

原型根据外观和功能有不同程度的保真度。Sketches或者Scribbles通常足以应付第一阶段的草稿。在这种类型的低保真原型中线框也只用保持简练和单色，只用突出框架和功能。这些简略的草图不用色彩丰富绚烂，不用太多的可视化的元素。

用Axure,Balsamiq或者Mockplus等带有许多组件的原型软件工具能让你快速地制作界面。通过进一步地集成设计元素，线框图能够打造得更为精致。

在高保真原型阶段，原型和产品同步完成

这种情况下设计稿已经充斥着色彩，图形，文本，间距和字体。对于高保真的程度是没有统一的标准的，可以用PowerPoint展示，可以用html，亦或是图表的形式。你也可以用Photoshop组合你找到的视觉元素。如果网站或APP是动画的，用比如说After Effects这样的软件就可以清楚地向客户展示产品的思路是怎样的。

团队讨论和概念测试中效果不用夺目

测试过程并不会像实践一般简单，合适的原型取决于几个因素：目标组，技术背景和开发阶段。“没有比手绘草图更好的了”，汉堡的UX设计师Miriam Scheibe说到，“像乒乓球一样在概念和开发之间不断来回打磨构思。”Scribbles也能用被用来展示行为和交互，比如说展示当用户完成登出的流程后会发生什么。在这个阶段只有概念需要被印证，没有视觉设计的必要。“想法有多模糊，原型就应该有多简单”，Miriam说到。这些草图应该尽量地远离产品，因为针对早期测试它们还需要修改成特殊的形态，能够形成模板，利用原型软件能够方便的变为简单的交互网站或APP。

内部细节沟通

Wireframe有助于内部沟通，以传达在设计，视觉，开发方面的架构信息。尽管这种工作可以由PDF完成，但是其自带的丰富的工具能提供更多。取代了大量难以阅读的任务列表，越来越多的的机构都在使用可以模拟应用效果的交互线框图。快速的原型工具Mockplus也能提供帮助。

视觉工作是有必要的。“如果团队在概念阶段达成了一致，想要得到部门经理的认可，展示形式需要更为具体”，Miriam Scheibe解释到，“因为这些人通常没有太多时间，你可能需要在电梯里阐述你的想法。在没有时间和预算用于Photoshop设计的情况下，Wireframe也能够用于集成背景，图案，字体和色彩。”

甚至如果代理人是代表风险投资的客户的话，最好依靠高保真的原型而不是在观众前表述抽象事物的能力。在这种情况下爆炸式的美学和令人印象深刻的触感更加为你的表达加分。

综上所述，不同的设计阶段和设计需求有很多合适的工具，线框图适用于内部细节沟通，包括页面结构／导航／交互细节等，草图用于捕捉想法，不必纠结细节的构思阶段。原型图则是针对原型测试和改进，关于行为和逻辑的验证阶段，选择适合的工具可以为极大地提高设计的效率和质量，更好地完成产品。