你好啊,我是小智。
今天跟大家聊聊AI编程工具,让前端同学轻松摸鱼,让后端同学变身全栈!
现在,大厂里写代码越来越高级了。只需要上传一张图片,就轻松写出前端界面的源代码。原本3小时的活,现在1小时搞定。
在喝杯咖啡的时间里,让代码自动生成,想想就有点小激动!
所以,我配拥有一个吗?(bushi
▍来看看蚂蚁内部怎么干(mo)活(yu)的?
废话不多说,我们先来看看效果。
一张图就能搞定中后台页面,简直是前端开发者的“懒人神器”!
首先,把图片切成几块,挑选出你想要生成代码的部分,然后狠狠地点击“生成代码”按钮!
接下来,选择你喜欢的技术栈和框架。
然后,坚定地点击“OK”,让代码生成的魔法开始发挥作用!
最后,放松等待几分钟,小茶时间结束后,你就能看到闪闪发光的代码和炫酷的效果预览啦!
这个代码有没有生成到你的“心趴”上呢?
不止中后台,移动端也能一键生成,简直是“码农的魔法棒”!🪄挥一挥,页面搞定了!
不满意怎么办?还能支持二次调整,让你秒变前端大神!
如果页面很大怎么办?让俺复刻一个 B 站的首页,从自动切图分区到代码生成,只需要几分钟的时间,原本需要花个把小时开发。
▍她叫 WeaveFox
这个工具叫什么呢?没错,就是 WeaveFox。
WeaveFox 是由蚂蚁前端团队自研的 AI 工具。是面向 AI 时代的前端智能研发平台,基于蚂蚁百灵多模态大模型打造,能够根据设计图直接生成前端源代码,为前端研发带来高质、高效、高产的研发体验。平台目前已支持控制台、移动端 H5、小程序、以及局部卡片等多种主流应用类型。
▍从图到码:技术揭底
WeaveFox 基于蚂蚁自研的百灵多模态模型构建,是具备细粒度 UI 理解能力的前端领域大模型,为前端开发提供了更精准的代码生成和优化能力。
信息来自「前端.AI」1122 体验技术日,链接里有详细的ppt可以阅读, https://www.yuque.com/weavefox/blog/1122
输入设计图,前端领域大模型会进行整稿 / 局部块推理的自动切分识别,得到页面语法结构。
其中建立的页面语法结构标准对 UI 信息原子组件定义本身也是合理完备的。
最后基于页面语法结构的布局树作为上下文配合模型矩阵完成高可读性和可维护性的业务代码生成:
▍结语
据说这款产品明年就会正式开放,如果你对这个产品感兴趣,可以加入产品交流群哦。
今天的内容就到这里,如果老铁觉得还行,可以来一波三连,感谢!