当 AI 编程助手从"对话框"走向"工作台",开发者的生产力将迎来质的飞跃。
我最初考虑设计它的原因是我订阅了不少token套餐,但是根据我的使用时间段,很多时候尤其是晚上套餐token被大量闲置,本着国人勤俭节约的精神,正好配合openclaw的24小时值守的能力,我想着是时候搞一个我的开发工作台来让他继续干活了。
它在解决什么问题
- 多端访问,我并不能一直守在电脑前,我需要我离开电脑后通过手机也能够继续执行任务。
- 多项目上下文隔离,有时我可能并不是单独执行一个项目的开发,这样也会有大量等待时间,我需要支持多项目并行。
- 自动化部署与访问,我必须要看到结果,当然有时我也需要它直接使我的项目上线。
- Agent定制化,可能我不同的项目需要使用不同的agent进行开发。
- ...
OpenClaw Workspace 核心目标:将分散开发流整合到统一 Web 界面,让 AI 深度嵌入开发每一环。
设计思路:以对话为中心,以项目为上下文
核心设计哲学:对话即开发。区别于传统无状态 AI 编程工具,我们引入「项目级会话隔离」,保障上下文清晰:
- 每个 GitHub 项目对应独立对话历史,自动携带项目标识
- 不同项目可配置专属 AI Agent,精准匹配开发需求
核心能力
1. AI 对话开发(核心功能)
基于 OpenClaw Gateway 兼容 API,实现流畅对话开发体验:
- SSE 实时流式输出,AI 回复逐字呈现,无需等待
- 多 Agent 动态调度,从 Gateway 接口获取,下拉选择即可
- 支持 /clear、/compact、/commit 等快捷斜杠命令
- 双重持久化:浏览器本地缓存(即时恢复)+ 服务端存储(跨设备同步)
2. GitHub 项目管理
浏览器内完成从克隆到编辑全流程,无需切换工具:
- GitHub 仓库列表拉取(10 分钟缓存,减少 API 调用)
- 一键 git clone 至服务端工作目录
- 文件树浏览 + Monaco Editor 在线编辑(VS Code 同款内核)
- 编辑内容直接保存至服务端文件系统
3. Vercel 一键部署
关联 GitHub 项目后,部署操作简单高效:
- 支持生产、预览两种部署模式
- 5 秒轮询实时展示部署进度,可视化清晰
- Webhook 接收部署状态变更,部署历史、构建日志、耗时全记录
4. 多 Agent 文档管理
便捷管理 AI Agent 的 Skills(技能)与 Memory(记忆)文件:
- Agent 动态加载,切换后自动刷新文件树
- Element Plus Tree 组件展示配置文件层级,支持展开/折叠
- Monaco Editor 编辑,支持 Markdown 高亮,保存自动同步
- 自动扫描 Node.js 全局目录,发现已安装 OpenClaw Skills
5. 统一配置中心
Web UI 可视化管理所有设置,无需手动编辑 .env 文件:
- 分类管理:OpenClaw / Vercel / GitHub / 系统设置
- 敏感信息加密存储(AES-256-GCM 加密 + PBKDF2 密钥派生)
- 1 分钟内存缓存,平衡安全与读取性能
- 环境变量兜底,零配置可启动;支持设置导入/导出,方便迁移备份
6. 多端适配与移动端体验
OpenClaw Workspace 从设计之初就考虑了多设备场景,实现了桌面端与移动端的双布局体系:
桌面端(768px 以上)采用三级导航结构:左侧图标栏 + 可折叠二级侧边栏 + 主工作区,最大化信息密度与操作效率。
移动端(768px 以下)则采用完全不同的交互范式:
- 底部 Tab 导航:固定在屏幕底部,高度 56px + iOS 安全区域适配,包含开发、菜单、文档、设置四个入口
- 抽屉式侧边栏:点击"菜单"Tab 从左侧滑出,宽度 320px(最大 90vw),复用桌面端相同的侧边栏组件,路由切换时自动收起
- 触摸反馈优化:所有可点击元素使用
active:scale-95触摸缩放反馈;通过 CSS@media (hover: none) and (pointer: coarse)媒体查询,在纯触屏设备上自动移除:hover效果,避免"粘滞悬停"问题
总结
以上就基本完成了跨设备的分配agent以隔离上下文的方式远程开发、部署以及agent管理的简单闭环。
主要在于思路分享,这个项目本身也是claudecode迭代的,事实上该项目也能够通过它自身的平台对话,操控openclaw来进行自进化。只需要指挥openclaw对该项目进行编码,然后按照我的要求进行重新部署即可,当前也是这样操作的。
关于开发相关的内容应该还有不少内容可以拓展,重点在于想象力的发挥了。
下一步我可能考虑在这个平台接入obsidian管理,实现个人知识库的积累,以更适合我的一种方式进行,如一些好的文章、知识记忆,甚至我家里的某个柜子里放了什么等等。