首页 > 其他分享 >主流原型设计工具介绍

主流原型设计工具介绍

时间:2023-05-18 13:00:40浏览次数:47  
标签:界面 工具 主流 原型 设计 墨刀 交互 Axure

什么是原型?

  即把系统主要功能和接口通过快速开发制作为“软件样机”,以可视化的形式展现给用户,及时征求用户意见,从而明确无误地确定用户需求。同时,原型也可用于征求内部意见,作为分析和设计的接口之一,可方便于沟通。

原型设计工具:

  原型设计工具可以更好地明确需求,发现设计中的问题和风险,进一步优化整体设计,促进与客户方的沟通,由此可见,做好原型设计对于需求方面的工作非常重要,以下介绍两种原型设计工具。

1:Axure

  Axure是一种设计原型工具,它可以帮助用户快速创建高保真的原型设计,并提供了大量的图形元素、交互组件和模板等功能,让用户能够轻松地进行UI设计、流程设计等。主要针对负责定义需求、定义规格、设计功能、设计界面的专家,包栝用户体验设计师、交互设计师、信息架构师、业务分析师、可用性专家和产品经理。

Axure 功能介绍

  网站框架图:Axure可以制作清晰的网站框架结构,并可以从框架图点击直接进入对应界面。

  网站框架结构图,可以快速准确描述网站或软件界面的框架结构

  示意图:Axure制作的示意图可以准确描述界面布局和功能按钮及界面之间的关联关系。

  网页或软件示意图,设计界面的风格和框架,每个位置的元素描述清晰明了。

  流程图:Axure可以制作流程图,并且支持多泳道的流程图制作,默认自带Flow元件库,可以方便快捷的制作流程图。

 

  Axure制作流程图相比于其他软件可以从流程图的节点直接跳转到对应页面,是其一大优势。

  网页交互设计:Axure预制了丰富的事件和动作,通过事件与动作关联可以完成常规所有的界面交互设计。

  Axure的可视化工作环境可以让你轻松快捷的以鼠标的方式创建带有注释的线框图。不用进行编程,就可以在线框图上定义简单连接和高级交互。在线框图的基础上,可以自动生成HTML原型和Word格式的规格说明。

2:墨刀

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

 墨刀功能介绍:

  1. 操作简单:简单拖拽和设置,即可将想法、创意变成产品原型。 

  2. 演示:真机设备边框、沉浸感全屏、离线模式等多种演示模式,项目演示效果逼真。

  3. 团队协作:与同事共同编辑原型,效率提升;一键分享发送给别人,分享便捷;还可在原型上打点、评论,收集反馈意见,高效协作。

  4. 交互简单:简单拖拽就可实现页面跳转,还可通过交互面板实现复杂交互,多种手势和转场效果,可以实现一个媲美真实产品体验的原型。 

  5. 自动标注及切图:将 Sketch 设计稿墨刀插件上传至墨刀,将项目链接分享给开发人员,无需登录可直接获取到每个元素宽高、间距、字体颜色等信息,支持一键下载多倍率切图。 

  6. 素材库:内置丰富的行业素材库,也可创建自己的素材库、共享团队组件库,高频素材直接复用。

  墨刀的基本使用

  完成登录/注册绑定,不同于Axure一定要下载才能使用,墨刀可以直接在网页上打开进行创作,对于用户来讲很方便。

      

  选择创建空白项目。

       

  进入工作区

      

  点击“主页”进入编辑界面。

      

  我尝试着做了一个简单的界面。

    

  墨刀与Axure的比较

  1、 原型图工具有axure、墨刀、摩客(Mockplus)、xiaopiu、Sketch等,其中现在最常用的原型图工具主要包括axure和墨刀。axure作为老牌的原型图工具,功能最齐全,交互最多样,基本任何想要的效果都可以实现,尤其在制作PC端原型图上有优势。axure缺点也相当明显,Axure的动态面板、中继器等功能都是强大的,但是不容易搞懂。AXURE的素材也是很蛋疼的问题,大部分PM 都会在AXURE原型库、素材库去寻找相应的第三方素材库,进行载入。需要花费相应的时间。

  2、墨刀对于APP的原型设计真的是体验非常好,怎么说呢?就像有一个无形的人在帮助你,和你一起打造你的原型APP。(当然以后也适用微信小程序的设计),其控件的拖拉、大小的调整,都会自然的去匹配相应的母版大小。无需去担心有多移动一点或多 选择一点。并且墨刀的系统控件都是基于APP,以及系统平台IOS和安卓,因此在里面可以首先选择相应的设备布局,减少了不少工作环节。 墨刀的缺点就是相应的就是不自由,首先这也于墨刀的产品定位有关,清晰定位为移动端原型设计工具,因此在交互效果上、控件组合上,操作面板的选择上都不如AXURE 灵活,并且效果切换因为是采用连线的方式,有时候会让使用者脑子错乱的感觉。并且目前原型的交互效果系统自带的还比较少,但基本满足日常所有原型的使用。另外需要充费才能够使用更强大的共享创建功能。

标签:界面,工具,主流,原型,设计,墨刀,交互,Axure
From: https://www.cnblogs.com/lhd001/p/17411595.html

相关文章

  • domutils 工具库的使用方法介绍
    domutils是一个Node.js的DOM操作工具库,它提供了一系列方法,可以方便地对DOM树进行操作和遍历。该工具库是基于浏览器的DOMAPI开发的,因此具有很好的兼容性和稳定性。下面我们来介绍一下domutils工具库的主要作用和使用方法。作用domutils工具库的主要作用是提供一些......
  • percona-xtrabackup数据库备份工具
    文章目录percona-xtrabackup备份工具安装流程完全备份流程完全恢复流程增量备份流程增量恢复流程percona-xtrabackup备份工具安装流程安装percona-xtrabackup先准备PerconaXtraBackup8.0需要的mysql源:yuminstall-yhttps://repo.mysql.com//mysql80-community-release-el7-......
  • 【实用干货】造价工具箱正式上​线
    一.前言去年跟大家说过,要和大家分享我做的新网站。这不,来了。经过1年的打磨,造价工具箱终于正式上线了,同时这个网站也是我们的企业官网.请大家牢记以下网址:(合象谷管理的拼音首字母)www.hxggl.com二.工具介绍工具分为两部分:工具箱(提供一些实用的在线工具)联络站(提供线下的专业......
  • delphi 写的图片合成工具---品一套图大师 v1.1.0
    在石材行业,套效果图是一个非常重要而经常要面临的工作,如果自身不懂得PS,那就需要经常去麻烦别人,而且客户可能没有办法一直在等你的效果图...基于以上的种种原因,所以就开发了这个工具,只需把图片拉到这工具,点点这个点点那,不到1分钟就可以做出漂亮的效果图~ 软件主界面: 需要套......
  • 5大主流方案对比:MySQL千亿级数据线上平滑扩容实战
    转载于:https://mp.weixin.qq.com/s/DWUIy0Bt2Jw-lHRGm50cow1.五个方案1.1停机方案1.2停写方案1.3日志方案1.4双写方案(中小型数据)1.5平滑2N方案(大数据量)2. 平滑2N扩容方案实践2.1 实现应用服务级别的动态扩容2.2 实现数据库的秒级平滑2N扩容3.keepalived......
  • 不同原型设计工具的对比以及使用心得
    一.原型简介在做工业产品设计时设计师会建立一系列的模型来对设计进行一系列测试。而原型(prototype)则相当于数字产品的模型,也可以叫产品的demo版。按照保真程度分,原型可以笼统地分为低保真原型和高保真原型。 任何低保真原型都具有以下特点:在早期检测和修......
  • 【愚公系列】2023年05月 .NET CORE工具案例-对象映射Master的使用
    (文章目录)前言对象映射框架Master可以帮助开发人员将对象映射到数据库,以进行数据持久化。它还可以支持ORM(对象关系映射),以及其他数据库技术,比如存储过程。它可以帮助开发人员更快、更有效地完成数据库操作。Master官网:https://github.com/MapsterMapper/Mapster一、对象映射m......
  • table常用工具函数 - 表用法
     table_ext.lua---如果table不为空则新建functiontable.getEmptyTable(tb)ifnil==tbornil~=next(tb)thenreturn{}endreturntbendfunctiontable.isEmpty(tb)returnnil==tbornil==next(tb)endfunctiontable.swap(tb,k1......
  • 原型设计工具
    什么是原型和设计?原型:用线条、图形描绘出的产品框架,也称线框图。设计:综合考虑产品目标、功能需求场景、用户体验等因素,对产品的各版块、界面和元素进行的合理性排序过程。原型设计的重要性是怎样?产品阶段:Idea→需求采集→功能结构→原型设计→产品需求文档(PRD文档)→Roadmap原......
  • 接口统一返回工具类
    一、接口统一返回类importcom.alibaba.fastjson.annotation.JSONField;importcom.alibaba.fastjson.serializer.SerializerFeature;importlombok.Data;importjava.io.Serializable;@DatapublicclassResponseMessage<T>implementsSerializable{//返回状态......