教程 > Mockplus > 基础教程 > 导入与导出

导入与导出

组件的导出和导入

如果你想将Mockplus项目A中的组件运用到项目B中,可以使用导出、导入组件来进行。具体步骤如下: 打开项目A,选定所需组件(一个或多个),鼠标右键菜单->导出组件;

导出.png

新建窗口,打开项目B,在工作区空白处,鼠标右键菜单->导入组件; 

导入组件.png

这样,我们就完成了组件数据的交换。

当然,你还可以把自己设计的组件导出后分享给其他人。  

页面的导出和导入

如果你想将Mockplus项目A中的页面运用到项目B中,可以使用导出、导入页面来进行。具体步骤如下: 打开项目A,在项目树里,选择所需的页面(可以一个或者多个),鼠标右键菜单->导出页面;

导出页面.png

新建窗口,打开项目B,在项目树的节点上,鼠标右键菜单->导入页面;

导入页面.png

这样,我们就完成了页面数据的迁移。

注意:项目B的类型及页面尺寸需与项目A保持一致。 当然,你还可以把自己设计的页面导出后分享给其他人。

项目的导出和导入

在Mockplus中完成设计项目后,你可以将文件以.mp格式导出保存至本地。以便后期随时随地导入到Mockplus后查看或编辑项目文件。

项目导出

个人项目:Mockplus主菜单->另存为。

1.png

协作项目:Mockplus主菜单->导出->导出MP文件。

2.png

备注:协作项目导出后会成为个人项目,如果团队想继续进行协作设计,将其升级为协作项目即可。 

4.png

项目导入

1)直接双击本地保存的.mp文件。

2)Mockplus软件启动页->个人项目->打开项目->本地项目。

本地项目.png

平时建议养成及时保存项目的习惯,以防不慎丢失。

导出文档

在Mockplus中完成设计后,可以以不同形式导出文档。导出之后可以很方便的将自己的设计成果发给老板、同事或客户查看。

导出图片

适用场合:演示和分享静态的线框图。

操作方式:主菜单栏 ->导出 ->导出图片。

主菜单栏导出.png

或:主工具栏 ->导出 ->导出图片。目前支持JPG和PNG两种格式。

1.png

2.png

演示支持环境:图片播放软件或幻灯片播放软件。

导出HTML演示

适用场合:在离线的情况下,也可以通过网页方式查看原型。还可以通过这个功能,把网页部署到你自己的服务器上,便于团队内部分享。 

操作方式:主菜单栏->导出->导出HTML演示。

导出html演示.png

或:主工具栏->导出->导出HTML演示。

3.png

4.png

演示支持环境:浏览器。

导出演示包

适用场合:在离线的情况下查看原型。由于演示包内含了Mockplus的支持环境,因此,演示时可以最大程度保证演示效果和设计效果完全一致,不受各种浏览器的兼容问题影响。 

操作方式:主菜单栏->导出->导出演示包。

导出演示包.png

或:主工具栏->导出->导出演示包。

5.png

6.png

演示支持环境:不需要其它软件支持。

导出项目树

适用场合:把整个项目的树形结构,导出为图片等多种形式,包括脑图、树图、HTML、MarkDown、XML、文本等形式。适合插入到PRD文档中,辅助演示和分享。 

操作方式:主菜单栏->导出->导出项目树。

导出项目树.png

或:主工具栏->导出->导出项目树。

导出脑图.png

演示支持环境:图片播放软件、文本编辑软件或幻灯片播放软件。

导出脑图

适用场合:快速反映设计思路和项目结构,导出为图片形式。 

操作方式:主工具栏->导出->导出项目树->脑图。 

导出脑图.png

或者:脑图编辑模式->导出图片。 

脑图编辑模式.png

脑图导出.png

演示支持环境:图片播放软件或幻灯片播放软件。

导出页面流程图

适用场合:直观地查看每个页面的内容展示和功能流程,导出为图片形式。 

操作方式:主工具栏->页面流程图->导出图片。 

演示支持环境:图片播放软件或幻灯片播放软件。 

13.png

14.png

导入Sketch

Mockplus 3.2 为Sketch 开发了插件,可以将 Sketch 文档导出为 Mockplus 文档,然后在 Mockplus 中完成交互设计,整个使用过程非常简单。

准备

Mockplus 的插件需要运行在 Sketch 上,版本要求 45 以上。

注意:请保证你的Sketch是从Sketch官网下载的版本,而非从Mac Store下载的,否则可能无法使用这个插件。

安装

https://www.mockplus.cn/download 下载 Sketch 插件,解压后双击 .sketchplugin 文件。Sketch会提示插件已经装好了,如下图:

install.jpg

导出

当完成了设计后,在菜单中选择:Plugins -> Mockplus ->导出项目文件

plugin.jpg

设置选项

在下面的界面中设置项目选项,你可以选择导出部分的 Artboard,同时你还可以选择导出的项目类型和图片大小信息,这些选项会影响最终导出的项目文件。设置好以后,选择“导出”。

select.jpg

在Mockplus中继续设计

将你导出的mp文件使用 Mockplus 打开,然后直接在Mockplus中继续进行设计。

上一章节 页面
下一章节 演示与分享