这是一个创建于 367 天前的主题，其中的信息可能已经有所发展或是发生改变。
各位大佬，小弟是一位交互设计师，现在领导分派了任务，要研究下运用 AI 技术实现设计稿转换为前端代码； 小弟毫无前端知识，完全没有方向。 求助各位大佬有没有一些开源的实现方案或者比较容易落地的实现路径啊？ 不胜感激！！ 不想砸谁的饭碗，也只是想完成任务而已！ 真心求解答
 |
1
noahlias 2024-04-17 14:54:20 +08:00
|
 |
2
kaktos 2024-04-17 14:54:50 +08:00
|
 |
3
hxzhouh1 2024-04-17 15:00:14 +08:00
|
 |
4
tianzx 2024-04-17 15:01:52 +08:00
我正在搞这个方向，但是距离商用落地太遥远了。现有开源的 wandb/openui 、screenshot-to-code , 都是基于 GPT4 、Claude3 opus 来去做的。包括不开源的 https://v0.dev/ 。如果仅仅是基于 tailwind css 来去做的话，糊弄一下也能交差吧。
|
 |
10
tool2dx 2024-04-17 15:22:38 +08:00
AI 可以的，我发一张截图，让他写代码。
想作为商业落地估计有点难，只是很简单的 CURD 演示站，那么是可行的。 |
 |
11
183387594 2024-04-17 15:37:42 +08:00
借楼 求一个 ，文字描述生成 设计稿的 网站
|
 |
12
bearbig43 2024-04-17 16:03:54 +08:00
推荐试试这个，我们前不久有调研 https://www.imgcook.com/
|
 |
13
IndieYe 2024-04-17 16:05:42 +08:00  2
ai 生成的代码，只能看看，但几乎不能用，问题比如：
1. 实际上列表展示我们用的是数组+一个列表项组件 map 出来，ai 则是会把整个列表项都生成 2. 如果要改动代码，我们要先理解 ai 生成的结构，ai 生成的代码虽然能看，但可能很复杂，尤其是包含了响应式或深色模式的时候 3. ai 生成的所有组件都堆在一起，我们要手动拆封成一个个单独的组件 4. 生成的图标需要用实际的图标库替换；生成的 ui （如按钮）需要用实际的 ui 库替换 5. 修改颜色样式，比如我们可能有全局调色板，但生成的代码里，就直接把颜色代码放上来了 。。。 |
 |
15
epiphyllum 2024-04-17 16:47:11 +08:00
这种吗？
云音乐 D2C 设计稿转代码建设实践 https://segmentfault.com/a/1190000044514340 来源：魏慷 网易云音乐技术团队 https://music.163.com/st/seal |
 |
16
qingyingwan 2024-04-17 20:13:40 +08:00
这不是前端团队的活么，这是什么垃圾领导
|
 |
18
kneo 2024-04-17 23:45:52 +08:00
加油。搞定之后前端的活也是你的了。
|
 |
19
qsnow6 2024-04-18 00:41:09 +08:00
AI 最多生成 60 分的代码，没法直接使用
|
 |
20
xhawk 2024-04-18 06:46:24 +08:00 via Android
v0.dev 还是非常厉害的，其实我想要的是 vue3 的代码，不然我真的会下单买，我试过了，那个图片生成代码质量还是非常高的。
|
 |
21
lujiaosama 2024-04-18 09:33:31 +08:00
要到能用的程度,得能指定框架(react+nextjs, vue2/vue3 等)+指定 UI 库(antd, elementPlus,vant 等), 有良好的组件拆分和架构设计. 搓个静态页面意义不大.
题外话, 现在有靠谱的网页 AI 设计稿么. |
 |
22
oldjohn OP |
|
23
oldjohn OP https://github.com/abi/screenshot-to-code ，这个方案依赖的大模型好像都是要收费的
|
 |
25
dayeye2006199 2024-04-18 13:26:00 +08:00
告诉你们领导，这个超纲了
|
 |
26
glouhao 358 天前 via Android
还有没有支持 bootstrap 的
|
Select Language