今日讯！原型设计工具介绍

手机

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

家电

今日讯！原型设计工具介绍

2023-05-16 18:59:45 来源：博客园

原型是整个产品面市之前的一个框架设计。设计师可以利用它引导每个人都参与到项目中来。原型展示了各个部分之间的比重以及各个部分之间的联系。原型不仅仅只是表面的东西，它能够说明用户将如何与产品进行交互。与其他工作一样，完成原型设计需要相应的工具协助。

本文将主要介绍3种主流的原型设计工具的特点和使用方法。

Mockplus
Axure
墨刀

Mockplus

1.Mockplus

(资料图片仅供参考)

Mockplus（摹客）是一款简洁快速的原型图设计工具。适合软件团队、个人在软件开发的设计阶段使用。其低保真、无需学习、快速上手、功能够用。并能够很好地表达自己的设计。

Mockplus支持在浏览器在线设计，可以使用户摆脱设备，时间，空间的限制，随时随地的进行设计工作。

Mockplus的易用性还表现在创建原型的速度。如果使用其他工具，可能需要花大量的时间完成一个原型。但使用摩客，只需5分钟。此外，用户还可以通过扫描二维码，在手机上快速的预览原型。

功能：用于制作快速原型的软件。

优点：界面简洁，可快速上手，演示方便支持在线创作与团队创作。

缺点：基础版本素材库丰富度一般

基本使用方法：以本小组作业的停车场预约管理APP进行简要举例说明。

1.注册账号后进入设计界面，点击新建，选择新建项目，编辑项目名称。

2.进入编辑界面后选择设计的设备的界面大小即可开始进行编辑，我组的设计主要用于移动端，在这里选择了华为P30的界面大小。

3.左上可新建页面与分组，或进行图层的编辑。

4.右侧对页面的属性及组件的交互等进行编辑。

5.在左侧素材库选择组件与图标进行界面的简单设计。

6.通过拖拽图标或组件上方的小圆点到指定位置设计交互内容

7.点击右上角的箭头进行演示

8.可以在演示界面进行交互

Axure

2.Axure

Axure RP是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。

功能：用于制作快速原型的软件。也可以绘制中保真原型草图。

应用人群：产品经理、交互设计师、UI设计师、网页设计师。

优点：应用灵活，可拓展性强，拥有超级强大的交互制作能力。

主流的原型设计软件之一，高保真的原型设计工具，名声大，专业性高。

缺点：编辑能力着实强大，变相导致规范性差，管理不便。

难度稍大，入门较慢。鉴于其比较复杂，学习难度较大，新手劝退。

本地型软件，可以下载html文档预览，手机预览不方便。

基本使用方法：

1.元件的使用：在RP中使用软件需要选择后拖拽到工作区使用即可（以矩形为例）。

拖拽矩形左上角的三角就可以进行圆角设置。点击右上角的圆可以更改它的形状。左上角的三角形消失。

旋转，绘制好元件后选择它，按ctrl键，键直接拖拽定界框周围即可。

2.图片的使用：

直接双击当前图片元件即可。也可以在选择元件后的右侧的属性中导入即可。可以直接复制粘贴到AX中进行使用，支持GIF格式。

3.占位符的使用：直接在里面写入内容，双击即可。

4.放大与缩小：按CTRL键前后滚动。

5.分割图片：选择图片，在右侧属性中选择裁切工具，点击需要切除的部分。也可以在图片上点击右键分割图片。选择那部分就切除那一部分。

6.组件交互：通过右侧的交互选项设计组件的交互效果或交互链接，如本项目设计用户界面，先点击图标，选择点击跳转链接，再选择链接到page2即可。

7.预览结果：点击右上角的启动按钮就可以在浏览器中预览结果

墨刀

3.墨刀

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

功能介绍：团队协作：与同事共同编辑原型，效率提升；一键分享发送给别人，分享便捷；还可在原型上打点、评论，收集反馈意见，高效协作。

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

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

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

优点：非常容易做交互，操作简单，效率极高，适合初学者。

界面优美整洁。简洁的界面在一定程度上有助于提高开发人员的效率。

强大的演示能力。墨刀在轻量级的移动端原型制作更加迅速，展示更加方便。

分享方便。反馈及时。墨刀不仅上手快，还可以快速分享，快速查看应用在手机上的效果。反馈回复很及时，产品改进速度也很快。

可以通过浏览器在线编辑。

缺点：应用局限性。墨刀专注于app原型设计,在后台和网页稍有乏力。

需要收费。墨刀本地下载功能需要注册购买，无法直接分享给他人。

归档能力不足。墨刀更倾向于链接、二维码形式输出，不能以文档输出

基本使用方法：

1.选择空白项目：

2.选择模板项目：

3.创建模板项目有包含各应用组件的模板页面，十分便于我们借鉴与修改；

4.空白项目的创建操作：在下方输入项目名以及选择原型的平台后，点击创建，进入项目首页，

中间的是项目的编辑页面，中部的左侧以及顶部边框标注着的数字是像素，用来准对页面的宽度与高度以及页面内组件的位置；最左侧一列素材工具栏——用于直接将素材拖入页面中，页面栏——用于编辑和切换各页面：

右侧工具栏包含组件及图标等素材，最右侧外观栏——当选中某个组件时可在其中编辑外观的各种参数

5.上方工具栏最右侧的运行按键可以模拟运行时的页面操作：

2023-05-16

关键词：