一、产品原型的认知

从早期接触互联网产品相关工作，最初在需求传递的整个流程中，我们将想法页面上形成草图，表现形式上看到的是一系列由图片占位符、文字、线框、按钮等元件组成作为一个静态页面呈现。随着需求传递过程中沟通成本的提升，需求细节的严谨性、在与UI/UE的沟通中，需要对表现层之下按钮、布局、交互和元素的位置，进行优化设计布局，以达到这些元素在页面上的最佳体验效果，让用户在需要的时候，用户如何到达某个页面能快速找到所需位置，并且在他们在当前页面完成任务后，快速给出反馈和需要去的下一个页面这是产品需要思考的路径。

（原型草图示意图1.1）

面对与前端/后端/测试等开发人员进行需求传递时，不仅要在结构层确定各种功能特性还要考虑功能的范围边界，数据的流转形式如何体现，所以产品在设计构思时，不仅要表达出来的页面信息，而且其中抽象化的业务逻辑，需求可视化更加具体生动的表现出来，所以我觉得原型是PM，将文字化的需求转换成图形稿，其内在的数据流转、逻辑说明是原型方案的表达，不单是单产品功能与内容的示意图，为最终产品创建感知体验提前感知到最终产品的立体雏形，是团队的主线参考及评估的重要依据。 所以清晰易懂的产品原型不仅方便产品经理与UI设计师和开发人员在前期沟通产品思路，也可以更好地帮助美工和开发人员理解产品特性，使后续的开发设计更为顺畅。

 （页面跳转逻辑示意图1.2）

二、产品原型对产品经理工作的帮助

（1）产品原型是为最终产品形态提前创建感知

我们的项目在0-1阶段时，产品最小版本MVP是我们用最快、最简明的方式建立一个最小化可用的中低保真产品原型，测试产品是否符合市场预期，并通过快速迭代的方法来完善产品，看看用户对我们提供的产品价值的认可程度，以此最终适应匹配市场需求，所以此时我们的原型不仅是对产品的进行立项，更是整个产品战略的落地执行，从产品的界面样式，每个按钮的功能和效果，也可以看到产品的基本框架和运作机制，获得比较真实的感受、团队从而能捋清要做的事情和目标及最终要实现的结果有清晰的认知，通过完整的原型需求演示才能对受众目标的用户/客户需求加以理解，把他们的真实地反应、反馈收集起来，最终来得到市场上的验证结果，因此原型的目的使得需求的价值是让团队目标清晰，可制定合理计划，达到落地执行动作。

（2）产品原型可减少多方沟通成本

产品原型面对需求的传递要做到严谨性，与UI的沟通是一种体现产品设计想法的可视页面，就和建筑设计图类似，看着建筑设计图，才明白你的想法，产品原型以用户界面为基础，所有布局基本已经到位，缺少的只是色彩的搭配、icon的设计、视觉效果的设计，原型此时可以为ui设计师、视觉设计师创造良好的设计条件，设计师们根据原型图就能够更快地设计出适合用户浏览和使用的版本，避免了设计师去想像布局结构，节省了大量时间。与开发人员需求沟通也一样，其中发现往往很难有耐心仔细看需求文档的人很少，他们会更喜欢“动态”的原型图；对于PM来说，为了理顺自己的思路，思考需求的合理性，最好的校验工具就是画原型图，无论是静态还是可点击的交互，视觉效果和内容上更接近真实用户使用场景，才能减少双方的认知理解偏差，提前根据页面逻辑搭建表结构，节省开发成本一个好产品需要团队成员们都在顺畅的沟通交流下，才能得到好结果。

（3）清晰的认知和验证

工作中我们大多数接收到一个个不同需求方分散的需求点，我们需要考虑多方角色的使用场景，什么样的场景下，带着什么样的目标、采取什么样的动作、和某些介质交互来完成什么任务，梳理清楚场景，才能基于同理心把以用户为中心的理念贯穿在整个产品思考的过程，这样才能形成业务闭环，这时就可以通过原型图来展示页面的流程，直观的看到成品清晰完整的形态，达到业务闭环类价值或体验类价值。

同时接收到需求后，针对没有了解需求的真实性，从不确定的需求来进行深挖背后业务方的痛点，而通过原型图展示完整的业务闭环，梳理清楚业务方使用场景及需求能带来的价值和解决的问题，才能对需求挖掘和分析产生结果，也恰恰是制作原型的目的来进行验证该需求的可行性。

三、如何运用好原型工具

首先在运用工具时，如果我们面对的是B端客户，更注重的是业务流程、清晰的数据逻辑流转，页面的交互更注重细节，需要中高保真的原型，时常去与客户演示。如果是是C端产品，大部分团队中都会有专门UI同学，我们产出的原型就不需要太过于高保真，完成一份比较完善的线框图即可。

（1）合理的进行元素布局

当我们在设计一个页面的时候，必然具备大量的元素在页面呈现，我们要认真的去检查细节、梳理页面的元素布局 内容展示、框架细节等

页面顶部：搜索框、定位、扫码登陆

页面中上方：全部tab名称

页面中下方：商品名称、购物车、商品价格、更多、商品图片 、描述、更多等

大部分元素都是可点击的状态，我们要考虑所有元素的交互效果比如：

点击是否可以跳转，跳转到什么页面

点击后是弹框展示还是新页面。

点击后元素样式状态是否改变。

什么状态下的元素不可点击

元素是否需要配置埋点，方便日后统计埋点数据。

（2）组件运用要规范

a.原型图模块背景或元素尽量采用黑白灰色值，避免给UI设计师造成用色干扰。

b.当多人协作时定义好统一的协作原型内容样式

c.页面中重点凸显的内容，按钮或某个模块采用深色块填充

例如网易云和波点音乐我们从中可以看到，只有在页面上保证界面元素的统一性、视觉风格及交互样式的统一性，才能为用户提供连贯一致的用户体验，突出产品品牌为用户带来的归属感、也可让客户其操作有可预见性。

最后，我们反向思考下如果没有原型工具，没有完整的表达语言的工具，我们作为一个个鲜活产品的思考者，没有输出完整的产品思考，那么这些都是空中楼阁没有落地的痕迹，对于执行者都是忘记性很强的动物，和开发人员评审后过了一段间再去看需求的细节都会变得模糊，所以中间产物的价值不高且很容易被忘记。

产品原型只有合理的利用好才能发挥它的价值，他就像我们产品人行走江湖的兵器，好好打磨兵器，对我们来说有一件的称心如意的且锋利兵器一定可以事半功倍。其次产品原型不仅作为一种交流工具，可以弥补设计师与受众之间的鸿沟，同时也验证概念是否与最终客户和企业发展中是匹配的是可以经得起考验的，所以对于产品经理不仅仅是画原型这样的简单事情，它是产品经理工作量和工作成果的唯一证明，是我们的建立团队认知、需求传递的沟通桥梁、成果目标的导向，运用好我们的利器才能更好的推动我们的工作从而产生重要的成果。

原型设计只是成功的途径之一，要始终牢记目标、受众和提供的价值。

推荐两款原型设计工具：

1、AXURE RP

2、摹客RP

Powered by Froala Editor