设计

构建并迭代前端设计

把设计稿和视觉参考变成可运行的界面,再在真实浏览器中验证结果,全程只需一段会话。

阅读约 5 分钟

没有规格文档,也能从截图落到代码

把截图、Figma 导出图,甚至一张粗略草图贴进 Onevium,再说明想做什么。Agent 会生成组件代码、套用项目的设计系统,并能在浏览器中打开结果,立即进行视觉验证。

这不是一次性生成一大段 HTML 就结束。它是一条迭代循环:你看到结果后说“把间距收紧”或“换掉这个图标”,Agent 会更新代码并刷新预览。

视觉检查闭合反馈循环

前端开发最难的并不是把代码写出来,而是确认代码最终生成了正确的像素。Onevium 的浏览器集成允许 Agent 截取渲染结果,并与原始参考图进行对比。

  • Agent 在浏览器中截取组件的当前状态。
  • 它把布局、间距和颜色与提供的参考图逐项比较。
  • 差异会在同一会话中被指出并修正,无需另加一轮人工 QA。

响应式不是口号,而是默认验证项

使用 resize 工具在手机、平板和桌面断点之间切换浏览器视口。Agent 会逐个尺寸检查、标记布局问题并调整 CSS,直到组件在三种宽度下都正常。得到的是经过实际测试的响应式代码,而不只是写下了响应式意图。