最近在5G冲浪的时候，经常接触到这样的问题，比如“我该不该画一个高保真的原型？”以及“有必要把原型做成演示形式吗？”"产品经理画原型而不是PRD合适吗？"

当然不合适！Emmmmm私底下觉得这些想法可能还是有些缺陷的！

原型画的目的是什么？

尤其是对于很多PM孟新来说，这样的内容可能在大家刚开始了解这个东西的时候会给大家带来一些麻烦，所以一开始也不确定自己需要产生什么样的结果。

比如我在实习的时候，因为看了很多高保真的案例，所以尝试画出了同样的高保真原型。但是现在回想起来，觉得自己在页面和交互的实现上花了太多时间，却忽略了产品本身的业务需求和功能逻辑。

为了证明这一点，我忍不住翻开尘封多年的教科书。

我们来看看专业课本上都是怎么说的:

快速原型建模的第一步是快速构建一个能够反映用户主要需求的原型。然后提供给用户。用户在试用原型后会提出很多修改意见，开发者会根据用户提出的意见快速修改原型系统。然后交给用户。只有重复上述过程，直到用户认为原型系统能够满足他们的需求，开发人员才会根据原型系统编写需求规格说明书。

所以按照这个需求规格说明，开发的软件应该能够满足用户的真实需求。至于开发出来的原型，因为原型的目的是了解用户的真实需求，一旦确定了需求，原型就会被放弃。因此，原型系统的内部结构并不重要。重要的是，原型必须快速建立，然后根据用户的意见快速修改。

所以，亲爱的新PM，其实你可以把产品原型理解为一个确定需求的工具。使用这个需求工具的目的就是通过这种快速迭代的方式对产品的需求进行深度挖掘和筛选，从而得到一个需求确定的规范。

那么我们可以说，绘制原型最重要的原则就是:快速&清晰！

如何快速做出原型图

首先，使用最合适的工具

在确定工具的时候，一定要明确原型本身的使用场景，这样才能保证做出最准确的选择！在我看来，原型的两个基本部分是绘图和演示！

那么，请你和我一起在脑海里默念霍老师说过的一句话:“天下武功皆牢不可破，唯快不破！”也就是说，原型的两个基本部分可以展开为:快速绘图&方便演示！那么我们在找工具的时候一定要重点关注这两个方向。

所以我们今天要说的英雄可以玩:快速成型工具，山寨RP！

1、网上画图，随时可用。

只要是有浏览器和网络的电脑，都可以画出原型。不需要客户端，不需要像使用Axure一样寻找不同版本的安装包，不需要本地化和激活。打开官网，新建一个RP在线设计稿就可以了。

这种“云剪辑”的方式，会让大家更方便的去现场办公。随时随地打开电脑就能调整同步你的样机，帮你争做新一代音量王！要知道，你不滚，或者我不滚，项目就搁浅了！

好大的嘴:可以直接从自己常用的设备上下载客户端，操作更流畅。而且，在客户端对原型所做的更改在浏览器中是同步的，所以偶尔在不常见的设备上对原型进行更改也是相当方便的！

2、一键分享，随时观看

画出好的原型，分享和演示也很重要。尤其是有甲方爸爸的小可爱新PM，如果工具选择不正确，那么你将面临一次又一次的修改和发布。

毕竟甲方爸爸的原则一般是:我有意见，但不会一下子说完！

所以在原型审核迭代的整个过程中，会有很多小问题陆续被提出来，而使用copycat能给你最快的体验就是:在你更新了原型内容之后，演示内容也会同步更新，不需要导出压缩包，也不需要更新链接，这就帮你实现了春风和rain一样的无声修改。超级好看。

当然，对于那些在岛上断网度假的老板们，我们还是要通过下载离线试玩包的方式来分享，让一切回到最开始最简单的样子。

3.全功能解锁，永远免费。

对于PM孟新来说，我们很多人还在学校读书，很多人刚刚开始接触这个行业。所以，我们花钱买一个还没有变成生产力的工具，有点过分。

不过说实话，用山寨RP真的不花钱！

现在只要参与免费设计计划，就可以解锁copycat设计的所有功能，绘制原型也不会受到页数的限制。

第二，快速丰富画面

选好工具后，就可以开始鬼混了！

1.确定页面大小

这一步通常是使用Axure时的必要步骤。毕竟现在的PM大佬，谁没有发自内心的问一句“手机页面又有多大？”

但是，现在我们使用copycat新建项目时，可以根据需要直接选择项目页面的大小。

从上图我们可以看到，在copycat中，常见的手机、平板、Web的尺寸都已经预设好了，还有一个自定义的尺寸来满足一些非常规的要求。比如像我们公司的考妹，就作为TTP来报。我觉得挺滑的~

2.了解界面布局。

当我们打开一个新项目时，会有一个默认生成的首页。然而，这个时候，你已经迫不及待的开始画了。你还是要先熟悉我们的画板。了解了画板的布局，就能明白一个原型应该具备哪些必备的要素！

页面：用于创建、整理项目页面，以便更好的梳理产品使用逻辑；组件：构成页面的一些基本元素；属性：修改组件样式；图层：展示构成当前页面的组件；交互：帮助页面和组件实现跳转等逻辑。

3.构建页面内容。

至此，你可以为所欲为了~

找到你需要的组件并把它拖到它应该在的地方。就这样慢慢的用组件搭建页面，然后一个一个的搭建项目原型。

4、齐整收尾。

这里有一个基本的线框原型给大家。秀秀能对这样干净整洁的页面说“咩”？

所以不管什么时候，作为刚踏入PM圈的可爱新人们，不管是画原型还是画流程图，对齐平等分享才是我们应有的态度！(可能你的老板或者甲方是处女座~)

所以，请好好利用这里的工具！

另外一个小技巧:认认真真的建立辅助线，也可以帮助孟新大大提高画图速度~

第三，建立逻辑

1.页面逻辑

所谓页面逻辑和功能解构一样重要。而且通过页面之间的关系，可以清楚的了解用户对这个页面的访问深度。只有建立了良好的逻辑关系，才能在后续的展示和迭代中有更好的优化方向。

至于操作，也很简单。只需选择页面并拖动它。请看一看。

2.交互逻辑

其实交互是一个用于演示的功能，所以它的根本目标是让原型“动起来”，让看这个原型的人更直观的感受到组件(按钮)和页面的关系。其实在快速制作原型的时候，我们只需要保证基本的跳跃就可以了。

如何让原型清晰？

在原型绘制的整个过程中，我们可以通过演示功能来预览我们的原型。这一步不仅能决定我们页面的美观度，还能让自己反复体验交互链接，从而决定我们的产品逻辑是否清晰，体验是否流畅！

最后再bang一点，就是演示过程中可以随时查看链接区域~不然如果四个图标只有一个能点击链接，还需要让大家一个一个测试，太累人了~

好，好，就这样。最后，让我们回顾一下原型的两个基本部分:快速绘图&方便演示！

我们选择的工具:快速原型制作工具！画原型做设计，永远免费！