[译] 快速原型设计的新手指南从一个想法到完整的产品，过程是复杂的。每一个想打造自己产品的人都应该具备原型设计的能力，通

原文地址：A Beginner’s Guide to Rapid Prototyping

原文作者：Anant Jain

译文出自：掘金翻译计划

本文永久链接：github.com/xitu/gold-m…

译者：Ryden Sun

校对者：Ivocin

7分钟（甚至不到）内了解快速原型设计的一切

照片由 Denise Jans 提供于 Unsplash

从一个想法到完整的产品，过程是复杂的。每一个想打造自己产品的人都应该具备原型设计的能力，通过原型获得反馈，然后不断进行迭代。这也是 UX 设计师工作中的重要一环。

原型设计有很多种形式，从纸上简单的草稿到看起来像最终产品的交互模拟，都属于原型范畴。这篇指南是写给那些想理解原型所有相关方面知识的初学者的。

我们除了会讲到一些快速原型设计相关术语的含义之外，还会有以下这些方面：

快速原型设计是一个不断迭代的过程，将网页或者应用可视化，以此来获得用户，利益相关者，开发者和设计师的反馈和认可。

当使用的好时，快速原型设计可以通过加强多方沟通，避免制作出一个用户不喜欢的产品，以此来提高设计的质量。

原型设计并不是一个系统的完整功能性版本，它只是被用来帮助可视化最终产品的用户体验。就像谷歌 Ventures design（风险投资设计，一种用设计入股创业公司的方式）合伙人 Daniel Burka 说的：

一个理想的原型应该是 “Goldilocks”（金发姑娘，用来形容完美平衡，刚刚好）般的质量。如果原型的质量太差，人们不会相信这个原型是一个真正的产品。如果质量太高，会导致你没日没夜的工作，并且你完不成。你需要一个 “Goldilocks” 的质量，不需要太高，也不要太差，刚刚好就行。

你不仅可以为屏幕，移动应用或者网页进行原型设计，甚至说是任何东西都可以进行原型设计。原型设计可以极好的测试以下方面（提供了案例）：

所以，你现在知道快速原型设计是干什么的了。但是你怎么来做呢？我们后续会讲到。

快速原型设计包含了一个 3 步走的流程，根据需求多次迭代：

原型，评审，改进，迭代。

一个原型通常是从一个简单的模型开始，只涵盖关键点，随着用户反馈的数据收集，通过每一次迭代变得更加完善，复杂。

集中精力在那些关键的功能，这些功能是用户最常使用的。快速原型设计的意义是，在不需要规划整个产品细节之前，展示一个功能是怎么工作的，亦或是它看起来是什么样的。谨记，我们的目标是 “Goldilocks” 般的质量！

一次性对整个用户流程进行原型设计。比起一个界面一个界面的设计，原型设计应基于一个用户使用场景，这个场景包含所有你想进行原型设计的区域。通过这种方法，你会得到更精准的用户反馈，因为你的原型会切实的反应用户真实生活中的场景。比如，将“注册/登陆/重置密码”一套流程进行整体原型设计。

除此之外，要记住，心中要有一个迭代计划。按经验来说，制作迭代计划时要从全局入手，然后超更细节的解决方案版本入力。随着你不断迭代，原型的保真度和所包含的内容，都会不断增长。

但是稍等，什么是保真度？

保真度是指原型与最终产品或解决方案的相似度。你可以从不同等级的准确度中选择，根据目前流程的阶段和原型的目标来选择。

布局和设计是原型保真度中最显眼的部分。如果一个原型从开始就保持高视觉保真度的产出，用户会倾向集中于视觉，而不是功能细节，这会偏离早期阶段原型的主要目标。

静态原型有两种保真度 - 草图（低保真）和设计稿（高保真）

原型是静态还是必须要看起来支持所有功能（可交互）？两个版本都有好处和坏处：静态原型可以更简单快捷的实现，然而可交互版本后续可被用来做可用性测试和用户培训。

一个高保真的可交互的原型。 (来源)

原型的早期阶段，使用统一的固定文本内容可以有效的避免用户从提供功能性反馈中偏离，而不是对文本内容进行评论。

然而，随着原型设计的流程递进，用实际内容来替代冗余的文本，这样用户可以感觉到整体设计的影响。

使用实际的标签也是一个很好的机会来测试你“复制的内容”的工作效果。复制对于文本空间和屏幕中信息是一个美妙的术语，就像我们把“发布”按钮叫做“发布”，“发表”，“发送”，“完成”或者其他的叫法。

低保真： 低保真度就像“笔和纸”，草图会生成静态的原型图，包含较低的视觉和内容保真度，以此来支持快捷的改动。这会强制用户集中于功能以及他们如何使用这个系统，而不是系统看起来怎么样。
中保真 电脑端的工具比如 Visio 所产出的原型我们叫做中度保真原型，由界面框架和工作流组成。这个程度的保真是用来展示系统的表现行为，来判断用户的需求是否被满足，以及来评估用户体验。
高保真 高保真原型有时候会太真实，以至于经常与实际产品搞混。它们的产出也更耗费时间。一些工具像 nVision, Sketch, Figma, Adobe XD, Framer 等允许非技术用户来创造高保真原型。虽然它们不能被转换成可用的代码，但是可以很顺手的被用来做可用性测试和用户培训。