imgcook官方版是一款小巧实用的Photoshop专用图像智能化生成代码插件,imgcook软件功能强悍,出自阿里程序员之手,能够帮助设计师用户们将做好的图像稿件自动智能生成前端代码,imgcook操作界面相当的简洁,并且拥有高度智能化,可以保证代码和视觉的高度还原。
imgcook软件特色
智能化
全链路采用计算机视觉、深度学习等智能化手段依次去除对设计稿的约束,智能生成代码。
精度还原
一键智能还原与丰富的操作面板,实时保证代码和视觉的高度还原
DSL多样
自定义 DSL
支持小程序、React、H5、Weex、Rax 等 DSL
高可维护性
DOM 嵌套合理、相对定位布局、文本自适应,ClassName语义化、循环可自动识别
融入研发流程
Imgcook-cli 可将生成的代码以任意形式一键下载到任意目录,和您的研发链路无缝连接,支持自定义加工
imgcook安装步骤
在番茄下载站站下载 PS 版插件解压文件后,会得到对应操作系统的插件安装器文件以及试验田试玩 PSD 文件。安装流程如下:
Mac
双击 imgcook.photoshop_version.pkg 文件,按步骤提示进行安装,安装完毕后可重启 PhotoShop,在顶部菜单「Window(窗口)」-「Extensions(扩展)」 找到 imgcook 插件。
注意:如果遇到软件不可信问题,可前往 「系统偏好设置」-「安全性与隐私」-「仍要打开」。
注意:在最新的 Mac OS Catalina(10.15)中,安装器因为权限原因咱不能使用,可使用下述的手动安装。
Windows
双击 imgcook.photoshop_version.exe 文件,按步骤提示进行安装,大概耗时几分钟。
安装完毕后可重启 PhotoShop,在顶部菜单 「 Window(窗口) 」- 「Extensions(扩展)」 找到 imgcook 插件。
手动安装(推荐)
如果上述安装器安装流程出现异常(比如 Windows 安装过程卡住时间很久,Mac 10.15 安装器不可用),可尝试按以下步骤手动安装。
1、解压下载的 zip 文件,根据各自的系统将解压后目录里的 imgcook.photoshop 目录放置到以下指定目录。
Mac OS: /Library/Application Support/Adobe/CEP/extensions/
Windows x64: C:Program Files (x86)Common FilesAdobeCEPextensions, 或者 C:Program FilesCommon FilesAdobeCEPextensions
Windows x86: C:Program FilesCommon FilesAdobeCEPextensions
2、重启 PhotoShop 即可在顶部菜单「 Window(窗口) 」-「Extensions(扩展)」 找到 imgcook 插件。
imgcook使用方法
1.打开imgcook最新版软件包里的 imgcook试验田.psd 文件,找到 PS 界面 layers(图层) 窗口(如果没有,可以通过勾选 Window(窗口) -> layers(图层))打开
2.选中一个模块最外层的图层节点,点击插件终端界面里的 导出数据。
3.等待插件处理完毕显示导出成功后即可点击 去粘贴 前往 imgcook 平台进行粘贴
imgcook常见问题
Q:为什么有些样式代码导出是 vw,有些是 px、rem?
A:这个跟具体的 DSL 实现有关,实际上三者都可以导出,甚至可以是 less、scss,建议有自定义需求的可以自己在 Github fork DSL 代码实现。
Q:生成的代码是否支持 less 、scss?
A:通常情况下是可以根据节点层级关系做到命名保护的,可以支持了一个比较简单的层级样式代码生成,但相对来讲还是偏静态实现,可以参考此实现
Q:生成的代码样式尺寸不匹配?
A:对于非响应式的情况,默认的代码样式尺寸是根据设计稿实际尺寸出码的,如果有存在1x、2x 设计稿情况,可以参考响应式处理方式进行处理,比如 750 的设计稿,想导出 375 的尺寸(需要根据设计稿尺寸自己在 DSL 实现里做整除)。
同类软件对比
PS cc2018磨皮插件是一款专业的人物图像处理插件,PS cc2018磨皮插件用于人像图片润色,能够能地对图像中的皮肤材质、头发、眉毛、睫毛等部位进行平滑和减少疵点处理,它强大的功能和完美的效果深受PS用户喜欢。
PS素描滤镜是一款PS中十分出色的滤镜插件,它能够帮助用户实现图片转化为素描的强大功能,而且插件完全免费。
imgcook更新日志
DSL 新增 Vue 和 微信小程序两款 D2C Schema 数据协议上线,支持新版编辑器的视图 + 逻辑代码生成
上传设计稿文件生成代码试验功能上线
番茄下载站小编推荐:
imgcook官方版是一款不错的PS插件,全链路采用计算机视觉、深度学习等智能化手段依次去除对设计稿的约束,智能生成代码。FXhome PhotoKey也是不错的软件,推荐同学们下载使用。