原标题:蓝湖一键生成整页代码,帮开发留住头发

蓝湖 Sketch 插件更新啦!此次更新优化了插件的上传速度,还有配套惊喜功能【一键生成整页代码】上线!

设计师更新 Sketch 插件后,上传移动端设计图,开发即可查看、复制使用设计图对应的整页代码,让开发效率起飞!

惊喜功能 —— 【一键生成整页代码】

蓝湖【一键生成整页代码】功能,能自动生成 HTML、Vue、React 等框架代码。

2c96bb0ad71a42f94c3214b9105a7fd6.gif

👉 能做到:

✅ 代码高度还原整页设计

✅ 部分组件识别,绑定相关事件

✅ 目前支持移动端设计图代码生成

简化开发工作流程,有效解决前端工程师撸界面代码费时费力的问题,提升设计和开发的对接效率、全团队的工作和协作效率。

c5135345913504755408d9035e60309e.png

使用新功能 —— 【一键生成整页代码】

👉 第一步:更新【蓝湖 Sketch 插件】至最新版本

✅ 复制链接,在 PC 端下载:

https://lanhuapp.com/mac

25476c4f8d29418dfe81edbe3d256dec.png

👉 第二步:使用最新版【蓝湖 Sketch 插件】上传设计图

ed06a5747f7eb1b0c9f1ea09aae1d62d.png

👉 第三步:一键生成整页代码

在蓝湖【标注详情页】,单击设计图,点击【标注信息栏】最下方的“查看整页代码”,即可解锁蓝湖惊喜功能【一键生成整页代码】;

4a82ee41296cba49953362655f4d2500.png

支持查看、复制使用整张设计图的代码;

cc5703c83e3d51fc8eb89ae665ea5360.gif

选择【代码运行效果】,点击设计图上的相关元素,该元素对应的代码将高亮显示,复制即可使用。

fe872f83b944eb57d731bdd7d810c81e.gif

本次 Sketch 插件更新后,设计图的上传速度更极速,还能使用蓝湖的 Beta 功能【一键生成整页代码】。

小伙伴们都表示新版 Sketch 插件体验更流畅,配套功能【一键生成整页代码】生成的整页代码规范,能直接复制使用,让前端工程师的开发效率更高 👍。

0c4649360098e172d00127288bdb24f3.png

a2bf0571bd6dff8145d92d4f7f761960.png

b6d93db24989144ba161e21eee98fdf1.png

abf3b908ae98cb09d3b12c7c382a3500.png

你还在等什么,马上更新插件,让开发效率更上一层楼,早点下班,保住头发!

✅ 复制链接,在 PC 端下载:

https://lanhuapp.com/mac

从上线至今,蓝湖一直在寻找最佳的工作、协作方式。你对蓝湖有什么建议?希望蓝湖上线什么功能?

欢迎在评论区留言,用心的建议,湖湖一定会牢记于心并付诸实践,让产品更好用,让你和团队的效率起飞!

用蓝湖,不加班

蓝湖网址:LanhuApp.com

蓝湖,高效的产品设计协作平台

责任编辑:

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐