作为一名每天消耗上千美金费用的coder
分享下我跑通的完整AI coding SOP，纯自用心得分享
（附所有涉及到的资源地址）
需求阶段:
Gemini（产品经理gems） 这阶段用来聊需求、做PRD、明确产品逻辑
前端设计: 这里我有3套打法，全部分享给大家：
方案1: 设计稿生成 → Figma转代码
用Gemini nano banana/lovart/stitch 直接生成设计稿
让ai工具通过Figma MCP读取设计文件
官方仓库: http://github.com/figma/mcp-server-guide
Figma插件会在Dev Mode自动启动本地MCP服务器(127.0.0.1:3845)
方案2: 对标网站直接参考
找到对标网站截图
用Frontend Design Skill指导Claude生成代码
官方Skill: http://github.com/anthropics/claude-code
这个Skill会让Claude避开AI味的通用设计，做出有辨识度的界面
方案4: 专业设计系统UI UX Pro Max Skill
用UI UX Pro Max Skill
支持Claude/Cursor/Windsurf等多平台
仓库地址: http://github.com/nextlevelbuilder/ui-ux-pro-max-skill
内置设计系统生成器，可以按行业生成配色/字体方案
框架设计:
1.Claude Opus 4.5 Plan模式设计总体架构
2.Codex 把Opus的方案给Codex补充细节，再返回Claude生成完整骨架
细节填充:
1. 先用opus跑一遍，把基座跑出来
2.然后是Claude Sonnet完善框架
3.Codex修bug通常一遍过，修不好直接换模型就行
人工审阅:
1.感觉项目完成度差不多的时候，开启单元测试，针对于每个功能进行点对点测试
2.集成测试：整体按照用户旅程进行测试
这两步侧重点不同，缺一不可
编程工具推荐：
1.claude code-必备
2.codex-必备
3.cursor/trae/antigravity/kiro任意选配一个即可
分享完毕，大家有什么更好的方案欢迎补充
@aigc1024
分享下我跑通的完整AI coding SOP，纯自用心得分享
（附所有涉及到的资源地址）
需求阶段:
Gemini（产品经理gems） 这阶段用来聊需求、做PRD、明确产品逻辑
前端设计: 这里我有3套打法，全部分享给大家：
方案1: 设计稿生成 → Figma转代码
用Gemini nano banana/lovart/stitch 直接生成设计稿
让ai工具通过Figma MCP读取设计文件
官方仓库: http://github.com/figma/mcp-server-guide
Figma插件会在Dev Mode自动启动本地MCP服务器(127.0.0.1:3845)
方案2: 对标网站直接参考
找到对标网站截图
用Frontend Design Skill指导Claude生成代码
官方Skill: http://github.com/anthropics/claude-code
这个Skill会让Claude避开AI味的通用设计，做出有辨识度的界面
方案4: 专业设计系统UI UX Pro Max Skill
用UI UX Pro Max Skill
支持Claude/Cursor/Windsurf等多平台
仓库地址: http://github.com/nextlevelbuilder/ui-ux-pro-max-skill
内置设计系统生成器，可以按行业生成配色/字体方案
框架设计:
1.Claude Opus 4.5 Plan模式设计总体架构
2.Codex 把Opus的方案给Codex补充细节，再返回Claude生成完整骨架
细节填充:
1. 先用opus跑一遍，把基座跑出来
2.然后是Claude Sonnet完善框架
3.Codex修bug通常一遍过，修不好直接换模型就行
人工审阅:
1.感觉项目完成度差不多的时候，开启单元测试，针对于每个功能进行点对点测试
2.集成测试：整体按照用户旅程进行测试
这两步侧重点不同，缺一不可
编程工具推荐：
1.claude code-必备
2.codex-必备
3.cursor/trae/antigravity/kiro任意选配一个即可
分享完毕，大家有什么更好的方案欢迎补充
@aigc1024
