原型设计工具调查报告

原型设计工具调查报告

一、        什么是原型设计

        原型是一种让用户提前体验产品、交流设计构想、展示复杂系统的方式。就本质而言，原型是一种沟通工具。[Nauman 1982]认为：“原型是一个系统，它内化了一个更迟系统的本质特征。原型系统通常被构造为不完整的系统，以在将来进行改进、补充或替代。”

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

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

二、        原型设计流程

步骤一：画草图

       画草图的目标是提炼想法，并且最好给画草图加上一个时间限制，那就是15分钟。画草图要避免陷入审美细节，尽可能快速的导出想法才是关键。

步骤二：演示及评论

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

步骤三：做原型

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

步骤四：测试

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

三、原型设计工具

3.1原型设计工具选择

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

• 熟悉程度和获得工具的便利度；
• 所需的时间和精力；
• 可复用的代码/框架；
• 为测试创建可用的原型；
• 价格和学习曲线。

3.2原型工具调查结果

1、墨刀

       墨刀是一款高效的在线原型设计工具，支持移动端、Web端及网页端的产品原型设计。无需下载，通过浏览器即可操作，同时支持软件下载，随时随地进行设计与模拟。学习难度低，自带的强大素材库和简洁的设计界面，可帮助快速构建产品原型。

价格：个人版免费；企业版可免费使用5天。

功能亮点：

• 集合4款工具，原型、设计、流程图、思维导图，全面覆盖产设研团队
• 丰富强大的素材广场，涵盖了最全最新的原型图、流程图、图标、项目等素材
• 简单高效的自动标注，轻松解决设计与开发的沟通难题
• 方便快捷的PRD模式，轻松展示产品需求
•  可同步Sketch、Axure文件，一键即可导入文件进行再编辑创作
• 支持导出为apk文件，模拟真实使用效果
• 支持云端保存与实时手机预览
•  支持多人团队在线协作，实时同步更新

使用场景：线框图、移动端原型、视觉稿、高保真原型、大型复杂项目、Web线框图、网页原型

 

 

2、Figma

        Figma是一款在线设计协作平台，支持团队协作并实时同步，能够无缝衔接产品、设计与研发。无需下载，打开浏览器即可使用，同时也提供桌面端。但是缺点是没有中文版，由于服务器在国外所以国内使用起来加载很慢，另外Figma主打设计，原型交互这块比较基础。

价格：个人免费。

功能亮点：

• 支持多人团队在线协作
• 矢量工具很好用，如钢笔工具、布尔运算、扇形工具等
• Auto Layout功能能够帮助设计师提升效率
• 有很多插件可以使用

使用场景：平面设计、图形设计、视觉稿、网页原型

3、Moqups

       Moqups是一款在线设计平台，基于Web架构，支持在网页端进行原型设计，能够轻松管理设计规范和资源。上手快，可实现团队成员间协作的无缝链接，减少沟通成本。但是这款无法进行平面设计，没有矢量工具。

价格：一个项目免费（限制200个objects和5MB内存）

功能亮点：

• 支持页面交互、命令交互、状态交互等多种交互触发方式
• 可直接绘制流程图，直观展现产品逻辑
• 支持多人团队在线协作

使用场景：高保真原型、线框图、 移动端原型

4、Axure RP

      Axure RP是一款专业的快速原型设计工具，拥有强大的组件库，可快速完成产品或Web线框图、流程图及原型设计，需要下载电脑端软件使用，支持Window、Mac OS系统。但过于专业庞大的软件功能架构，对新手要求较高，需要花费较多时间在学习上。

价格：免费试用30天。

功能亮点：

• 支持动态面板和复用模板
• 支持HTML原型预览
• 支持生成规格说明文档
• 拥有无限画布的设计区域，便于添加文字解析
• 支持多人团队协作

使用场景：高保真原型、Web线框图、视觉稿、网页原型、大型复杂项目

 

 

5、Proto.io

       Proto.io是一个基于浏览器的原型设计工具，无需安装即可使用。有丰富的原型组件，能够实现多种交互效果，预览、分享、评论这些基础功能也都有。

价格：15天免费。

功能亮点：

• 很多现成的组件和模板资源，拖拽即可使用，非常方便
• 能够实现多种交互，包括页面交互、高级动画、各种事件手势等
• 文件储存在云端，可跨平台访问，也可以支持评论协作
• 使用场景：高保真原型、Web线框图、网页原型

6、Balsamiq

       Balsamiq是一款可快速绘制原型草图的原型图绘制工具。就像是用笔和纸绘制，界面简洁，上手快，适合低保真原型这种需要快速产出的产品原型。

价格：免费试用30天。

 

功能亮点：

• 手绘风格，简洁美观
• 支持UI控件自动拖拽与自动对齐
• 拥有独特且多样的元素库
• 支持跨平台使用（Windows、Mac OS、Linux）
• 可使用XML语言保存元素，保存为PNG文件

使用场景：低保真原型、网页原型

 

 

3.3旅游APP原型设计实例

       Guides是一款旅行类App，这款App本身的颜色并不多，重点是要突出各个旅游景点的图片，所以这类App讲究后期对图片质量的把控，特别是图片占比较大的页面。在原型设计上，主要还是注意交互友好、对景点的介绍全面以及搜索方便等。

 

 

       原型设计软件是将产品需求进行可视化的工具，根据实际需求，选择最适合自己的一款原型产品设计软件，才能够在工作中最大程度降低设计时间成本与后续沟通成本，支持你更好地完成原型设计，腾出更多精力投入到后续的产品需求完善与产品迭代中。

 

标签：调查报告,支持,原型,框图,设计,工具,交互
来源： https://www.cnblogs.com/shou-zjl/p/16216802.html