使用摹客iDoc for Mac上传Sketch设计稿教程
时间:2019-08-19 浏览次数:122 编辑:user04
摹客iDoc for Mac是一款支持sketch,能够通过摹客iDoc sketch插件,上传sketch设计稿以进行标记切图等设计稿的插件。本次小编为您带来使用摹客iDoc for Mac上传sketch设计稿的教程,不会操作的朋友快来看看吧!
使用摹客iDoc for Mac上传sketch设计稿教程
打开插件
插件安装好后打开sketch,在「Plugins(插件)」中找到摹客 iDoc 插件,选择并打开。
注册和登录
使用摹客平台账号(在Mockplus、摹客 iDoc 上通用)即可登录。
新建项目
通过点击加号图标“+”进行新建项目的操作。
在新建项目时可选择项目集,将项目创建在目标项目集内。
通过点击加号图标“+”右侧的“更多”图标,可以进行切换团队、切换账号、设置等操作。
标记切图
切图往往存在两种形式:素材填满整个切图或者素材周围带空白区域。
素材填满整个切图:
在sketch中选中需要切图的图层或编组;
点击右下角的Make Exportable,上传至iDoc即可。
无需再设置多种切图倍率,iDoc将自动生成不同倍率的切图。
素材周围带空白区域:
在sketch中选中需要切图的图层或编组,点击右下角的Make Exportable;
再点击“切刀” 工具,对外框大小进行调整即可。(快捷键是S,按住S直接绘制外框。)
如果切图下方是有背景的,如何让背景透明?方案如下:
将切片图层 和需要切图的图层编组,选中切图图层;
勾选右侧属性面板上的Export group contents only。
通过上述操作可以保证切片在有背景的情况下也是透明的。
除了在sketch中绘制外框外,在iDoc中也可以快速生成带空白区域的切图。
在sketch中点击右下角的Make Exportable后,直接上传至iDoc;
在iDoc的开发模式下选中切图,勾选“自定尺寸”,填充模式选为“居中”;
接着设置好需要的切图尺寸,一键下载即可;
此时下载下来就是带空白区域的切图。(注:当设置尺寸大于素材本身的尺寸时才会出现空白区域。)
选择设计稿倍率
点击倍率下拉框选择设计稿对应的倍率。例:375pt*667pt的设计稿对应 @1× 。
上传设计稿
上传前,有以下三个选项:
上传全部页面 &mDash; 将该设计稿中所有的页面和画板全部上传至iDoc中。
上传全部画板 &mDash; 将该设计稿中所有的画板上传至iDoc中。
上传所选画板 &mDash; 将选中的画板上传至iDoc中。
然后点击“上传”,即可将设计稿资源一键上传至 iDoc,设计师和开发可登录摹客 iDoc 查看标注与下载切图。
状态图
在sketch中选中单个画板并勾选“上传所选画板”,点击“上传”,插件将自动执行上传状态图操作。
同步画板
如果在sketch中删除了几个画板,再次上传设计稿时,勾选“设置”中的“上传全部画板时自动检测不对应的画板”,sketch中已删除的页面在iDoc中也会同步删除。
相关文章
-
MultiDock使用教程
MultiDock for Mac版是一款非常好用的Dock栏工具,可以为您的项目创建快捷面板,面板看起来几乎与实际的macOS Dock一模一样。它们可以在浮动模式下自由移动,也可以固定在屏幕的四个侧面之一,非常方便。
浏览:91 时间:2019.06.26
-
摹客iDoc for Mac sketch插件标记切图教程
摹客iDoc for Mac是一款支持Sketch,能够通过摹客iDoc Sketch插件,上传Sketch设计稿以进行标记切图等设计稿的插件。本次小编为您带来使用摹客iDoc for Mac sketch插件标记切图教程的教程,不会操作的朋友快来看看吧!
浏览:73 时间:2019.09.23
-
在Mockplus中如何将原型上传iDoc?
Mockplus for Mac是一款非常好用的原型设计软件,现在Mockplus支持将你的原型设计上传至iDoc了,你可以在iDoc中可以对Mockplus原型进行协作设计、自动标注、一键切图等操作,本次小编为您带来了Mockplus原型上传iDoc的教程,想知道如何上传的朋友快来看看吧!
浏览:108 时间:2019.06.18