各位大佬，小弟是一位交互设计师，现在领导分派了任务，要研究下运用 AI 技术实现设计稿转换为前端代码；
小弟毫无前端知识，完全没有方向。
求助各位大佬有没有一些开源的实现方案或者比较容易落地的实现路径啊？
不胜感激！！
不想砸谁的饭碗，也只是想完成任务而已！
真心求解答

你说的是可是这种类型？ github.com/abi/screenshot-to-code

github.com/abi/screenshot-to-code

v0.dev/

我正在搞这个方向，但是距离商用落地太遥远了。现有开源的 wandb/openui 、screenshot-to-code , 都是基于 GPT4 、Claude3 opus 来去做的。包括不开源的 v0.dev/ 。如果仅仅是基于 tailwind css 来去做的话，糊弄一下也能交差吧。

大佬方便加个地球号吗？ T05ldnNPTkUxMQ==

嗯嗯，很像

差不多就是这样的

感谢大佬啊

＃5 X 随便聊聊吧。

AI 可以的，我发一张截图，让他写代码。想作为商业落地估计有点难，只是很简单的 CURD 演示站，那么是可行的。

借楼 求一个 ，文字描述生成 设计稿的 网站

推荐试试这个，我们前不久有调研 www.imgcook.com/

ai 生成的代码，只能看看，但几乎不能用，问题比如：1. 实际上列表展示我们用的是数组+一个列表项组件 map 出来，ai 则是会把整个列表项都生成2. 如果要改动代码，我们要先理解 ai 生成的结构，ai 生成的代码虽然能看，但可能很复杂，尤其是包含了响应式或深色模式的时候3. ai 生成的所有组件都堆在一起，我们要手动拆封成一个个单独的组件4. 生成的图标需要用实际的图标库替换；生成的 ui （如按钮）需要用实际的 ui 库替换5. 修改颜色样式，比如我们可能有全局调色板，但生成的代码里，就直接把颜色代码放上来了。。。

什么意思啊大佬

这种吗？云音乐 D2C 设计稿转代码建设实践 segmentfault.com/a/1190000044514340来源：魏慷 网易云音乐技术团队 music.163.com/st/seal

这不是前端团队的活么，这是什么垃圾领导

twitter 吧

加油。搞定之后前端的活也是你的了。

AI 最多生成 60 分的代码，没法直接使用

v0.dev 还是非常厉害的，其实我想要的是 vue3 的代码，不然我真的会下单买，我试过了，那个图片生成代码质量还是非常高的。

要到能用的程度,得能指定框架(react+nextjs, vue2/vue3 等)+指定 UI 库(antd, elementPlus,vant 等), 有良好的组件拆分和架构设计. 搓个静态页面意义不大. 题外话, 现在有靠谱的网页 AI 设计稿么.

github.com/abi/screenshot-to-code

github.com/abi/screenshot-to-code ，这个方案依赖的大模型好像都是要收费的

这个好炫酷

告诉你们领导，这个超纲了