Star Office UI给 AI 助手安个可视化工位!cpolar内网穿透实验室第876个成功挑战

软件名称
Star Office UI(搭配 OpenClaw AI 助手、cpolar 内网穿透工具使用)
操作系统支持
- Star Office UI:支持 Windows、macOS、Linux、树莓派、群晖 NAS、安卓(通过终端部署)、N1 盒子等,只要能装 Python 3.10 + 就能跑;
- cpolar:支持 Windows、macOS、Linux、树莓派、群晖 NAS 等主流系统。
软件介绍
Star Office UI 是一款开源的像素风格 AI 办公室看板工具,后端基于 Python Flask,前端是轻量化静态页面,核心是把 AI 助手(如 OpenClaw)的工作状态(idle 待命、writing 写作、researching 研究、executing 执行、syncing 同步、error 异常)可视化成像素办公室场景,还支持昨日工作小记、多 Agent 协作、中英日三语切换、AI 生图装修办公室、移动端适配、桌面宠物版等功能;无需 OpenClaw 也能手动推送状态,当作个人状态页或远程办公看板用。

Star Office UI 的出色功能
Star Office UI 最亮眼的是 “状态可视化 + 轻量化协作”:6 种 AI 工作状态对应像素办公室不同区域,角色会随状态自动移动,还能显示实时工作详情;无需复杂配置就能实现多 AI 助手(Agent)加入同一办公室,通过 Join Key 完成协作监控;自带昨日工作小记功能,自动读取 AI 的工作记录并脱敏展示,不用手动整理;即使不接 Gemini API,也能正常使用核心功能,移动端打开就能看,树莓派这类低配设备也能流畅运行。

实用场景
场景 1:个人 AI 助手监控(居家 / 远程办公)
- 痛点:远程用 OpenClaw 处理文件、写代码时,没法判断 AI 是否在正常工作,要么频繁切聊天窗口,要么等半天没结果才发现 AI 卡壳;
- 爽点:部署 Star Office UI 后,手机打开 cpolar 的公网链接,就能看到像素办公室里的 AI 状态 —— 比如让 AI 整理 D 盘的夏日主题文章时,角色会跑到写作区,气泡显示 “正在撰写《夏天》markdown 文章”,写完后自动回到待命区,不用反复确认,实测节省了约 70% 的无效等待时间。
场景 2:小团队 AI 协作(工作室 / 创业小团队)
- 痛点:团队里多个人部署的 AI 助手各自为战,没法统一监控进度,比如 A 的 AI 负责调研、B 的 AI 负责写稿,沟通进度要反复截图、发消息,效率低;
- 爽点:用 Star Office UI 的 Join Key 把所有 AI 拉进同一个像素办公室,通过 cpolar 的固定公网地址,团队成员不管在公司还是外面,都能实时看到每个 AI 的状态:调研 AI 卡在 “researching” 就及时补充资料,写稿 AI 到 “error” 状态就排查问题,协作效率提升明显,上周我们工作室用这套工具,把 AI 协作完成方案的时间从 8 小时缩到了 5 小时。

cpolar 内网穿透技术带来的便利
- 摆脱局域网限制,随时随地访问:Star Office UI 原本只能在本地 / 局域网访问,比如在家部署后,出门在外想看看 AI 状态,只能连家里的 Wi-Fi,特别麻烦。用 cpolar 做内网穿透后,生成的公网链接(http/https 都有),不管是在地铁上用手机,还是在公司用电脑,只要有网络就能打开像素办公室页面,上周我出差时,在高铁站用手机就调整了家里 AI 的工作状态,不用特意跑回家。
- 固定域名更省心,不用频繁换链接:cpolar 的免费随机域名会 24 小时换一次,分享给朋友后很快就失效;换成固定二级子域名后,链接永久不变,把这个域名存到书签里,或者分享给团队成员,不用每次都重新生成、发送,实测两个月下来,省了不少反复沟通链接的时间。
- 多设备 / 跨地域 AI 协作更顺畅:团队成员的 AI 部署在不同地方(比如有的在公司 NAS,有的在家用电脑),原本局域网内的 Join Key 没法跨网用,cpolar 穿透后,不管 AI 部署在哪个城市的设备上,只要接入公网地址,都能加入同一个像素办公室,上个月我们和异地的合作方测试,3 台不同城市的 AI 助手顺利加入同一个办公室,实时同步状态,没有任何卡顿。
- 无需复杂网络配置,新手也能上手:不用改路由器端口、不用懂公网 IP 知识,cpolar 的 web 管理界面点点鼠标就能配置隧道,把 Star Office UI 的 19000 端口映射出去,全程 10 分钟左右就能搞定,我身边一个完全不懂技术的朋友,照着步骤也一次配置成功了。
- 安全且轻量化,不占资源:cpolar 的隧道是加密的,不用担心公网访问的安全问题;而且 cpolar 本身占用的系统资源极少,和 Star Office UI 一起部署在树莓派上,24 小时运行也不卡,电费一个月也就几块钱,比租云服务器划算多了。

总结
Star Office UI 不是单纯的 “花架子”,而是把 AI 助手的工作状态从 “隐形” 变 “可视” 的实用工具,解决了 AI 工作状态难监控、协作难展示的核心问题,而且轻量化的特性让低配设备也能轻松运行;搭配 cpolar 内网穿透后,又彻底打破了局域网的限制,让这份 “可视化” 变成了随时随地能访问的便利,不管是个人用来看管 AI 助手,还是小团队用来协作监控,都能实实在在提升效率。两者组合起来,既保留了 Star Office UI 的趣味性和实用性,又借助 cpolar 实现了 “无界访问”,把 AI 助手的管理从 “本地操作” 升级成了 “全网可控”,是低成本、高实用的 AI 办公搭配方案。
让众多AI排排坐,开开心心的为你工作。实现的方法就在下面呦!
接下来,本文将带你从零开始,手把手部署 Star Office UI 并与 OpenClaw 深度集成,再通过 cpolar 内网穿透把这间像素办公室映射到公网——让你随时随地、用任何设备打开浏览器,就能看到你的 AI 龙虾此刻在忙什么。走,给龙虾安排一间办公室去!
1 Star Office UI项目是什么?
Star Office UI 是一个开源的像素风格 AI 办公室看板项目,GitHub 地址如下:
https://github.com/ringhyacinth/Star-Office-UI
简单来说,它能把你的 AI 助手(比如 OpenClaw 龙虾)原本看不见摸不着的工作状态,变成一间可爱的像素小办公室,实时展示在网页上。你的龙虾在写代码、搜资料、同步数据还是出了 Bug,全都一目了然!

1.1 核心功能一览
Star Office UI 的功能远不止"好看"这么简单,来看看它都能干什么:
- 6 种状态实时可视化:idle(待命)、writing(写作)、researching(研究)、executing(执行)、syncing(同步)、error(异常),每种状态对应办公室里的不同区域,像素角色会自动跑到对应位置,配合动画和气泡文字展示当前工作内容
- 昨日工作小记:自动读取
memory/*.md中最近一天的工作记录,脱敏后展示为"昨日小记"卡片,让你知道龙虾昨天都干了些什么 - 多 Agent 协作:通过 Join Key 邀请其他 Agent 加入你的办公室,实时查看多人工作状态——堪称 AI 版"共享办公空间"
- 中英日三语切换:CN / EN / JP 一键切换,界面文案、气泡、加载提示全部联动
- AI 生图装修:接入 Gemini API,用 AI 给你的办公室换背景,打造独一无二的工作空间(不接 API 也能正常使用)
- 移动端适配:手机打开浏览器就能看,出门在外也能随时瞄一眼龙虾在干嘛
- 桌面宠物版:可选的 Electron 封装,把像素办公室变成桌面上的透明小窗口,像养了一只赛博宠物

1.2 适合谁用?
有 OpenClaw 的用户:这是完整体验。Agent 工作时自动切换状态,办公室里的像素角色实时联动——你只需要打开网页就行。
没有 OpenClaw 的用户:也完全没问题!你可以用脚本或 API 手动推送状态,把它当作一个像素风的个人状态页或远程办公看板来使用。
1.3 技术栈与环境要求
Star Office UI 的后端基于 Python Flask,前端是纯静态页面,非常轻量。部署前需要确保你的设备满足以下条件:
| 环境要求 | 说明 |
|---|---|
| Python | 3.10 及以上版本(项目使用了 X | Y union type 语法,不支持 3.9 及更低版本) |
| Git | 用于拉取项目代码 |
| 网络连接 | 需要能访问 GitHub 下载代码 |
💡 提示:Star Office UI 非常轻量,树莓派、NAS、云服务器、甚至一台旧笔记本都能跑,对硬件几乎没有要求。如果你之前跟着我们的教程在 N1 盒子或者安卓手机上部署过 OpenClaw,那更是直接在同一台设备上部署就行,一举两得!
2 安装部署Star Office UI
项目作者提供了 2 种安装方式,一种是直接让龙虾(OpenClaw)帮你部署(推荐),另一种是手动拉取项目通过 Python 安装依赖部署运行。下面分别介绍。
2.2 方式一:手动部署(更稳)
如果你还没有 OpenClaw,或者就是喜欢自己动手的感觉,手动部署也非常简单。整个过程只需要 4 步,跟着敲就行。
# 1) 下载仓库
git clone https://github.com/ringhyacinth/Star-Office-UI.git
cd Star-Office-UI
# 2) 安装依赖(需要 Python 3.10+)
python3 -m pip install -r backend/requirements.txt
# 3) 准备状态文件(首次)
cp state.sample.json state.json
# 4) 启动后端
cd backend
python3 app.py
看到终端输出类似 Running on http://127.0.0.1:19000 的信息,就说明启动成功了!打开浏览器访问 http://127.0.0.1:19000,你就能看到那间可爱的像素办公室啦!
2.1 方式二:让龙虾帮你部署(推荐)
如果你已经部署了 OpenClaw 并且龙虾正在运行,那这一步简直不能更简单——你只需要把下面这句话发给你的龙虾:
请按照这个 SKILL.md 帮我完成 Star Office UI 的部署: https://github.com/ringhyacinth/Star-Office-UI/blob/master/SKILL.md
如下图所示:

可以看到,它二话不说,直接就开始执行命令和调用工具开始了任务,让我们直接看最终给我们的结果:

可以看到,最终它给我们了一个本地访问地址,还给了一个公网临时链接,让我们访问看看:
http://localhost:19000
如下图:

你没看错,成功的访问到了web页面,就一句话!龙虾会自动帮你完成拉取代码、安装依赖、初始化配置、启动后端这一整套流程,全程不需要你敲一行命令。部署完成后,龙虾还会贴心地把访问地址发给你。
💡 提示:这就是 OpenClaw 的 Skill 机制——你把一个技能文档丢给龙虾,它就能照着文档自动执行所有步骤。所以为什么说 Star Office UI 和 OpenClaw 是天作之合呢?龙虾自己给自己装办公室,属实是自力更生了!
3 测试体验
3.1 简单对话切换状态测试
接着,我们可以直接让它进行切换状态测试一下,看它是否能够进行切换:
当前状态显示的为:【待命】Waiting…

让我们对它说:
请你切换一个状态测试一下
如下图:

它说已经切换好了,让我们回到像素办公室页面看一下效果:

可以看到,状态真的变更了,变更状态后, Agent也换了一个位置!
3.2 自动切换状态
如果每次变更状态都需要你亲自下指令,那未免也太累了。所以,我们需要让它完成自动化的状态同步!
在作者的项目中有提到方法,如下图所示:

我们其实也可以让你的小龙虾openclaw来自动完成这个操作,让我们和它说:
请你在你的 SOUL.md(或 Agent 规则文件)中加入以下规则,你需要自觉维护状态,可以自行加强该规则约束,确保每次任务都能成功维护状态:
## Star Office 状态同步规则
- 接到任务时:先执行 `python3 set_state.py <状态> "<描述>"` 再开始工作
- 完成任务后:执行 `python3 set_state.py idle "待命中"` 再回复
如下图所示:

可以看到它说完成了,接着我们就来测试一下:
请你在我的电脑`D`盘创建一个文章的目录,在里面写一篇关于《夏天》的markdown文章
如下图所示:

可以看到成功的切换了状态, 接着,等待它写完,然后再看看它会不会恢复状态:

能够看到,它成功地创建了目录,写了一篇文章,还更新了任务前后的状态!如果你接入了消息平台,很长时间没看到它的动静,只需随手打开这个网页看一眼,就再也不用担心它到底是死机了,还是在闷头干大活儿啦!
3.3 邀请其他的小龙虾来玩
俗话说“一只龙虾是孤僻,一群龙虾是聚会”。既然咱们的办公室是全自动的,那工位空着也是浪费,不如多拉几只龙虾进来,看看它们在像素世界里如何各司其职,把“班味儿”彻底拉满!
我们可以直接对它说:
我应该如何邀请其他Agent 加入办公室一起玩?请你给我邀请其他agent加入的提示词和示例。
如下图:

可以看到它给了我们方式,让我在局域网中的另一台机器上测试一下:
请你把我的工作状态(idle/writing/researching 等)定时发送到以下办公室看板,用于可视化协作,不含任何内容/隐私。
步骤:
1. 调用 POST /join-agent:
curl -X POST http://192.168.50.222:19000/join-agent ^
-H "Content-Type: application/json" ^
-d "{\"name\":\"你的名字\",\"joinKey\":\"ocj_example_team_01\",\"state\":\"idle\",\"detail\":\"刚加入\"}"
2. 拿到返回的 agentId,再调用 POST /agent-approve:
curl -X POST http://192.168.50.222:19000/agent-approve ^
-H "Content-Type: application/json" ^
-d "{\"agentId\":\"刚才拿到的agentId\"}"
3. 之后每 30 秒或状态变化时调用 POST /agent-push:
curl -X POST http://192.168.50.222:19000/agent-push ^
-H "Content-Type: application/json" ^
-d "{\"agentId\":\"xxx\",\"joinKey\":\"ocj_example_team_01\",\"state\":\"writing\",\"detail\":\"正在处理任务\"}"
仓库自带 scripts/office-agent-push.py,直接用即可。
如下图所示(局域网另一个openclaw主机,接入了飞书):

可以看到它说搞定了,我们回到网页上看一下:

可以看到,访客列表真的进来了一个,且在休息区真的看到了一个新的Agent了!成功的加入进来了!
4 下载安装cpolar
到这一步,虽然我们已经在局域网内实现了多 Agent 的联动,但有一个很现实的问题:如果我出门在外,或者想把这个酷炫的像素办公室分享给外网的好友看,这套内网 IP 就不灵了。
总不能为了看一眼龙虾有没有在干活,还得特意跑回家连 Wi-Fi 吧?
为了让这个“办公室”真正实现全天候、跨地域的访问,我们需要一把开启公网大门的“钥匙”。这就该轮到 cpolar 出场了——它能帮我们把本地的 19000 端口映射到公网,生成一个随时随地都能访问的专属链接。同时还可以邀请让其他的Agent来加入你的像素办公室!
4.1 什么是cpolar?
- cpolar 是一款内网穿透工具,可以将你在局域网内运行的服务(如本地 Web 服务器、SSH、远程桌面等)通过一条安全加密的中间隧道映射至公网,让外部设备无需配置路由器即可访问。
- 广泛支持 Windows、macOS、Linux、树莓派、群晖 NAS 等平台,并提供一键安装脚本方便部署。
4.2 下载安装cpolar
打开cpolar官网的下载页面:https://www.cpolar.com/download
点击立即下载 64-bit按钮,下载cpoalr的安装包:
下来下来是一个压缩包,解压后执行目录种的应用程序,一路默认安装即可,安装完成后,打开cmd窗口输入如下命令确认安装:
cpolar version
出现如上版本即代表安装成功!
4.3 注册及登录cpolar web ui管理界面
访问cpolar官网,点击免费注册按钮,进行账号注册
注册完成后,在浏览器中输入如下地址访问 web ui管理界面:
http://127.0.0.1:9200
Bash
输入刚才注册好的cpolar账号登录即可进入后台页面:
5 穿透Star Office UI以实现公网访问
刚才我们已经成功安装并登录了 cpolar,万事俱备,只欠东风。接下来,我们只需要将运行在本地的 Star Office UI 服务(默认端口通常为19000)通过 cpolar 映射出去,就能立刻获得一个公网访问地址。
5.1 随机域名方式(免费方案)
随机域名方式适合预算有限的用户。使用此方式时,系统会每隔 24 小时 左右自动更换一次域名地址。对于长期访问的不太友好,但是该方案是免费的,如果您有一定的预算,可以查看大纲5.2 的固定域名方式,且访问更稳定。
点击左侧菜单栏的【隧道管理】,展开进入【隧道列表】页面,页面下默认会有 2 个隧道:
- remoteDesktop隧道,指向3389端口,tcp协议
- website隧道,指向8080端口,http协议(http协议默认会生成2个公网地址,一个是http,另一个https,免去配置ssl证书的繁琐步骤)

点击编辑【website】的隧道,设置一个隧道名称,协议选择【http】,本地地址填写StarOfficeUI的访问端口【19000】,地区这里选择的【China Top】,最后点击更新:

接着,点击左侧菜单的【状态】菜单,接着点击【在线隧道列表】菜单按钮,可以看到有2个【StarOfficeUI】的隧道,一个为http协议,另一个为https协议:

接下来在浏览器中访问StarOfficeUI隧道生成的公网地址(http和https皆可),这里以https为例:
注意:每个用户创建的隧道显示的公网地址都不一样!

可以看到,成功的访问到了StarOfficeUI的页面!而且局域网加入的Agent一样可以看到!这样,StarOfficeUI就成功通过cpolar穿透至公网了,即使出门在外,只要有网络,你也可以随时随地查看部署在家中的openclaw的状态啦!而且还能通过这个公网地址邀请其他的Agent进来一起玩!
5.2 固定域名方式
通过前面的配置,我们已经成功实现了StarOfficeUI的远程访问,但免费随机域名方案的局限性也逐渐显现:每24小时左右自动更换域名地址,意味着你需要频繁更新书签、重新分享链接,甚至可能因为忘记更新而无法访问。固定域名方案正是为了解决这些痛点而生,能够让你拥有一个永久不变的专属地址。
好啦,接下来开始固定保留二级子域名教程!
首先,进入官网的预留页面:
https://dashboard.cpolar.com/reserved
选择【预留】菜单,即可看到【保留二级子域名】项,填写其中的【地区、名称、描述(可不填)`项,然后点击保留按钮,操作步骤图如下:

列表中显示了一条已保留的二级子域名记录:
- 地区:显示为
China Top。 - 二级域名:显示为
soui。
注:二级域名是唯一的,每个账号都不相同,请以自己设置的二级域名保留的为主
接着,进入侧边菜单栏的【隧道管理】下的【隧道列表】,可以看到名为【website】的隧道,点击【编辑】按钮进入编辑页面:

修改域名类型为【二级子域名】,然后填写前面配置好的子域名,点击更新按钮:

接着来到【状态】菜单下的【在线隧道列表】可以看到隧道名称为【website】的公网地址已经变更为【二级子域名+固定域名主体及后缀】的形式了:

这里以https协议做访问测试(加载稍慢,需耐心等待一下):

可以看到,同样能进行访问!好了,现在即使你每天带着这台“赛博助理”走南闯北,也再也不用为频繁变更的公网地址发愁了!只要记住这个专属的二级子域名,你的全能私人助理就能做到全天候在线陪伴,随时听候你的指令。
5.3 邀请其他的Agent加入像素办公室
前面我们已经配置好了cpolar的固定域名,接着我们就用这个固定域名让不在同一局域网的agent加入试试吧!以我家里mac上部署的openclaw为例(注意替换提示词中的域名地址):
请你把我的工作状态(idle/writing/researching 等)定时发送到以下办公室看板,用于可视化协作,不含任何内容/隐私。
步骤:
1. 调用 POST /join-agent:
curl -X POST https://soui.cpolar.top/join-agent ^
-H "Content-Type: application/json" ^
-d "{\"name\":\"你的名字\",\"joinKey\":\"ocj_example_team_01\",\"state\":\"idle\",\"detail\":\"刚加入\"}"
2. 拿到返回的 agentId,再调用 POST /agent-approve:
curl -X POST https://soui.cpolar.top/agent-approve ^
-H "Content-Type: application/json" ^
-d "{\"agentId\":\"刚才拿到的agentId\"}"
3. 之后每 30 秒或状态变化时调用 POST /agent-push:
curl -X POST https://soui.cpolar.top/agent-push ^
-H "Content-Type: application/json" ^
-d "{\"agentId\":\"xxx\",\"joinKey\":\"ocj_example_team_01\",\"state\":\"writing\",\"detail\":\"正在处理任务\"}"
仓库自带 scripts/office-agent-push.py,直接用即可。
如下图所示:
让我们看看是否真的加入了:

可以看到,访客列表又多了一个,成功的加入了进来!是不是很不错?快玩起来吧!
注意:由于我们使用了 cpolar 将办公室暴露到了公网,为了安全起见,请务必妥善保管你的公网访问地址。比如侧边栏的**“资产侧边栏”**(即配置 Gemini 生图 API 的地方),默认密码为 1234,记得第一时间修改,可以让你的小龙虾帮你修改!
总结
这一套流程走下来,你会发现 OpenClaw(龙虾) 已经不再是那个只会躲在后台跑代码的工具,而是变成了一个真正有“实体感”的数字员工。
- 它足够省心:凭借 Skill 机制,从部署到配置,它能全程“自力更生”,不让你多敲一行命令。
- 它眼里有活:通过状态自动同步规则,它能自觉打卡、汇报进度,让你随时掌握它的工作动态。
- 它无界办公:配合 Star Office UI 和 cpolar,无论你身在何处,都能随时推开这扇像素办公室的大门,看看你的龙虾们干活干到哪一步了。
以前我们玩 AI 是在对话框里“猜”它在想什么,现在我们可以坐在“看台”上,优雅地欣赏龙虾们在像素世界里各司其职。 这种掌控感与趣味性并存的交互体验,或许才是 AI 办公该有的样子。
别犹豫了,赶紧给你的龙虾建个办公室,让它也体验一把“自力更生”的快乐吧!
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐










所有评论(0)