自动化与AI助手 · 工具介绍
Onlook
在 Next.js 与 Tailwind 代码上进行可视化编辑，并结合 AI 制作网站与交互原型。
Onlook 能做什么
在 Next.js 与 Tailwind 代码上进行可视化编辑，并结合 AI 制作网站与交互原型。
- 网站与应用原型构建
如何使用 Onlook
可视化修改网站原型
准备输入
- Next.js项目
- 页面修改要求
操作步骤
- 打开需要调整的 Next.js 与 Tailwind 项目，在可视化画布中定位元素。
- 直接修改布局和样式，查看对应代码如何变化。
- 在不同页面状态下检查效果与代码差异，再保留符合需求的修改。
预期交付物
- 页面代码变更
- 交互原型
检查响应式布局、代码差异和实际交互。
开始前需要了解
账号权限、费用与可用功能请以官方入口的当前说明为准。重要结果应先检查，再用于实际工作。
从自动化与AI助手角度评估Onlook
把自动化与AI助手需要的条件列清楚，再比较工具。阅读本页的产品用途、步骤与限制，再逐项确认下面的问题；这些是选型方法，不表示每款工具都具备同样能力。
触发是否明确
写清事件来源、必要字段和重复事件的识别方式。
权限是否够用
只连接完成任务所需的账户与范围；真实操作由有权人员确认。
失败是否可见
保留结果状态和接手人，不能把重试次数当成完成次数。
选择一个小样任务，先检查结果与交付格式，再决定是否用于更多资料。
