故在制作过程中应当注意：

1、成本低： 制作速度要快，能够把头脑里主观的想法表达出来就好

2、表达清楚： 产品策划的原型要能表达用户需求场景

3、快速迭代： 原型要便于修改高度弹性。在抛给大家讨论或给用户测试后收到一些反对意见，要能低成本地快速修改

总的来说，原型是一种思想它有点像素描，先有大框架再吸收意见，逐步细化最终投放的产品，其实也只是原型的一个阶段而已

生命不止，产品的迭代优化不息

做互联网产品的小伙伴一定不会對“原型”这个词感到陌生它就像“用户体验”一样经常被各类人挂在嘴边。它有许多近义词如线框图、故事板等。那么究竟什么是原型设计我们为什么需要原型设计，如何进行原型设计呢

本文将梳理关于原型的前世今生，弄清楚它到底是个啥我们如何使用它。

原型是一种让用户提前体验产品、交流设计构想、展示复杂系统的方式就本质而言，原型是一种沟通工具

线框图描绘的是页面功能结構，它不是设计稿也不代表最终布局，线框图所展示的布局最主要的作用是描述功能与内容的逻辑关系。

原型图是最终系统的代表模型或者模拟比线框图更加真实、细致。

原型设计在产品设计中所处的位置

很难想象一个没有原型的产品是如何诞生的

原型设计的核心目的在于测试产品，没有哪一家互联网公司可以不经过测试就直接上产品和服务。

原型在识别问题、减少风险、节省成本等方面有着不鈳替代的价值

虽然需求文档也是可以满足沟通需求的，通过用例将交互写到设计描述文档中但是原型可以更详细地解释交互。

你可以鼡屏幕录制软件或者用一只手机对着屏幕拍摄下你操作原型的过程边录制可以边评论，比如：“我现在有点晕了不知道该怎么操作，戓许点击这里看看……哎呀好像点错了。”

开始做原型之前请先考虑清楚以下几个要素：

• 做这个原型的目的是什么？
• 这个原型有多大效率帮助我传达设计或测试设计
• 有多少时间做原型？需要什么级别的保真程度

画草图的目标是提炼想法，并且最好给画草图加上一个時间限制那就是15分钟。如果你绘画能力很差那么恭喜你，可能你能更好地用好草图因为你的注意力没有放在美化你正在画什么上面。

画草图要避免陷入审美细节尽可能快速的导出想法才是关键。

用纸笔画的用户个人账户的草图示例

用HTML代码制作的相亲网站个人收集页媔草图

演示和评论的目标是把一些想法拿出来跟大家分享然后进一步完善想法。在演示过程中要做好记录，演示和评论的时间可以对半分

在明确了想法之后，就可以开始进行原型设计了这个阶段需要考虑很多细节，找出切实可行的方案运用合适的原型来表达。

原型的目标之一是让受众来检验产品是否达到了预期因此可以请5-6位测试者，通过音视频捕捉等方式看看产品原型是否被顺畅地使用了。

選择什么工具来制作原型主要考虑以下几个因素（排名分先后）：

• 熟悉程度和获得工具的便利度；
• 为测试创建可用的原型；

常用原型设計工具调查结果（2013年），出处：toddwarfel.com

不得不说这个结果很让人吃惊，没想到有那么多人用Dreamweaver做原型在这里我介绍两种我经常用到的原型设计笁具。

• 技术门槛低学习曲线不陡峭；
• 可用幻灯片母版，复用性高；
• 模拟移动端产品修改画板适应手机端尺寸即可；
• 可导出为HTML或PDF文件；

現在非常流行把Sketch与Keynote放在一起用，简单说就是把Sketch里的图层、部件拖拽到Keynote中然后添加Action动作，按照剧本完成一套交互

Axure的优点不用多说，但使鼡它一个工具就能满足设计和文档需求（通过注解生成规格文档）。

Axure自带的部件库也给制作过程带来了便捷类似Omnigraffle的stencil一样，避免了重新發明轮子

要掌握Axure，主要应该弄懂四大核心功能：

• 母版：主要用于制作网页的页头、页尾可复用性高；
• 动态面板：核心中的核心，“层”的概念很重要；
• 图片热区：在一张完整的图片上通过热区建立交互动作；
• 函数和变量：局部变量和全局变量的概念以及应用（比如用戶登陆效果）。

Axure 7.0还有中继器这个功能但是个人觉得比较鸡肋，学习成本也比较高主要可以用来做搜索框的搜索结果联想的原型。

原型測试是原型设计过程中的关键步骤是整体流程中主要的里程碑之一。

可用性测试是一个庞大的话题测试方法有一对一或者远程测试，難点是从测试中得到有质量的成功

测试结果取决于测试者，务必招募到合适的人要找到合适的人，需要对测试者制定一系列的筛选标准比如一个社交产品绝对不可能找一个连电子邮件都没有的人来测试。

测试时长可以是一个小时左右足以测试5个到6个左右的关键场景，并列出一些观察结果和关键问题例如：

• 用户如何开始任务的？（是搜索还是浏览）
• 他先做了什么，再做了什么
• 他如何做出最终决萣的？
• 他们是否领会了设计意图有什么操作困难？

关于记录测试结果可以结合定性和定量两种方式，做一张计分表用1-5的程度来表示；同时定性地记录用户的一些表达，尽可能地原话记录

最后分析这些记录，改善设计

产品原型设计或者说产品开发是没有尽头的，它昰一个不断发展循环上升，整合知识和经验不断迭代和完善过程。

粽小喵微信公众号：zong_xiaomiao，人人都是产品经理专栏作家腾讯产品经悝。一个学传播出身的产品新人爱好研究原型设计工具。

本文原创发布于人人都是产品经理未经许可，不得转载

在前段时间翻译的IDEO出品的《以人為本的设计指南》中正好讲到了构思到原型的阶段，恰好我在进修的IDF设计思维课程也到了原型设计部分因此准备出一篇原型相关的文嶂，分享所学同时也曝露一些目前国内设计行业存在的一些畸形现象

原型作为设计流程中的一个关键部分，被广泛应用在设计的各个阶段注意是各个阶段，而不仅仅是原型设计阶段

重温一下，设计思维共有五个阶段：共情（理解用户）、定义（定义问题）、构思（构思方案）、原型、测试

如果你没有阅读我翻译过的往期文章，可能不太清楚设计思维是IDEO（全球性的设计服务企业）根据多年的设计经驗与实践输出的一份设计流程研究成果，其最初目的是用于解决社会级难题如教育、贫困等后来被广泛的应用于各个设计领域，尤其是偏体系化的互联网产品设计中这个流程涵盖了系统化思考设计问题的所有部分，只要你在尝试用设计解决问题那么就能从这个流程中獲得参考价值。

事实上设计思维在海外设计教育中一般都是最早传授的关键课程，它教会我们如何系统化的思考及运用设计手段解决问題

虽然原型阶段在设计思维流程中占领着一个关键部分，但原型并不被局限于某个阶段而是可以在任何时间，任何设计阶段都能使用嘚一种设计手段例如在理解用户的阶段，当我们进行用户访谈时可以很轻易的使用草图等低保真原型来传达观点，进一步提高沟通效率

在规范的设计流程下，原型承接前期的调研工作并开启后续的测试工作且原型和测试之前经常处于一个轮动机制下，即不断的修改原型并投入到新的一轮测试中

如下图：理解——定义问题——探索方案——原型（拆解局部）——测试——原型——测试——最终原型（汇总）

而反观我们的原型设计，包括设计网站上传的设计师作品及一些产品一步到位给出的原型，又是如何设计出来的呢

理解——萣义问题——探索方案 —— 最终原型。

我曾经对接过一个产品经理很随意的把原型甩给设计师，要求设计师直接开始UI设计事实上在这の前产品经理按照常规流程，发起了一次需求评审会然而涉及到开发、产品、运营、设计、boss等多个不同职能不同身份的人同时介入的情況，此时的评审更像是菜市口吵架群体决策是一种极其低效的形式，大部分意见都没有太多参考价值最终草草收场。

所以当我正式拿箌原型后发现原型从交互细节的遗漏、到布局混乱、再到信息架构混乱等多个严重问题。此时我不是应该考虑说一句MMP而是应该思考这褙后的流程有问题还是人的问题？是因为产品经理能力不足逻辑思维能力不足，做事不严谨

有这方面原因，但只是其一后来我发现，这是一种原型的滥用这个产品经理并不理解真正的原型应该如何发挥在设计过程中的作用。可以说当下很多设计人员包括PM并未真正悝解原型这种工作方法，或者片面畸形的理解了原型设计那么原型的真正意义和作用是什么？

一图胜前言一个原型胜过一千次会议。

┅句话概括：原型是所提出解决方案的简单实验模型用于快速，廉价地测试或验证概念设计假设以及其概念化的其他方面，以便设计師可以做出适当的改进或探索可能的方向原型可以采用多种形式，手绘的草图或者精致的线框图它们都能表示你的思考过程，都代表著你的想法

正如上面所言，原型最本质的作用也是它最大价值化的方向是测试与验证。事实上原型用于测试是原型概念最初提出来的目的甚至这种方法一直融入在我们的工作甚至生活中。在你进行交流时是否会手舞足蹈甚至拿出笔在纸上写写画画没错这就是原型的早期面貌，也就是草图阶段

但在当下的互联网产品设计领域，原型更多情况下被拿来作为直接交付物而且往往从想法直接跃进到高保嫃原型，中间的过程原型测试的功能都被你吃了啊？

原型工具确实成了产品经理、交互设计的基本能力范畴，但它们大部分人并没有囸确使用原型这一工具大部分情况下，个人判断、臆测成为了原型的主要依据没有繁复的测试，没有持续的验证更多的是来自对竟品的复刻，以及最常规的解决方案案例

进一步，原型作为一种创建模型的行为在我们花费宝贵的时间和人力去开发成熟的产品之前，原型可以作为一种低成本验证产品可行性及体验的途径从基础的草图到线框图再到可交互的高保真原型，每个阶段我们都能持续测试、驗证直到我们确信，已规避大部分问题可以正式启动产品的开发。这则是原型更具有效益的意义即规避风险的同时节约成本。

在上媔的案例中我讲到产品经理设计的原型存在大量问题，而事实上这些问题都应该在他设计原型期间进行规避，如果从想法到草图再到低保真原型仔细的思考方案，持续的与设计团队沟通验证最终会规避百分之八十的问题，即减少了设计修改的成本更有可能避免上線后修改的巨额成本。

原型本质上是一种测试工具因此探索功能或方向，实验一些想法是它最主要的目的在开始具体的设计之前，不妨搭建一个简单的原型只需要具备最基本的信息或功能，然后测试它你不需要标准视觉质量的界面，甚至只需要纸上绘制的草图就能唍成这个工作

通过创建原型来增加沟通效率，学习他人的见解理解他人表达的观点是一个常用方法，很多时候人们并不知道它们想要什么直到你把它放在它们面前，你来不及开发成熟的产品但可以试着做一个简单的原型来展示你的想法。

原型可以与用户或利益相关鍺直接接触而不停留在口头上。这意味着我们可以持续的收集更真实的使用体验接触体验，从而为未来的设计工作提供依据

没错，茬没有成熟产品之前我们就能通过原型来获得同事、用户、乃至投资者的认同在早期及时的推销你的想法，以确保它真的能引起用户的興趣然后就开搞去开发真正的产品。

事实上这是我们最常用的功能方向，即原型到视觉稿的交付于对接但这只是原型的一部分功能，且相较于原型的测试和验证功能它并没有那么关键。而现在这个功能俨然快成为原型仅剩的功能了，在我们的日常工作中！

事实上现在的产品经理或者交互及UI设计师，在逻辑思维及对产品的思考方面都有较大的提升但逐渐的，大家过于盲目的信奉个人思考、个人判断在产品设计中的比重这就很容易陷入“习惯陷阱”，不会深入思考而是盲目的选择第一时间意识到的所谓最简单的方案、不仅没有創新且容易忽略一些死角问题而造成损失。

越来越多的把用户挂在嘴边在行为上却愈发远离用户，没有测试和验证却以为心里认为嘚用户就是最终用户，自己的想法就代表用户你不是用户，你甚至不是用户之一你只是你。

很多时候我们倾向于花费精力在那些令囚振奋的新想法，集思广益并为实现这些想法进行计划-直到我们在启动它们之后才意识到我们出色的设计没有吸引我们的用户。

换句话說我们以解决方案为基础的假设可能是错误的，而当它们错误时则会导致大量的时间和资源浪费。原型设计有助于防止这种情况快速且频繁地进行原型设计是检验您的假设，了解用户并改善您的想法的最佳方法

原型可以是任何东西，从餐巾纸上的草图到角色扮演：鈳以使您的想法切实可行的任何事物原型设计有助于使人们倾向于采取行动（而不只是思考）和创造偶然性的机会，这是创造真正有用囷革命性解决方案所需的创新火花

当然，原型设计并不是永远那么尽善尽美如果你陷入下面的几个误区，很容易好心办坏事浪费时間等成本在无意义的原型工作上。

1. 止于最简单的想法

我们习惯于把第一时间想到的方案当做最终解决方案但大多问题都比表面上更复杂，人的行为方式环境限制等因素可能会导致问题发展的和你期望的有所不同，因此需要原型进行测试和验证避免资源的浪费虽然，很哆时候都有一些市场上经过验证的方案但设计师不应止于此，否则设计没有进步，永远都是复制

这一陷阱又可以被称为习惯陷阱，茬《上瘾：让用户养成使用习惯的四大产品逻辑》中就提到过习惯的力量我们长期以来建立的世界观认知，经验习惯导致我们产生下意識的行为和想法其目的是避免过多的思考负荷，用最简单且已知的方式来实现目标解决问题但这并不利于创新，也无法进一步提高效率或体验

因此设计师必须逼迫自己推迟判断，避免迅速找到解决方案的诱惑而是持续的思考，去探索更多可能

成功进行原型制作的關键之一就是通过多种模型探索不同的方法，规避可能的错误汇集验证后的想法成为最终原型。

2. 过于专注你的原型

不仅是交互设计师和產品经理越来越多的UI设计师也开始在个人产品设计中使用原型设计方法，且设计师所创建的原型极其容易陷入过度设计的误区类似沉沒成本，在原型上花费的时间过多认真处理设计细节，导致对原型过分专注对其赋予更多价值，并因此无法放弃和及时修改这导致設计师忽略原型存在的各种问题，也是国内设计人员很少将原型用于测试的弊病

因此，在设计早期阶段应当快速制作原型（低保真），要求原型具有能够测试到的细节就足够不要投入过多精力，这样可以防止你或者你的同事过度依赖原型沉溺于其中无法自拔，导致荿本资源的浪费及错误的版本上线。

3. 浪费时间在讨论上

你应该避免的另一个问题是花太多的时间来介绍和解释想法而花很少的时间来莋事情以及解决问题。快速创建原型并证明它是否可行若是不可行那证明这个想法存在漏洞，你将从中学习到一些东西在对接和沟通時，如果感觉快要陷入持续的“我觉得你觉得”的无意义沟通时，快速创建简单原型来辅助决策验证想法的可行性。用原型进行解释提高效率，避免无意义的沟通

创建完全无目的的原型是一种浪费行为。原型的意义在于测试和验证假设测试我们的想法以寻求方案戓解释。为了设计（视觉）而设计的原型很可能会缺乏重点出现两种问题，细节过多（浪费时间）或细节太少（测试无效）

在创建原型之前，请问自己：“我为什么要创建这个原型”，请确保您有一个中心目的（即测试我的假设或测试我的解决方案的可用性等）然後构建您的原型就可以达到这个目的。

5. 失败导致丧失信心

进行原型制作时你会经常经历“失败”这一过程，尤其是在测试你的假设时鈈可避免会经常出现失败的情况。失败会导致负面的心态出现甚至导致设计急切的寻找一个勉强凑合的方案。然而事实上失败恰恰是原型的意义所在，它帮助我们验证了假设避免了未来更高成本的错误。失败不仅仅是失败更是学习机会。

我没有失败我刚刚发现了10000種行不通的方法。

将原型测试失败的想法重新构想成一种学习心态错误和失败是成功的必然因素，将它们作为养料共同促成最终的成功方案。

6. 将原型视为浪费时间

通过不断为每个想法和假设构建原型您是否会浪费时间？

很多时候不习惯“设计思维”的设计师和团队認为原型制作是浪费时间和资源。他们问：“制造原型会不会使我们慢下来” “ 在我们将现实世界中的事物放在一起之前，我们会更好哋专注于屏幕吗”

虽然我们在前期花费了一定时间制作原型，但长远来看通过原型设计，我们能够了解我们的想法是否会奏效并能夠进一步完善或调整它们……或者当我们意识到纸面上看似好的东西无法解决时，便放弃它们从长远来看，我们将能够更快地找到理想嘚解决方案且能以更低成本实现目标。

IDEO首席执行官蒂姆·布朗（Tim Brown）最好地说：“他们放慢了我们的脚步加快了我们的速度。”

原型事實上有三个保真度虽然我们通常只会使用低保真和高保真两种规格，但原型的确有更细致的划分原型保真度是指其完整性即详细的程喥。不同的产品不同的开发阶段完整性有不同的标准。

一般可概括为三种保真度即低保真、中保真、高保真。

• 低保真：低成本粗糙鈳以快速构建的草图
• 中保真：稍微更详细，仍然粗糙但更接近实际方案如纯线框图
• 高保真：更接近上线产品，非常详细且耗时

低保真原型易于执行且成本较低。此外它们所需的时间更少，对设计团队的“宝贵”程度也较小（意味着不会产生沉没成本效应）这使您可鉯快速发展自己的想法，并在很短的时间内遍历多个版本而不会浪费很多资源。

在项目的早期阶段您应该主要使用低保真原型，在那裏您需要测试许多假设在此阶段，您可以使用低保真原型来消除解决方案中的主要问题并评估和验证解决方案假设（即确定其是否满足团队的内部需求以及用户的需求）。

低保真原型可能包括草图纸质模型，简单的情节提要、故事板类纸质原型您将根据要创建的解決方案的类型来选择原型的类型。

那么何时需要低保真原型当您需要快速廉价的进行测试并探索各种方案时使用。

在研究了一些早期模型并解决了最显性的问题之后您应该退出原型设计阶段的分歧模式（发散思维探索方案），转向完善和测试更精细的细节为了进入下┅阶段的原型制作，您需要为原型添加更多细节和改进使它们更接近最终产品。

由于上述原因中保真度原型的开发需要更长的时间，並且可能会更昂贵这就是为什么在继续使用中保真原型之前，应使用低保真模型测试并消除足够的早期问题和假设

何时使用中保真原型？当您需要使人们对解决方案或部分解决方案的外观有更好的了解时并且当您已经测试并验证了一些早期假设时，请使用中等保真度原型中保真度原型非常适合用于完善解决方案，同时仍为更改方向和测试选项提供了空间这意味着它有丰富的细节可用于测试，同时仍然提供了设计师进一步修改优化的空间

高保真原型是在继续执行解决方案之前进行的最后测试。修改的可能性较少且将用于和开发忣设计人员对接，它们允许以精细的细节准确表示解决方案的外观

更妙的是，它们可能包含许多预期的功能高保真模型甚至可以包含所需的所有功能元素，尽管我们可能会使用不太理想的机制或技术来执行这些功能比如使用视频或者可交互软件（principle）。

什么时候使用高保真原型

当您需要测试完整解决方案的所有动态特性并出于功能，视觉和体验目的对其进行分析时请使用高保真原型。

所以当各位設计师在设计提案中将你们的界面去色化而成的原型命名为低保真原型的时候，我想你该来这里重温下原型的种类这一科目

虽然原型常鼡于测试相关的工作，但它的用途不限于此事实上原型有以下主要用法，在设计工作中遇到对应的情景都可以使用原型来解决问题（國内更多的将原型用于交付对接，这也是一个用法而下面讲到的则是其他用法）

通过快速原型来理解用户，共情用户使用移情原型可鉯理解问题以及用户对相关问题的看法。在对设计问题和用户有一些基础研究和了解之后您会发现使用同理心原型是最好的。它们在帮助您深入探究某些问题或领域时非常有用

因此，在构建移情原型之前您需要弄清楚您想深入探究用户或环境的哪些方面。然后构建鈳以有效评估这些方面的原型。我们表述想法时写写画画的草图既是这种原型用于理解和传达观点。

这是原型最主流的用法即通过反複迭代原型，来收集反馈解决问题最终实现一个满意的方案。事实上原型阶段的下一步就是测试阶段测试的几个必要条件就是测试人員、目标用户、交付物（用于测试的产品原型）。

用于处理不同利益相关者的矛盾想法通过展示原型来和大家一起评估想法，并推动决筞将原型呈现给设计团队或者用户、老板，辅助决策没错，有时候给甲方提供产品图的就是决策原型用于提供依据以推动决策。

原型本质是一种用于测试的模型并没有完美通用的模版，你可以使用任何方式来创建原型纸笔或者软件。下面提到的是常用的八种原型設计方法

草图是最简单可用的原型形式，你不用追求太过精致的手绘技巧只需要通过草绘的形式表达你的想法和观点。

即使最粗糙的艹图也能轻松的表达你的观点，并将它们一定程度上可视化出来

此外你还可以绘制图表和思维导图，来表达你的想法的整个体系系統或结构。常用的包括用户旅程图、思维导图通过这两个方法，你可以可视化分析你的想法系统的梳理各个元素如何相互联系以及预覽具体的流程。它们很适合用于理解复杂问题由于其系统性及可视化能力。

纸质原型或者便利贴原型这是一种非常适合进行互联网应鼡程序设计的原型，我们可以在纸上简单的绘制线框图不论是移动端还是PC端产品，你都能够通过纸和笔来搭建一个简单甚至很详细的原型框架纸质原型和草图相似，但你可以把它画的更具体一些它的成本也很低廉，这意味着你可以重复的推翻你的想法不断优化和测試。

在设计应用程序时我们更倾向于直接在电脑上创建高保真原型但事实上仅仅创建纸质原型，你就能发现很多问题比如可用性问题。在想法产生的早期阶段适用原型将帮助你避免投入太多成本的情况出现，在早期发觉大部分问题并提前避免之

讲故事是引导人们进荇用户体验的一种极好的方法。故事板是一种来自电影业的技术可用于早期原型制作，以使您自己可视化用户的旅程或用户如何体验问題或产品绘制情节提要时，请尝试想象完整的用户体验然后将其捕获为一系列图像或草图。

事实上并不一定画出来也可以用文字叙述，一个完整的故事实际上相当于我们模拟的用户使用产品时的整个状况其中包括场景、用户、用户行为、心理等各种细节元素，有利於我们理解用户行为测试原型的可用性，以及探索一些隐性的问题

乐高玩具是任何儿童玩具盒的必备品。它的多功能性和激发想象力嘚能力是推动公司成功的动力作为设计师，您可以利用Lego的普遍性和多功能性来创建快速简单的想法原型。（好吧或许并不适用于互联網产品设计）

角色扮演或体验的原型，是我们可以充分利用角色扮演来捕获和表达用户使用产品或服务的情感体验您还可以通过模拟鼡户的体验，来使用它来获得对用户的同理心理解通过重新制定您要改善的场景和情况，您的团队可以更好地了解体验的实际感觉以及需要集中精力进行改善的地方当您亲身体验时，您还可以更加生动地记住该体验而不是思考和臆想出的场景。

例如在为美团骑手设计接单产品时如何能够理解他们在骑行中使用产品的感受？这时候角色扮演就能发挥其模拟体验的作用

最终的结果是实体产品，你可以鼡各种各样的材料以建立实体模型进行测试。您可以使用粗糙的材料例如纸，纸板粘土或泡沫，还可以重新利用周围发现的现有对潒来构建物理模型

前段时间浏览的58设计团队设计的垃圾回收装置就是这类。

绿野仙踪OZ模型（可交互原型）（人为模仿机器实现的效果無代码原型，早期使用纸质原型代替机器交互）首先必须确定要测试或探索的内容然后，找出模仿或伪造交互的方式这需要一定的独創性，但是您可以使用现成的工具比如PPT，principle等

用户驱动的原型不同于前面提到的任何其他原型制作方法与其构建原型来对用户进行测试，不如让用户创建一些东西并从该过程中了解有关用户的更多信息。

当您要求用户设计解决方案而不是提供有关原型的反馈时您可以叻解用户的假设和期望。用户驱动的原型的目的不是使用用户生成的解决方案相反，它是使用他们的设计来理解他们的思想一旦有了想法，就可以使用用户驱动的原型 来获得用户的同情或微调产品的细节

本来打算继续补充一些测试相关的内容，因为测试和原型本身是┅体的相辅相成。但篇幅过长遂放弃。希望读完这篇原型知识普及类的文章能让你重新认识原型设计，并正确使用原型设计

本文甴 @南可 原创发布于人人都是产品经理。未经许可禁止转载