专注于 JetBrains IDEA 全家桶,永久激活,教程
持续更新 PyCharm,IDEA,WebStorm,PhpStorm,DataGrip,RubyMine,CLion,AppCode 永久激活教程

大前端求人不如求己系列工具:如何PSD文件自动标注切图和真机预览

前言

在很多时候,UI会给一部分切图,当你使用一个新的技术,需要的不再是png而是webp或者SVG时候,沟通变得异常复杂,沟通成本急剧增加。

很多时候在想,是否有一些工具,可以帮助我们解决这个尴尬的问题,也可以减少沟通成本;

当然很多公司专业的UI会通过专业工具Stetch帮你生成一套完成的UI备注文件。

可惜,有些时候,并没有。

所以,经过一些摸索,发现了一些比较不错的工具,来提高我们工作的效率;

废话不多说,开始介绍。

蓝湖工具

如上所有,如果没有UI帮你做或者没时间做UI备注,我们就采取其他的在线模式;

在线工具就是蓝湖

121_1.png

注册账号

注册一个免费账号

下载插件

ps应用商店下载蓝湖插件

121_2.png

121_3.png

Adobe Photoshop 插件下载

121_4.png121_5.png

ps中点击蓝湖工具,然后登陆

121_6.png

自动备注

当我们只需要获取自动备注的时候,点击上传面板

121_7.png121_8.png121_9.png

点击去web端查看按钮,可以跳转到蓝湖网页版

121_10.png121_11.png

右边的各种备注信息一览无余,很是方便。

切图

当你需要生成切图时候,如下图一步步操作

121_12.png

双击psd源文件,选中ICON图层,点击标记为切图

121_13.png121_14.png121_15.png121_16.png121_17.png121_18.png

121_19.png121_20.png

手机预览psd源文件

当你之前都已经把PSD文件上传到蓝湖后,appstore下载蓝湖APP,之后就可以直接预览psd文件了

121_21.png

Design Mirror

121_22.png

下载地址

首先下载 photoshop 插件, 然后下载 app,然后在ps里面登录注册好的账号,通过wifi或者USB,就可以app里面预览

121_23.png

121_24.png

121_25.png

这个预览和上一个蓝湖预览最大的不同就是这个完全是本地预览,不需要上传,比较方便。

121_26.png

甚至还可以点击上传图片,把手机上的图片同步到photoshop, 这个挺不错的

文章永久链接:https://tech.souyunku.com/34649

未经允许不得转载:搜云库技术团队 » 大前端求人不如求己系列工具:如何PSD文件自动标注切图和真机预览

JetBrains 全家桶,激活、破解、教程

提供 JetBrains 全家桶激活码、注册码、破解补丁下载及详细激活教程,支持 IntelliJ IDEA、PyCharm、WebStorm 等工具的永久激活。无论是破解教程,还是最新激活码,均可免费获得,帮助开发者解决常见激活问题,确保轻松破解并快速使用 JetBrains 软件。获取免费的破解补丁和激活码,快速解决激活难题,全面覆盖 2024/2025 版本!

联系我们联系我们