涨姿势！摹客切图小技巧

设计师在将设计稿交付给前端工程师之前必定会用到切图功能，但有时生成的切图却不符合前端的要求，怎么办呢？

今天就给大家分享关于切图的一些小技巧。切图往往存在两种形式：素材填满整个切图或者素材周围带空白区域。一起来看看具体用法吧！

关键信息：

素材填满整个切图
素材周围带空白区域
如果切图下方是有背景的，如何让背景透明？
在摹客中快速生成带空白区域的切图（强烈推荐）

素材填满整个切图：

在Sketch中选中需要切图的图层或编组；
点击右下角的Make Exportable，上传至摹客即可。（如何上传至摹客？）
无需再设置多种切图倍率，摹客将自动生成不同倍率的切图。

素材周围带空白区域：

在Sketch中选中需要切图的图层或编组，点击右下角的Make Exportable；
再点击“切刀” 工具，对外框大小进行调整即可。（快捷键是S，按住S直接绘制外框。

如果切图下方是有背景的，如何让背景透明？方案如下：

将切片图层和需要切图的图层编组，选中切图图层；

勾选右侧属性面板上的Export group contents only。
通过上述操作可以保证切片在有背景的情况下也是透明的。

除了在Sketch中绘制外框外，在摹客中也可以快速生成带空白区域的切图。（强烈推荐）

在Sketch中点击右下角的Make Exportable后，直接上传至摹客；
在摹客的开发模式下选中切图，勾选“自定尺寸”，填充模式选为“居中”；
接着设置好需要的切图尺寸，一键下载即可；
此时下载下来就是带空白区域的切图。（注：当设置尺寸大于素材本身的尺寸时才会出现空白区域。）

今天关于切图的小技巧就讲到这里了，小伙伴们快去试试吧！

涨姿势！摹客切图小技巧相关推荐

给前端工程师的快速切图小技巧 (切出jpg图标或png透明图)
部分看了文章的设计师,来找我说怎么切图.sorry?在我的理解,这就是切图啊,但是他们所指的"切图"是,怎么把设计图制作成html页面. 这就说明,现在人们对于前端都是有误区的.认 ...
Photoshop——切图小技巧
准备工作把Photoshop功能面板设置成我们前端常用的并保存下来,这样就不用我们每次使用的时候都要花时间再去设置一次了. 1.设置标尺单位 --CSS里面用的最多的单位是像素(px),测量和读取的 ...
Unity2D--关于2D游戏的切图小技巧
在Unity2D游戏中,在制作过程中有时会使用一些游戏素材来增加游戏的趣性但在一些裁剪游戏素材的过程中我们会发现,当我们裁剪完之后为他添后Animation后,游戏素材可能会出现上下浮动的现象.举个 ...
常用的几种PPT做图小技巧！
大家使用过PPT做图吗?一般情况下,我们做图的话都会使用Photoshop制作图片.其实PPT也是可以制作图片的,今天小编就教给大家几种常用PPT做图小技巧哦! 技巧一:插入图片改为背景在PPT中我 ...
ArcMap出图小技巧：图例，比例尺，指北针，标题（附练习数据）
接上篇ArcMap出图小技巧分享讲解了主图的设计,接下来讲述一下出图时的其他要素(图例,比例尺,指北针,标题) 这时候我们要出图了,切换到布局视图. 系统默认纸张大小都是A4纸,如下图所示: 考虑到布 ...
ArcGIS制图及出图小技巧——以土地利用图为例
欢迎大家关注我的公众号,最新内容先在公众号发布.点击这里查看近期文章合集. 文章目录一.关于地图配色 1.使用取色器 2.批量修改符号二.关于出图 1.快速调整数据框以适应纸张大小 2.使用导入符 ...
ArcGIS出图小技巧——比例尺、鹰眼图、表格、文本、图片
欢迎大家关注我的公众号,最新内容先在公众号发布.点击这里查看近期文章合集. 文章目录一.比例尺 1.修改比例尺的显示单位 2.去掉比例尺中的千位符(逗号).修改小数位数二.鹰眼图(范围指示器) 三 ...
切图小贴士-手机Android平台“点九”的切图
用户手中看到的产品界面,并非设计师呕心沥血创作的效果图,而是一个个单独的切图经由开发同学技术实现.切图作为设计师与开发者之间的桥梁,它的作用很关键,合适的切图.精准的位置可以最大限度的还原效果图的设计 ...
ArcMap出图小技巧：主图设计、图例、比例尺、指北针、标题
ArcMap一个重要的功能是出图!!!!! 因为图片对于一些文字描述来说更为直观,所以掌握一些出图技巧也是极为重要的,不仅能让我们在数据处理过程快速得到我们想要的图层,也可以让图层看起更加精美好看哦. ...

涨姿势！摹客切图小技巧

关键信息：

素材填满整个切图：

素材周围带空白区域：

如果切图下方是有背景的，如何让背景透明？方案如下：

除了在Sketch中绘制外框外，在摹客中也可以快速生成带空白区域的切图。（强烈推荐）

涨姿势！摹客切图小技巧相关推荐

最新文章

热门文章