原型设计文档模板（原型设计文档模板下载）

本篇文章给大家谈谈原型设计文档模板，以及原型设计文档模板下载对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、常用快速原型设计工具大比拼，原型设计工具哪个好用
• 2、原型设计的介绍
• 3、如何利用Edraw Max设计软件的Windows7 UI原型图
• 4、（转载）怎么用原型写PRD文档

常用快速原型设计工具大比拼，原型设计工具哪个好用

经过数年设计原型的经历，我尝试过很多原型设计工具，希望能够找到最有效率的原型设计工具。接下来，我来分享一些我用过的原型设计工具以及他们的优缺点！

Axure：发展较早的一款原型设计软件，因而名声较大。无限画布，适合做低保真到中保真度的原型。功能很多，也让学习起来有点难度，网上有很多axure教程就不多说了。本地型软件，可以下载html文档预览，手机预览不方便。

墨刀：国产的一款原型设计协作工具，比起axure来非常容易学会，内置组件很多，创建页面跳转也比axure简单太多。因为是一款在线工具，可以云端保存工作，这点确实很便捷。另外，通过分享链接就可以分享原型给别人看了，如果涉及到跟同事对接什么的，选择在线的工具更方便。支持sketch文稿导入和自动标注。个人认为性价比最高。

Invision: 可以说目前是国外发展最大的在线原型设计工具，主打“交互原型”和“协作”，支持sketch和ps设计稿导入做交互。近来出的 Invision studio 对标sketch，想满足更惊喜的设计需要。国外一些大牛公司像airbnb和amazon都在用。不过对于国内用户来说会有服务器速度的问题，而且，贵。（土豪公司无视）

Marvel: Marvel 也是海外知名度较高的一款原型设计协作工具，支持PS和sketch设计稿导入做交互原型，本身也支持中度保真程度的设计。也有自动标注功能。图片库对接unsplash，这样来自unsplash的很多精美的免费图片可以直接用。价格比Invision稍便宜。

Proto.io：也是国外的一款手机原型开发平台。支持在大多数的浏览器运行，共享和协作操作方便，可以直接在真实的移动设备上对原型进行测试。拥有较为丰富的UI组件，支持自定义。另外它有不错的用户测试功能，支持视频录制。并且在移动组件时，能够实时在画布看到组件之间的距离。另外由于服务器的原因，有国内用户反应速度有点慢；收费较高，性价比一般吧。

UXPin：UXPin是DeSmart团队开发的一个在线可点击原型设计工具该软件，拥有大量用户界面元素（包括web，iOS，Android等），可以共享预览，注解和实时的协同编辑。另外该软件还提供了版本控制和迭代功能。缺点仍然在于国外服务器和价格问题。

原型设计工具各有各自的优缺点，找到适合自己设计的原型设计工具很重要！希望大家早日上手适合自己的原型设计工具。

原型设计的介绍

我们首先明确两个定义：

原型的定义：

用线条、图形描绘出的产品框架，也称线框图。

交互设计的结果输出，可能是一张纸上的几张图；原型代表着交互设计的结果，当最终实现的时候，交互流程会和原型保持一致；可以理解为草稿或者叫做参照物

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

原型设计的定义：

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

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

其次，了解原型设计的作用，主要有两点：

沟通： 因为是原型是需求和功能的具象化表达，所以原型可以辅助产品经理与领导、交互、UI和技术的沟通产品思路。虽然需求文档也是可以满足沟通需求的，通过用例将交互写到设计描述文档中，但是原型可以更详细地解释交互。

测试：因为原型相较于UI稿来说修改更方便，所以原型能提高产品经理的功能设计没通过评审时返工的工作效率。没有哪一家互联网公司可以不经过测试，就直接上产品和服务。原型在识别问题、减少风险、节省成本等方面有着不可替代的价值。

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

设计流程：首先明确产出原型目的以及用户群体，这个原型有多大效率帮助我传达设计或测试设计？ 有多少时间做原型？其次需要什么级别的保真程度？

目前比较好用的在线原型设计工具有Marvel，Invision，墨刀等等。

希望对你帮助~

有任何疑问可以追问，满意请采纳，谢谢~

如何利用Edraw Max设计软件的Windows7 UI原型图

1、Axure RP（Rapid Prototyping）

Axure（读音为Ack-Sure）无疑是目前最受关注的原型开发工具，其能通过组件的方式帮助网站或软件设计师快速建立带有注释的原型（流程图、线框图），并凭借自定义可重用的元件、动态面板以及丰富的script能够建立基本功能或页面逻辑的动态演示文件。

Axure借鉴了office的界面，能够让用户快速上手，并且提供了丰富的组件样式修改，使得通过其能够创建低保真、高保真甚至接近于实际效果的界面。然而最让人称道的是，Axure的丰富的脚本模式，可以通过点击和选择能够快速完成界面元素的交互，如链接、state切换、动态变化等效果，使得Axure能够生成十分接近于真实产品的原型。另一方面，Axure能够导入其他人创建的元件库，使得Axure能够满足绝大多数类型产品的设计。

但Axure仍然有一个让人头痛的问题：对于中文的支持不太友好。在小部分元件上输入中午的时候，经常需要像碰运气似的反复切换输入法，破坏了咱们设计师的用户体验。

瑕不掩瑜，Axure仍然是交互设计师的首选原型工具。

2、Microsoft Office Visio

Visio在2000年被微软收购，并在2002年成为office2003套件中的一个组件，最新版本是2007。Visio能够获得推荐的原因是因为Visio的适用性非常之广，从网站界面、数据库模型，到平面布置图到工艺流程图，Visio都提供了相应的元件库和模板来进行快速创建。

相较Axure而言，Visio更适合于传统行业的生产或流程设计，或者软件及互联网行业中的信息、数据和流程的说明，而不太适用于web界面。因为其的基于web的元件库还是比较少，并且形式和结构也更类似于word中的图形工具，因此在原型开发效率上都有所不足。

3、Balsamiq Mockups

这个基于Adobe AIR Runtime的工具实在是有让人眼前一亮的感觉，手绘风格的元件样式粗犷淋漓，能创建接近于纸上手绘的原型文件。其提供了丰富的手绘风格的web常用元件，包括常用的html控件、以及一些组合控件，如多媒体控制器、标签页、列表、Iphone界面元件等。

Mockups最值得赞赏之处在于其提供的多数组件都可定制外观，对于中文的支持也不错（选择View Use System Fonts）。

4、Mockflow

Mockflow和以上工具最大的不同在于Mockflow是一项基于Adobe Flex技术开发在线服务，提供了与Balsamiq Mockups基本相似的功能，甚至更丰富的组件，虽然其元件定制化不够强大，但其提供的元件库默认样式却非常适合用来做商业产品原型的搭建。有一个让我爱不释手的功能是模板，可以设置基于任何页面的模板来进行新的页面设计。

与其他模板工具相比，mockflow有一个非常特色的功能，基于web的存储可以在任意电脑上联机打开，同时可以其他人进行快速的分享，并收集在线反馈意见，非常适合虚拟团队的原型设计交流。

虽然在线服务的基本帐号只能创建一个文件，但单个文件却没有限制页数，因此也基本上足够使用。

5、Pencil sketch

Pencil 是一款基于Firefox的扩展组件，安装之后即可在Firefox的工具菜单中打开Pencil的绘图面板。功能比较简单，仅能用以日常简单工作的辅助 说明。提供的默认元件都是基于软件工程，因此更适合用于windows桌面程序的简易界面搭建，或者是基本的页面功能说明，并不适用于严肃的原型开发，但 好在体积小、又轻便，能够方便将网页中的元素直接拖到或者复制到当前的画布中，这也是Pencil安装在Firefox所带来的便利之一吧。

更多工具...

在以上列举的原型开发工具都是较为常用的，也是在国内的交互设计师们比较常讨论的，但其实和Axure功能相似的软件还有很多，下面也就一些简单说明：

6、GUI Design Studio

这 是一款真的非常强大的原型制作工具，没有在上面推荐的原因是因为我还没有实际体验过，但冲着这工程级的界面设计就没有去尝试的冲动，但是从官方网站的截图 和视频演示来看，这款软件的操作模式和前面的原型工具大有不同。Axure之类多是基于页面的原型设计，对于web网站尽管很实用，但是对于软件界面的流 程设计却略显繁琐。而GUI Design Studio却另辟蹊径，直接以建立元素与元素之间的关联的方式来自动化的创建动作流程，而从视频演示来看，这样的确很大程度上提升了软件界面原型搭建的 效率。

7、Prototype Composer

Serena 公司提供的原型开发工具，功能确实强大，提供了基于项目管理主要流程的产出物文档模板、原型工具以及开发流程控制，这个软件的开发理念非常好，用这一 款工具来满足项目开发流程中各个环节的沟通和决策。但软件的学习和使用成本比较高，要了解其中的全部功能，貌似需要花不少时间。另外软件的效率和稳定性还 有待提高，试用的过程中多次出错及停止响应。

8、Lucid Spec

由 Elegance科技推出的Lucid Spec是一款很类似Pencil的原型工具，仅仅是提供了更多控件。不过Lucid Spec强调了生成干净的说明文档的功能，这可能是针对于多数原型工具的自动化生成规范的冗余而言的，不过老实说Lucid Spec提供的原型界面太过简陋，并且生成的说明文档也未见优化有怎样的提升。视频介绍

9、Irise Professional Edition

Irise与其他原型工具相比其中一个特色在于提供了样本数据的功能，这是类似于excel表的一个样本数据库，可以通过界面元素直接获取样本数据库中的数据，这样所生成的原型甚至可以使动态数据更新的。

10、Adobe Reader

Adobe reader？没错。其实理论上任何可以创建图形和文本的工具都可以用来原型开发，因为原型本身就是对于业务逻辑和功能界面的模拟或仿真，因此有何理由不能使用PDF格式呢？BoxandArrow的这篇文章《PDF Prototype》提醒了我们，所有的原型工具都只是工具，而不是设计本身。

另外这里的也可参考一下

但个人推荐:

原型

• Axure 7.0

• UIDesigner

思维

• Mindmanager

• Xmind

流程

• Visio 2013

• EDraw Max

知识

• 有道云笔记

• 印象笔记

时间

• Todolist

• Worktile

图形

• Photoshop

• Colorpix

交互

• 快现

• UIDesiger

（转载）怎么用原型写PRD文档

写在前面

需要说明的是，其实只制作PRD是很扯淡的，一个产品的诞生是由其核心需求和商业目标所驱动的，那么我这里做出来的东西其实是抛开了商业战略来假想的，但是核心需求是明确的，在做的过程中你能体会到一个产品经理所需要做的很多工作，我分享的就是这个过程。做它的过程和一个产品的诞生大概相同，这里我想引用《用户体验的要素》里面提到了五个框架来说明：战略层、范围层、结构层、框架层、表现层。

阶段一：确定需求（战略层）

这里涉及到战略层面的东西，确定核心需求就是致力于改善用户生活中密码繁多且容易忘记的问题。核心用户是商务人群和中老年人群，商业目标的话我也想了很多，但是目前还没有特别好的想法，也欢迎大家脑洞大开，提供一些好的想法。

阶段二：确定做什么（范围层）

我首先考虑的是为了实现核心需求需要做什么。目前v1.0的产品还比较简单，功能比较单一，但是基本功能需求肯定是能满足的。在此基础上，根据功能需求确定功能框架

阶段三：确定怎么做（结构层）

这里要根据上一阶段的功能构架，确定产品的逻辑流程、产品结构、信息结构等。实现每一个小的功能点，都要进行逻辑设计，想清楚其中的逻辑，对应的画出流程图。

其实我个人很不喜欢这种纯粹的流程图，你要表达的意思别人通过这种形式的流程图很难理解，这里提倡的是有原型的流程图，所以我后来又重新设计了一张总的逻辑流程图，然后把一个比较繁琐的流程也重新设计成了这种形式。

在逻辑流程设计好之后，我进行的是产品信息构架设计，确定为了实现功能需求需要哪些信息作为支撑。

接下来是产品结构设计，这个把结构框架用脑图画出来，为原型设计打好基础。

阶段四：原型设计（框架层）

开始原型设计吧！我的方法是首先在笔记本上用笔绘制草图，然后确定界面的元素哪些是必需的，原因是什么，放弃这个元素可不可以，经过反复推敲，确定了就大胆开始设计吧！还有一点是我在每个原型图下面都绘制了相同一幅图进行标注说明，进行必要的界面解释。另外我在《Word产品需求文档，已经过时了》这篇文章中受到启发，加入了漂亮的导航设计，多谢作者臻龙~

下面给大家展示几个有代表性的界面

版本说明：

全局说明：

控件说明：

网络库登陆界面：

修改密码：

安全设置：

首页：

搜索：

我的收藏：

模板选择：

我的资料：

设置：

会员：

密码详情：

密码编辑：

写在后面：

需要查看产品需求文档的，猛戳这里，这个PRD完全使用axure制作，没有用传统的word方式，历时2个月完成制作。到现在，我觉得在转行产品的同学，也可以尝试着做一下这个事情，对你会有很大的提升，也是你找工作的一个重要筹码。

原型设计文档模板的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于原型设计文档模板下载、原型设计文档模板的信息别忘了在本站进行查找喔。