在 VibeCoding 的时候,对于 AI 直接生成的一整个成果,经常会有很多修改意见想说,但是这时候只能手敲超级长的修改字符,例如“右上角那个按钮再往左一点”、“这个卡片大一些”、“这里的颜色不对”——和 AI 一起改界面时,想法很清楚,却常常要花很多文字解释位置与范围,甚至还可能不够准确。
这也是我自己经常遇到的问题,基于这个问题,我开发了一个小工具——EditHere (改这里),他的作用就是让你直接针对页面截图进行标注、修改甚至移动组件的位置。最后将批注一起转为格式化 JSON 文本,直接粘贴给 AI 就可以让 AI 准确理解你的意图(其实跟人沟通也可以用)
以下是使用方法:
1.让你的 AI Agent 帮你安装EditHere( https://github.com/Inginnng/EditHere )
2.在你的项目中说“用 EditHere 帮我标注主页面”或者打开你的项目之后使用 EditHere 截图
3.在 EditHere 中进行批注:
- 点批注:点哪批注哪里
- 框批注:自动识别矩形元素,直接点击批注,也可以手动画框
- 大爆炸:直接将识别的矩形元素全部切分,可以移动矩形元素,将会记录移动前后的位置
4.批注完成后,直接复制 JSON ,然后发送给 AI ,结束!
目前还没 Paypal ,所以无法传图片进行示意,非常抱歉!本身我也是 VibeCoding 爱好者,希望我的工具可以帮助到大家,如果有什么问题也烦请大家进行反馈,我一定及时处理!打扰大家了,谢谢大家!!