从页面结构，到明确需求。
懒猿是低保真的原型设计工具。它帮助你表达页面的布局与行为，不负责生成最终界面样式。
1. 创建项目，保存链接
进入工作台填写项目名称即可创建，无需注册。请复制并保存项目链接。持有链接的人可以访问和编辑项目；链接遗失无法通过账号找回。
2. 在点阵上搭建页面
点击左侧组件，或右键画布空白处选择组件。位置按 4 像素半格移动，尺寸按 8 像素整格调整。双击组件编辑界面文字，方向键微调位置，⌘ / Ctrl + D 复制，Delete 删除。
新建页面时可选择 384 × 832 的手机竖屏或 1440 × 960 的桌面网页画布。同一项目可混用两种画布，创建后类型固定；大画布可在工作区内滚动查看。
页面可用单层文件夹整理。新建页面时选择所在文件夹，也可在页面设置中移动到其他文件夹或根目录。删除文件夹只将其中页面移回根目录，不删除页面；移动和重命名文件夹不影响画布内容或历史版本。
可以使用文本、按钮、输入框、区块、图片占位、功能区域、表格、列表、下拉选择、单选、多选和开关表达想法。只需调整整体大小、写简短文字和实现说明；表格不逐格填写，选择控件不配置选项，具体内容与规则写在说明里。
页面内容放不下时，可在“页面设置”将画布高度设为基础高度的 1～5 倍。宽度和组件大小不变；缩短前需先移走超出新边界的组件。高度会随自动保存、撤销与历史版本恢复，预览及 PNG 导出保留完整长画布。
3. 区分界面与说明
名称用于标识组件，例如“提交订单按钮”；界面文字是用户实际看到的“提交订单”；实现说明用来表达行为、条件与约束。
功能区域用虚线表达“这里需要一个商品列表”等结构意图，不是实际 UI，也不是容器。组件有实现说明后，会出现对应的编号。
项目顶部的“项目说明”用于记录背景、目标和业务规则，“设计说明”用于记录设计原则。两份文档分别点击保存，不受页面自动保存影响。
4. 检查预览
预览只显示当前页面画布，不包含说明栏。下载 PNG 与预览一致，保留完整画布及备注编号；说明文字单独保存。
5. 交给 Agent
通过MCP 接入教程连接 Codex，先读取项目说明和设计规范，再获取页面原型。每个页面一次返回一张图片和完整说明文本，通过编号对应，无需分页获取。页面修改会自动保存，Agent 下次获取时读取最新已保存内容。
保存页面版本
页面会自动保存当前编辑内容。完成一轮设计后，可以点击“保存版本”留档；之后通过“版本”预览历史页面，当前页面不会被替换。Agent 也能保存版本，并比较你后续修改了什么。历史预览中可点击“恢复此版本”，当前内容会留档。项目说明和设计说明每次保存都会留档，可在各自编辑窗口的“历史版本”中查看和恢复；页面版本不包含这两份文档。
保存与冲突
保存状态在顶部显示。保存失败时请先保留当前页面；若另一个窗口已经修改同一页面，系统会停止覆盖，并提示重新加载。页面和项目删除后无法恢复。