其他分享
首页 > 其他分享> > 原型设计工具调查报告

原型设计工具调查报告

作者:互联网

在软件开发的过程中,我们要将客户想法到落地设计出产品,往往都是由沟通到设计,再到收集客户反馈信息进行终稿敲定,整个过程对于时间耗费较大的往往在于沟通和修改。在传统设计模式上,通常需要设计人员与外界沟通,在吸收信息后,通过手绘草图,耗费大量的设计时间;而若要设计出产品原型,需要多款工具交替使用,然后传达至客户手中,再进行沟通修改细节,整个流程前后沟通不顺畅,无法一步到位直接将客户需求落地。那么此时我们就需要有一款工具,能让客户、业务、设计三位一体共同参与沟通,实现产品从创意到落地快速生成原型产品。以下将对当下几款常用的、功能强大的原型设计工具做简要的介绍。

  1. 墨刀

墨刀是一款在线原型设计与协同工具,借助墨刀,产品经理、设计师、开发、销售、运营及创业者等用户群体,能够搭建为产品原型,演示项目效果。墨刀同时也是协作平台,项目成员可以协作编辑、审阅,不管是产品想法展示,还是向客户收集产品反馈,向投资人进行Demo展示,或是在团队内部协作沟通、项目管理。

1.1  特点

1)其控件的拖拉、大小的调整,都会自然的去匹配相应的母版大小。无需去担心有多移动一点或多选择一点。并且系统控件都是基于APP,以及系统平台IOS和安卓,因此在里面可以首先选择相应的设备布局,减少了不少工作环节。

2)内置了很多移动端的素材库, 可以直接套用模板。墨刀推出了丰富的模板项目,可先预览模板效果,挑选成功后点击“创建项目”即可。 做原型的时候会方便很多,易用性也强很多。

3)墨刀的学习成本很低,掌握所有基础操作所需时间较短。

4)打开工作流便可看到全局状态和注释,实时同步进度和文档

1.2  使用方法

以下将通过制作一个简易的APP首页原型来初步了解墨刀的基本使用方法。

1.2.1   创建应用

选择新建原型项目,进入新建页面后,有IPhone、Ipad、网页、车载及apple watch等原型稿可供选择(这里选择了IPhone应用),输入应用名称后,设置设备类型和应用尺寸,点击创建按钮,完成应用创建。

 

1.2.2   制作底部导航栏

新建应用的标题栏会自动显示应用的名称(人人都是产品经理),标题栏文字可以自行修改。从左侧“组件栏”中找到底部组件,拖入到应用中,大小和样式可以自行根据需要修改。然后拖入三个导航标签,修改标签的位置和名称,完成底部导航栏的制作。

 

1.2.3   制作原型页面

在左侧的“组件栏”中找到搜索组件,拖入App首页中,在“母版”栏目中找到轮播图模版,拖入应用之中。墨刀中有一些已经做好的组件或母版,可直接拖入使用,加快创建原型的时间。

 

回到“组件栏”,为首页插入图片和文字。图片调节在右边的设置栏,也可直接拖入图片,然后用鼠标调节大小,这样会比较方便。文字的调节在左边的主题栏目,可调节文字的大小和样式,然后用鼠标摆至合适的位置。

 

1.2.4   创建页面

在软件右上角点击“+新页面”即可生成新的页面,每一个页面有复制、删除、添加子页面的功能。在新的页面中添加标题栏,复制首页的底部导航,粘贴至新的页面。按如此方式制作“发现”页面和“我的”页面。

 

1.2.5   页面跳转

墨刀有一个非常有特点的功能,就是通过连线的方式进行页面之间的跳转,在应用中选择任何一个控件,图片或者文字都可以通过添加手势和页面切换方式实现页面跳转。优点在于操作方便,且比较直观。缺点是如果页面复杂,跳转比较多,会有非常多交叉在一起的线,容易连接出错。

 

1.2.6   添加全局手势

在左侧“组件栏”找到全局手势组件,拖入至应用的任意位置,然后选择要发动手势后跳转的页面,选择手势方式和动画效果即可。

 

1.3  软件不足之处

1)交互效果有限。

2)效果切换采用的是连线的方式,容易给使用者造成错乱的感觉,影响设计时的体验。

3)如果要使用更强大的共享创建功能还需要付费购买。

  1. Axure

Axure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专业的原型设计工具,它能快速、高效的创建原型,同时支持多人协作设计和版本控制管理。

原型设计中复杂的交互设计是它的强项,同时提供高保真与低保真两种设计效果,拥有良好的文档支持,自带实用的流程图功能,插件库可以定制特殊的行为。它的团队版和企业版还提供了团队协作功能,主要包括团队协作和在线评论,设计师还能使用Axure创建和托管团队项目。

2.1  特点

1)有强大的编辑功能, 使得制作素材库会更便捷一点。

2)更快的复制粘贴,素材库和原型库会多一些。

3)可以项目共享,使得同事间可以同步工作,并保留所有工作历史,并可以随时到处历史版本的项目文档。

2.2  使用方法

以下将简要介绍Axure的界面布局,并通过实现一个简单的案例来初步了解Axure的使用方法。

2.2.1   主页面

 

2.2.2   菜单栏

 

其中,经常使用的菜单功能有:

1)文件-导出图片:当前打开页面对应的单张图片、所有页面。

2)编辑-快捷键:保存、撤销。

3)视图-重置视图:当关闭某个窗口,可通过此次菜单快速恢复窗口视图。

4)布局-组合、对齐、分布,在工具栏也有快速按钮,包含shift键多选元件、组合后右键或者概要中进行重命名。

5)布局-显示网格和对齐辅助线。

6)发布-预览、预览选项、生成HTML文件,在工具栏也有快速按钮。

2.2.3   工具栏

 

这里是平常我们使用Axure需要的工具,其实跟我们平时用word差不多,可以放大缩小,设置文字大小颜色位置等。

2.2.4   登录页面设计

在元件库中,拖动文本框控件。

 

双击文本框,即可输入提示,并从元件库中选择按钮拖入页面编辑区域。

 

 

2.2.5   首页设计

与上相同的操作,在元件库中选择合适的元件拖入页面编辑区域。

 

2.2.6   添加登录动作

选中登录按钮,在右侧新增交互,实现点击“登录”按钮,页面会跳转到首页。

 

选择交互事件,这里选择“单击”。

 

再选择打开链接

 

最后再选择链接到首页,这样便完成了点击按钮跳转功能。

 

2.2.7   添加退出动作

操作流程同上,选中首页的“退出“按钮,新增”单击“链接跳转交互即可。至此,一个简单的登录功能原型就设计完备了,里面涵盖了Axure的基本操作。

2.3  软件不足之处

1)动态面板和中继器较为复杂,要完全弄懂也需要一定的时间成本。

2)Axure只支持在本地设计。

3)添加用例,不能拖拽完成:对于一般的交互,在Axure中可以通过弹窗来逐个筛选设置。稍微复杂的交互,则需要条件构建器来实现。Axure在交互设置中,可以添加条件判断,但需要用户有一定的编程常识,否则掌握起来有相当难度。尤其是初次使用的时候。

4)正版的Axure售价较高。

标签:墨刀,调查报告,原型,跳转,设计,工具,Axure,页面
来源: https://www.cnblogs.com/pzl-666/p/16253136.html