设计稿居然可以智能生成代码?imgcook 来助力!
imgcook.com 是个设计稿智能生成代码平台,可以帮您自动生成高质量的前端代码。
2020年 双11 90.4% 前端模块是由 imgcook 自动生成的!欢迎来体验~
设计师给的设计稿图层太混乱怎么办?
你知道 imgcook 插件有“合并”和 “成组”这两种骚操作么?
什么?不知道?让我来给你演示一通!
什么是“成组”?
就是在 Sketch 插件中通过“成组”可以指定生成代码的嵌套结构
下面是我想要的嵌套结构
👇👇👇
将要放在一起的图层 选中、编组、成组
👇👇👇
生成的DOM树 100% 符合您的预期
什么是“合并”?
就是在 Sketch 插件中通过“合并”可以将多个图层合并成一张图片
这个功能你肯定用得到!
比如将多个图层组成的 ICON 合并成一张图片
👇👇👇
将要放在一起的图层 选中、合并图片
比如将多个图层组成的 氛围 合并成一张图片
👇👇👇
将要放在一起的图层 选中、合并图片
👇👇👇
将要放在一起的图层 选中、合并图片
组合拳“合并” + “成组”
imgcook 支持自动合并和成组
不用人工“合并” + “成组” 操作
也能自动生成可维护性较高的代码哦~
如果你的设计稿特别混乱,可以用这俩操作试试。
👇👇👇
“合并” + “成组” 一起用
👇👇👇
可以生成 100% 准确的代码
👇👇👇
查看生成的代码
你,学废了吗?
😇 😇 😇
学废了就来用 imgcook.com 帮您自动生成代码吧~~ 让您告别简单重复又繁杂的工作~
最终技能
我们一直在努力提升生成代码可维护性。
如果您有建议,欢迎来我们的用户群反馈。
除文章外还有更多的团队内容等你解锁🔓