mockup builder(原型设计工具) v1.0.4955 免费版 附使用教程

mockup builder中文版是一款免费的原型设计工具，被称为杀手级的界面原型设计工具，软件拥有极具丰富的表现形式，可以进行网页、桌面应用、移动应用等多种设计，支持交互的线框图，支持导出图片和pdf文档，适合从事原型设计的设计人员使用。

软件特点

1、支持网页、桌面软件、APP界面设计：

2、外观漂亮，作品线条和轮廓精美和谐

3、丰富的控件支持，可迅速开展工作

4、可以将文件导出为图片或者PDF格式

5、支持在本地运行(需要联网)并保存项目到本地

6、支持中文，完全免费

软件功能

1、绘制一个原型的网站

2、为智能手机创建手机原型附件

3、做桌面应用程序面板模型

4、线条和轮廓是令人愉悦的，并期待专业。样机允许迅速开展工作。

mockup builder使用教程

1、下载软件并安装

2、顶部是 系统菜单：

File下边包括New、Open、Close、Export等操作。

Edit下包括对控件的操作：撤销与反撤销、Cut、Copy、Paste和Delete等。

VIew下的操作就是放大、缩小设计图等操作：

Help下就是一些联系方式、说明等：

3、系统菜单下边是控件栏：

目前分成九组控件，包含的还是挺丰富的。有网页上用的，也有桌面软件用的。

4、界面右侧，从上往下依次是：

Common Commands：一些常用命令，复制、删除、剪切等。

Screen Manager：设计页面管理，新增页面、复制、删除、编辑等。

5、设计区域：

拖动控件到这个区域就可以了。

设计区域的背景是一个网格，对于对齐控件很方便，而且个人感觉拖动控件的体验比Lumzy强不少，Lumzy经常不能拖动着对齐。

但是编辑控件上显示的文字就显得有点怪怪的，如图：

编辑前：

编辑状态：

它是在原来的视图上弹出了一个编辑框，在里边编辑，然后更新后边的视图。

如果是第一次操作，特别是对一些文字少的控件，还真有点不习惯，不知所措的感觉。

6、图片与链接

(1)有几个控件支持选择预定义图片或者上传自己的图片的，如Icon、Image等：

在设计区域选中控件后，在右侧会显示控件的属性：

有一个Images属性或Icons属性，点击打开就可以选择预定义图标或者上传自己的图片了。

(2)如果想给 页面直接添加链接跳转，也是可以的。

选中一个控件：

然后在程序的右下角，选择要跳转到的页面：

简单的跳转，没有 Lumzy的粒度细。

7、预览与运行

点击右上角的Presentation按钮，就可以预览效果了。

还可以在预览图上注释，圈点，这些是交流用的。

8、导出PNG或PDF，分享给同事或客户：

Export all Screens to PNG导出的文件使用Winrar解压出错，不知道什么问题。

其它两项导出正常，不过在导出文件的最下边会添加一个导出工具的注释。

然后就可以把这些文件与别人分享了。

9、保存项目，分享给同事或客户：

点击 Save 会提示保存项目到本地，然后你就可以发给别人去看了。

因为Mockup Builder好像没有在服务器端保存项目，所以没办法提供一个Url分享给他人(也许是我没找到)。

因为这个工具不用注册就可以使用，所以把打开这个工具的地址和你的项目文件发给他人就行了。

接收到的人点击 Open ,选择项目文件就可以看到了。