VisCtrl 指南
如何可视化修改 AI 生成的网站？
先保留 AI 已生成网站的代码作为实现基础，再在 VisCtrl 中表达需要改变的页面结构和组件参数。导出修改后的设计上下文交给 AI，让它针对现有代码实施，而不是让 VisCtrl 直接编辑生产代码。
先确定你要修改什么
- 结构：区块顺序、导航、栏位和父子关系；
- 布局：组件位置、尺寸、对齐和间距；
- 视觉：颜色、字体、圆角、边框和透明度；
- 内容：标题、按钮文字、图片和表单字段；
- 行为：按钮目标、搜索范围、提交结果和响应式显示。
推荐的正向流程
- 尽量让 AI 的初版使用可理解的 HTML/CSS 和清晰组件结构。
- 在 VisCtrl 中建立与目标页面对应的视觉设计。
- 只修改需要变化的区块，必要时使用单区块导出。
- 把导出资料与现有代码仓库一起交给 AI。
- 要求 AI 保留未被指定修改的功能，并在完成后对照视觉参考。
为什么不建议反复重新导入复杂网站？
现代项目可能包含运行时组件、框架状态、第三方依赖和动态数据。VisCtrl 不执行完整应用代码，也不是通用浏览器到设计文件转换器。对复杂网站，更稳定的做法是保持 VisCtrl 设计稿作为视觉事实来源，让 AI 把更新应用到代码。
如何处理局部修改？
如果只修改导航栏或某个 CTA，可以选中对应区块导出单区块资料。这样 AI 更容易识别修改范围，也避免把整个网站误解为需要重写。
边界
VisCtrl 不直接修改 Git 仓库、运行后端逻辑或部署网站。交互实现、数据请求、权限与业务状态仍由开发代码和 AI 编程工具处理。