Hi, 我是程序员蓝莓,现在开发网站,app就是这4种方式。
第一种 自己画草图、高保真、开发代码。最传统。
第二种 AI设计高保真
第三种 AI生成页面 同时 AI还出代码。
第四种 AI生成页面、代码、部署上线。
今天我分享一些相关好的软件。总结一下,常见的开发流程和用到软件:
1.想要一句话生成并且部署上线的:bolt.new,GitHub Copilot。
2.一句话 就生成网页代码:免费用 v0.dev、aistuido、灵光、 秒搭、各大厂商AICoding。或者有额度的enter.pro,Locofy.ai。
3.逆向工程: Screenshot-to-Code-github、same.new、Builder.io。(注意知识产权事项)
4.生成设计稿图片:基础免费:gpt5 image 、谷歌的香蕉。或者有额度:Uizard 、Galileo Ai、MidJourney,html.to.design。
5.超好看的作品集:Dribbble、Mobbin。UI设计:Figma,墨刀。
1.优秀网站UI灵感 + 设计工具:
Dribbble(设计师作品)、Awwwards(最佳网页设计评选)、collectui(集合参考)、Land-book(设计灵感)、Behance(Adobe旗下的,高质量)、Mobbin(移动端)、
设计工具:Figma(Magician插件 基础版免费)、Sketch(Mac)、即时设计(国产的figma)、墨刀(modao.cc)、MasterGo,Uizard : 一个草图 就可以转为高保真
Excalidraw(在线的手绘)、Canva(手绘)relume.io可以拖拽,我认为很好用。
图标生成: 使用 Recraft.ai。动效生成: 使用 LottieFiles。文案生成: 使用 Relume Ipsum。
苹果设计指南:Design - Apple Developer,谷歌设计指南 Material 3,微软设计指南,fluent2.microsoft.design
这种适合高精度开发。UI设计 + 动画交互。
2.AI生成原型图
gpt5 image 模式。(基础纯免费)
谷歌的香蕉。(额度有限)
Uizard : 草图转为高保真很强。(额度有限)
Galileo Ai: 生成高保真(额度有限)
MidJourney
html.to.design: 输入网址,直接把现成网站变成 Figma 里的图层,连间距和字体都清清楚楚。(页面变成图层 额度有限)
3.AI直接生成代码:
aistuido: 谷歌的一句话可以生成的代码(完全免费)灵光:阿里的产品,一键可以生成代码。秒达等。(完全免费)
v0.dev:输入想法,直接生成代码 (额度有限,有点数限制,vercel旗下的产品)
enter.pro :一句话生成网站(额度有限)
same.new:输入网址,可以将网站还原成react。(有免费额度)
Builder.io: 输入 URL 提取组件,甚至能把别人网站的某个部分直接转成你需要的 React 代码。
Screenshot-to-Code-github:截个图直接生成代码。(自备key)
Locofy.ai:设计稿生成高质量代码。(额度有限)
4.AI生成代码还可以部署 agent。
lovable.dev: bolt.new(全自动开发)
GitHub Copilot.
Dribbble
Behance
Awwwards
Land-book
Mobbin / Screenlane:主要是做APP的。
collectui
enter.pro
v0.dev
Builder.io
same.new
aistuido
lovable.dev
GitHub Copilot.
以上有任何问题,欢迎在评论区指出。
后续我会继续分享关于AI下做产品、运营相关的信息。