蓝湖+PS 实现自动化切图

官方教程

Photoshop 插件

安装插件

点击首页右上角的【下载】图标,打开后,即可下载蓝湖 Photoshop 插件
安装成功后,请重启 Photoshop
★ 注:蓝湖 Ps 插件仅支持 Photoshop CC 2015 及以上版本
👇(下载蓝湖 Photoshop 插件地址)

插件下载页

登录

打开 Photoshop【窗口】→【扩展功能】→【🐳 蓝湖】👇


image.png

输入蓝湖帐号、密码登录👇


登录页面

选择设计图要上传的团队与项目,点击【确定】👇
选择团队和项目

选择设计对象(类型)

插件内 “当前设计” 是指当前设计图的大小,根据设计图大小选择对应倍数
确定当前设计基于的设备是 iOS、 安卓 还是 Web
再确定现在的设计图是基于几倍设计的,最后选择和设计图匹配的设备和倍数
◆ 分类:
iPhone、iPad、iWatch 这三种设备的界面设计 属于—— iOS
安卓系统的界面设计 属于 —— Android
网页类型的界面设计 属于 —— Web👇


选择设计类别

◆ 例如:
375 x 667,属于 iOS 1x
750 x 1334,属于 iOS 2x
1920 x 1080, (是手机界面还是网页 )手机建议选 Android-xxhdpi
网页选 Web-1x
◆ Web 类型:
1x,是常用尺寸,大家做的网页一般都是选 1x
2x 是指为特定的屏幕(4k 屏)设计的尺寸,通常该尺寸会是正常网页的 2 倍

设置切图

选中切图的图层,或图层组,点击【标为切图】即可👇


标记为切图

数值是可选的,如果不填数值,默认使用当前图标内容的大小;
如果大小不是自己想要的,可自定义修改👇


image

PS:不勾选“显示切图区域”即可隐藏切图区域,该切图区域隐藏后,不影响切图的上传
💌 设置切图的图层或组,不可重复嵌套(切图之间是平级关系,存在嵌套的话只会将父级图层或者图层组标记为切图文件)

上传设计图

选中要上传的画板,也可选择全部画板(无画板选全部画板),点击【上传】即可👇


上传设计图

设置好的切图,会跟随页面一同上传至蓝湖 Web 端,可看标注,并下载切图。

💌 注意:
1.蓝湖推荐使用 Ps 画板工具,可同时上传多个页面。(没有设置画板需要上传全部画板)
不建议使用 一个 psd 文件通过隐藏显示文件夹来区分不同页面,这样会导致上传的多张设计图成为设计图的历史版本,不便于以后的修改更新。
2.智能对象等同于位图,不会有标注内容和 SVG 格式切图

生成 SVG

切图生成 SVG 格式需要被切图层是矢量的图层, 如形状图层和文本图层,但是图片图层、智能对象不能生成 SVG。
在打开“快速上传模式”之后,才能生成 SVG

快速上传模式 🌱
快速上传模式是 v2.38 版新增的上传模式, 开启后可以更快的上传, 并且支持矢量图层生成 SVG 格式的切图,还能避免切图不对应等意外情况发生。

开启快速上传模式 🌱

💌 注意:
v2.38 之前的版本不能通过插件内自动更新来获得快速上传功能,只能 重新安装插件
快速上传模式只能在 Photoshop CC 2017 以上版本使用.

● 打开: Photoshop 首选项-增效工具-启用生成器
● 在插件右上角的菜单中勾选"启用快速上传"
● 如果你有上传 SVG 的需求, 可以开启"导出 SVG", 如果不需要, 可以关闭它来提升上传速度👇

打开首选项页面

开启快速上传模式

蓝湖插件启用快速上传


启用快速上传
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,189评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,577评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,857评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,703评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,705评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,620评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,995评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,656评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,898评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,639评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,720评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,395评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,982评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,953评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,195评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,907评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,472评论 2 342

推荐阅读更多精彩内容

  • 1.工作。 依旧在出差,但是阶段性工作完成,心理压力少了许多,剩下的工作会进展很快,也会很快结束这项工程。 2.写...
    马_坤阅读 572评论 5 8
  • 《少年梦》 十年风云常翻涌,莫欺少年白发生。 江山社稷无不朽,怎奈他人纨绔情。 滂沱雨,梦若浮萍。 莫道上苍太不公...
    红尘红尘阅读 291评论 0 2
  • 面对进步很慢,效率低,无法承担责任,自己很痛苦,自己也想通过哭来解决问题,但是自己哭不出来,不知为何,自己到底如何...
    Simple_4e4d阅读 223评论 0 2
  • 保家卫国当自强, 甫白之才胸中藏。 英姿飒爽美名扬, 勇者无敌谁人挡? 2017.7.6 藏头诗-保甫英勇,祝他生...
    tulipjia阅读 449评论 3 10