首页 > 其他分享 >不同原型设计工具的对比以及使用心得

不同原型设计工具的对比以及使用心得

时间:2023-05-17 23:34:18浏览次数:48  
标签:交互 对比 原型 设计 墨刀 心得 Axure 页面

一.原型简介  

  在做工业产品设计时设计师会建立一系列的模型来对设计进行一系列测试。而原型(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蟹黄堡的原型。选用它的理由如下:无需下载在线使用;免费且功能无限制。

 

  以下是小组项目蟹黄堡的首页:包含了每日推荐餐厅(或菜品),下方有每周推荐,精品菜,荤菜素菜类等分类。

  注册与登录界面:

                                                                                              

   以上就是蟹黄堡的一个大致原型设计,目前仅设计了注册登录与首页界面。首页界面待完善的也还有许多功能,例如新生专区以及地点分类和详细的菜品分类等。

 

参考文献:

原型设计介绍,了解一下? - 知乎 (zhihu.com)

(4条消息) ​【原型设计】8种原型设计工具介绍​_Lucky@Dong的博客-CSDN博客

(4条消息) 产品经理原型工具选择:墨刀和axure的区别?_东方草堂的数据的博客-CSDN博客

 

 

标签:交互,对比,原型,设计,墨刀,心得,Axure,页面
From: https://www.cnblogs.com/bocchitherock/p/17400516.html

相关文章

  • 原型设计工具
    什么是原型和设计?原型:用线条、图形描绘出的产品框架,也称线框图。设计:综合考虑产品目标、功能需求场景、用户体验等因素,对产品的各版块、界面和元素进行的合理性排序过程。原型设计的重要性是怎样?产品阶段:Idea→需求采集→功能结构→原型设计→产品需求文档(PRD文档)→Roadmap原......
  • 常见的原型设计工具对比及初体验
    常见的原型设计工具对比及初体验1、市面上常见的原型设计工具1.1AdobeXDAdobeXD是由Adobe公司推出的一款原型设计工具,具有强大的交互设计功能和快速的原型制作能力。它提供了丰富的界面设计工具、交互动画和原型共享功能,适用于设计师和团队进行移动应用和网页的原型设计......
  • 原型设计工具对比以及使用感受
    一、目前常见的原型设计工具名称介绍优点缺点AxureRP 功能全面,适合大型项目可以完成复杂的流程和交互设计支持多种平台适合大型项目学习难度较高价格贵Sketch 在Mac上运行,简单易用,支持插件扩展学习起来较为容易大量插件扩展运行比较流畅不适合......
  • 主流原型设计工具介绍
    原型设计是产品开发过程中的一个重要的环节,它可以帮助产品经理和设计师快速验证产品思路,沟通交互细节,提高产品质量。市面上有很多原型设计工具,每个工具都有自己的特点和优势,本文将介绍几种主流的原型设计工具,并举例说明其使用方法。墨刀墨刀是一款在线一体化产品设计协作平台,集......
  • Spring的原型Bean(Prototype)声明和注入方式
    目录一、了解单例和原型Bean1.1什么是单例Bean?什么是原型Bean?1.2如何去定义一个原型Bean二、注入原型Bean的方法2.1使用ApplicationContext的getBean每次进行获取2.2使用@Lookup注解三、使用场景四、参考一、了解单例和原型Bean1.1什么是单例Bean?什么是原型Bean?单例Bean,......
  • 原型设计工具
       主流原型设计工具及其优缺点我所查到的主流原型设计工具主要有五款,分别是Axure、BalsamiqMockups、墨刀、Justinmind和iClap。AxureAxureRP是美国AxureSoftwareSolution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快......
  • 主流原型设计工具
    AxureR2.P,它是美国AxureSoftwareSolution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专门的原型设计工具,它比一般创建静态原型的工具如Visio、Omnigraffle......
  • simulink二次调频AGC风电风机储能电动汽车水电火电二次调频,对比了有无储能电动汽车,水
    simulink二次调频AGC风电风机储能电动汽车水电火电二次调频,对比了有无储能电动汽车,水电火电调频,经典两区域系统二次调频。加入了风火水储资源!!系统频率波形如下经典两区域系统二次调频。ID:97300697393964707......
  • 原型设计
    关于什么是原型在软件开发中,一个原型是产品或数据系统的一个基本的实用模型,通常为示范目的或开发程序的部分结构。在以原型为基础的程序方面,一个原型是一个最初的对象(object);新的物体藉由复制原型产生。那原型设计有什么用呢?可以快速让制作人员了解各部分的功能和布局,比如......
  • 原型设计工具墨刀介绍
    墨刀,官方网站为:https://modao.cc/根据我的使用体验,我发现了墨刀以下优点:1.有大量工具可供选择,方便用户选择自己需要的工具完成设计。2.可以一个文件内编辑多个页面 3.提供大量图片素材,还可以自由导入所需图片  在体验过程中我还发现了以下缺点:1.部分工具的用途没有教......