ai写代码随机拉大的,所以我准备给AI出一个设计规范

项目仓库:github.com/Id8fun/AIDe... 项目地址:aidesign.id8.fun/demo

最近在用Trae 和 cursor 写代码,真的是要气死我了,每次随机生成东西,接了figma mcp页老是自由发挥,然后我就在想有没有办法让他听话点,按照我的设计规范走,起码不要瞎几把发挥

当然理想是好的,现实是一些很小的交互他依然会遗漏

  • 我让他给我改一下多语言和颜色模式,他说改好了"然而并没有",虽然自己看代码能找到问题并准确描述,这个时间和我手动辱骂差不多,况且需要模拟纯白用户能够一键描述生成项目

改了很多版之后问题依然没有得到解决,然后他又跟我说好了

这个时候我已经逐渐暴躁了,经过多轮辱骂改好了

好了言归正传,我希望能最终实现的效果是,给提示词的时候只需要像这样,讲清楚功能需求,贴上设计规范后ai可以精准还原我的需求,最好是直接丢figma 给我1:1搞出来

作为产品是有非常强烈的需求希望能实现这样的效果,但是能力有限现在页只能先试验设计规范统一,前两天做了一个pdf转文档的工具,配色字体布局堪称完美

然后就按照这个项目抽离出来了一个ai的设计规范,创建项目时只需要输入 请使用ID8FUN设计规范创建[组件名称]: 设计规范:https://github.com/Id8fun/AIDesign-Guidelines.git 规范文件:AI-DESIGN-GUIDE.md 要求:严格按照规范创建,包含主题切换、多语言、响应式设计 ai根据项目内的核心文件 自动生成样式

  • AI-DESIGN-GUIDE.md
    • AI设计规范(必读) design-system.css
    • 完整样式系统 demo.html
    • 组件演示页面 design-config.json
    • 机器可读配置

不过说到底这也只是能力有限和技术不成熟的产物,只能用来临时解决问题,如果各位大佬有更好的思路清留言评论 期待有大佬可以出一个开发规范,可以实现全流程自动化 『doges』

相关推荐
尘中客1 小时前
放弃 Echarts?前端直接渲染后端高精度 SVG 矢量图流的踩坑记录
前端·javascript·echarts·前端开发·svg矢量图·echarts避坑
FreeBuf_2 小时前
Chrome 0Day漏洞遭野外利用
前端·chrome
小彭努力中2 小时前
199.Vue3 + OpenLayers 实现:点击 / 拖动地图播放音频
前端·vue.js·音视频·openlayers·animate
2501_916007472 小时前
网站爬虫原理,基于浏览器点击行为还原可接口请求
前端·javascript·爬虫·ios·小程序·uni-app·iphone
前端大波2 小时前
Sentry 每日错误巡检自动化:设计思路与上手实战
前端·自动化·sentry
Highcharts.js3 小时前
适合报表系统的可视化图表|Highcharts支持直接导出PNG和PDF
javascript·数据库·react.js·pdf
ZC跨境爬虫4 小时前
使用Claude Code开发校园交友平台前端UI全记录(含架构、坑点、登录逻辑及算法)
前端·ui·架构
慧一居士4 小时前
Vue项目中,何时使用布局、子组件嵌套、插槽 对应的使用场景,和完整的使用示例
前端·vue.js
叫我一声阿雷吧4 小时前
JS 入门通关手册(35):执行上下文、调用栈与作用域链深度解析
javascript·作用域链·js进阶·执行上下文·调用栈·变量提升·闭包原理
Можно4 小时前
uni.request 和 axios 的区别?前端请求库全面对比
前端·uni-app