一.原型简介
在做工业产品设计时设计师会建立一系列的模型来对设计进行一系列测试。而原型(prototype)则相当于数字产品的模型,也可以叫产品的demo版。按照保真程度分,原型可以笼统地分为低保真原型和高保真原型。
任何低保真原型都具有以下特点:
- 在早期检测和修复主要问题
- 构建起来容易、成本低
- 让人更有迭代的动力和意愿
- 得出的反馈侧重于高层次的概念而不是执行
- 易于携带,展开测试活动
且低保真原型又可以有以下这些形式:
- Sketch(草图):快速表达概念。
- Storyboard(故事板):视觉化表现产品如何工作。
- Paper Prototype(纸面原型):将页面画在一张张纸上用作演示。
- Wireframe(线框图):视觉化呈现一个个独立页面及交互逻辑。
除此之外,常见的原型还有:纸面原型,线框图和可交互原型
在设计原型之前我们需要明确几点:为什么做这个原型;为什么平台做设计;做什么类型的设计;有多少时间来完成原型设计;要展示多少产品体验。搞清楚这些问题可以帮助我们选定适合做本次原型设计的工具。挑选合适的原型设计工具不仅能优化我们的设计体验还能提高工作效率。例如假如本次原型设计需要追求一定速度的话,可以用Marvel,InVision,Principle和墨刀。假如要追求保真度的话则可以使用Origami,Webflow和Framer。下文将重点介绍Axure和墨刀这两个原型设计工具并深入对比它们。
二.Axure和墨刀的介绍与对比
Axure RP
Axure RP是美国Axure Software Solution公司的旗舰产品,是一个专业的快速产品原型工具。其主要用于WEB界面,APP界面,软件界面产品的交互原型设计。它能让负责定义需求和规格、设计功能和界面的设计师能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为一款专业的原型工具,它能快速、高效的创建原型,同时支持多人协作设计和版本控制管理。以下是一些关于Axure RP的特性:
价格:
使用环境:
1、主菜单和工具栏:执行常用操作,如文件打开、保存文件,格式化控件,自动生成原型和规格说明书等操作;
2、站点地图面板:对所设计的页面(包括线框图和流程图)进行添加、删除、重命名和组织页面层次;
3、控件面板:该面版包含线框图控件和流程图控件,另外,你还可以载入已有的部件库(*.rplib文件)创建自己的部件库;
4、模块面板:一种可以复用的特殊页面,在该面板中可进行模块的添加、删除、重命名和组织模块分类层次;
5、线框图工作区:线框图工作区也叫页面工作区,线框图工作区是你进行原型设计的主要区域,在该区域中你可以设计线框图、流程图、自定义部件、模块;
6、页面属性:这里可以设置当前页面的样式,添加与该页面有关的注释,以及设置页面加载时触发的事件onpageload;
7、部件消息交互面板:这里可以设置部件在操作过程中的消息传递;
8、元件属性:这里可以设置选中元件的标签、样式,添加与该元件有关的注释,以及设置页面加载时触发的事件;
9、部件管理:在这里可以添加、删除动态面板的状态,以及状态的排序,也可以在这里设置动态面板的标签;当绘制原型动态面板被覆盖时,我们可以在这里通过点击选中相应的动态面板,也可以双击状态进入编辑。
优点:
1、变化多端的操作,自带组件库并支持强大的第三方组件库,提供强大的交互支持,完整的教程及支持文档,支持原型预览。
2、既可以画图又可以做文档,画图难度比PS低,写文档比WORD灵活。
缺点:
1、学习成本较高,性价比不高,专业需求度高。
2、手机端演示效果差,服务器不在国内,自带元件库用处不大。
适用人群:
适用于追求强交互效果及细节产品经理及设计师,需要具有一定经验或较强专业性。
墨刀
墨刀是一款在线的移动应用原型与线框图工具。借助于墨刀,创业者、产品经理及UI/UX设计师能够快速构建移动应用产品原型并向他人演示。它是一款基于WEB端的全平台原型设计工具,其更偏向于“交互向”。它同时也是协作平台,项目成员可以协作编辑、审阅 ,不管是产品想法展示还是向客户收集产品反馈,向投资人进行Demo展示,或是在团队内部协作沟通、项目管理。以下是一些关于墨刀的特性:
价格:
使用环境:
优点:
1、近乎完美的原型演示效果,适合产品设计确认与交互验证。
2、丰富的元件,无需自己编写可直接使用。
3、非常方便分享给他人,预览速度也非常快。
缺点:
1、不适合做文档,只适合做交互设计。
2、由于事件系统比较简单,因此无法演示复杂的交互效果例如需要变量控制页面和数据排序等。
适用人群:
需要做简单的demo的设计师。
Axure RP对比墨刀
Axure作为老牌的原型图工具,功能最齐全,交互最多样,基本任何想要的效果都可以实现,尤其在制作PC端原型图上有优势。但axure缺点同样也相当明显,其动态面板、中继器等功能都是强大的,但是却不容易搞懂,学习成本较高。它的素材也是一个问题,需要花费较多的时间来寻找相应素材并进行载入。相比之下,墨刀对于APP的原型设计的体验就显得好多了。其控件的拖拉、大小的调整,都会自然的去匹配相应的母版大小。并且墨刀的系统控件都是基于APP以及安卓/IOS系统平台,因此在里面可以首先选择相应的设备布局,这就减少了不少工作环节。墨刀的缺点就是不自由,这也与墨刀的产品定位有关(移动端原型设计工具)。因此在交互效果、控件组合和操作面板的选择上都不如Axure 灵活,并且效果切换由于是采用连线的方式,有时候会让设计师感到混乱。并且目前原型的交互效果系统自带的还比较少,虽然基本满足日常所有原型的使用,但还需要额外充费才能够使用更强大的共享创建等功能。总体来说,想要快速上手快速设计的话就采用墨刀,但想要进行更加专业的操作的话推荐使用Axure。
三.原型工具使用
在经过一番寻找与比对之后,我选用了一个在线版网页端原型设计工具来初步设计我们小组项目——SHOU蟹黄堡的原型。选用它的理由如下:无需下载在线使用;免费且功能无限制。
以下是小组项目蟹黄堡的首页:包含了每日推荐餐厅(或菜品),下方有每周推荐,精品菜,荤菜素菜类等分类。
注册与登录界面:
以上就是蟹黄堡的一个大致原型设计,目前仅设计了注册登录与首页界面。首页界面待完善的也还有许多功能,例如新生专区以及地点分类和详细的菜品分类等。
参考文献:
(4条消息) 【原型设计】8种原型设计工具介绍_Lucky@Dong的博客-CSDN博客
(4条消息) 产品经理原型工具选择:墨刀和axure的区别?_东方草堂的数据的博客-CSDN博客
标签:交互,对比,原型,设计,墨刀,心得,Axure,页面 From: https://www.cnblogs.com/bocchitherock/p/17400516.html