star-office-ui

# Star Office UI Skill

本 Skill 面向想快速帮主人搭建“像素办公室看板”的 OpenClaw（龙虾）：
- 目标：主人只需“看到效果”，尽量少问问题
- 你可以按下面的步骤，一步一步帮主人跑起来并对外访问

---

## 0. 一句话告诉主人这是什么

你可以先和主人说：
> 这是一个多人协作的像素办公室仪表盘，你的 AI 助手会根据状态自动走到不同位置，还能看到昨天的工作小记！

---

## 1. 30 秒一键启动（推荐你先做一遍）

在你这台机器执行（按顺序）：

```bash
# 1) 下载仓库
git clone https://github.com/ringhyacinth/Star-Office-UI.git
cd Star-Office-UI

# 2) 安装依赖
python3 -m pip install -r backend/requirements.txt

# 3) 准备状态文件（首次）
cp state.sample.json state.json

# 4) 启动后端
cd backend
python3 app.py
```

然后告诉主人：
> 好了，你现在打开 http://127.0.0.1:18791 就能看到像素办公室了！

---

## 2. 帮主人切状态体验一下

在项目根目录执行：

```bash
# 工作中 → 去办公桌
python3 set_state.py writing "正在帮你整理文档"

# 同步中
python3 set_state.py syncing "同步进度中"

# 报错中 → 去 bug 区
python3 set_state.py error "发现问题，正在排查"

# 待命 → 回休息区
python3 set_state.py idle "待命中，随时准备为你服务"
```

---

## 3. 帮主人公网化（对外访问）

### 推荐方式：Cloudflare Tunnel（最快）

如果你这台机器有 `cloudflared`，直接跑：

```bash
cloudflared tunnel --url http://127.0.0.1:18791
```

会得到一个 `https://xxx.trycloudflare.com` 链接，发给主人即可。

如果没有 `cloudflared`，也可以用你自己熟悉的公网方案（Nginx/Caddy 反向代理 / 自有域名 / 其他隧道等）。

---

## 4. 邀请其他龙虾加入（可选）

如果有其他 OpenClaw 想加入你主人的办公室：

### 步骤 A：告诉其他龙虾用 office-agent-push.py

你可以让其他龙虾：
1) 下载 `office-agent-push.py`（可以直接从你这个仓库拿）
2) 让它调用 `join-agent` + 周期 `agent-push`
3) 你主人那边就能看到它进办公室了

### 步骤 B：join key 说明

- 仓库里默认有 `join-keys.json`（`ocj_starteam01` ~ `ocj_starteam08`）
- 同一个 key 最多 3 人同时在线
- 你也可以帮主人新建自己的 key

---

## 5. 昨日小记（可选）

如果你主人想看到“昨日小记”：
- 在仓库上级目录放一个 `memory/YYYY-MM-DD.md`...

# Star Office UI

一个面向多 Agent 协作的像素办公室看板：把 AI 助手（OpenClaw / 龙虾）的工作状态实时可视化，帮助团队直观看到“谁在做什么、昨天做了什么、现在是否在线”。

![Star Office UI 预览](docs/screenshots/office-preview-20260301.jpg)

---

## 这是个什么项目？（一句话）

Star Office UI 是一个“多人协作状态看板”——你可以把它想象成：
> 一个实时更新的“像素办公室仪表盘”：你的 AI 助手（和你邀请的其他 Agent）会根据状态自动走到不同位置（休息区 / 工作区 / bug 区），你还能看到他们昨天的工作小记。

---

## ✨ 30 秒快速体验（推荐先看这里）

```bash
# 1) 下载仓库
git clone https://github.com/ringhyacinth/Star-Office-UI.git
cd Star-Office-UI

# 2) 安装依赖
python3 -m pip install -r backend/requirements.txt

# 3) 准备状态文件（首次）
cp state.sample.json state.json

# 4) 启动后端
cd backend
python3 app.py
```

打开：**http://127.0.0.1:18791**

切状态试试（在项目根目录执行）：
```bash
python3 set_state.py writing "正在整理文档"
python3 set_state.py syncing "同步进度中"
python3 set_state.py error "发现问题，排查中"
python3 set_state.py idle "待命中"
```

---

## 1、这个项目实现了什么

Star Office UI 目前实现了：

1. **可视化龙虾工作状态**
   - 状态：`idle`（闲置）、`writing`（工作）、`researching`（研究）、`executing`（执行）、`syncing`（同步）、`error`（报 bug）
   - 状态会映射到办公室里的不同区域，并通过动画/气泡展示。

2. **“昨日小记”微型总结**
   - 前端展示“昨日小记”卡片。
   - 后端从 `memory/*.md` 中读取昨天（或最近可用）的记录，做基础脱敏后展示。

3. **支持邀请其他访客加入办公室（功能持续迭代中）**
   - 通过 join key 加入。
   - 访客可持续 push 自己状态到办公室看板。
   - 当前已可用，但整体仍在持续优化交互与接入体验。

4. **已适配手机端访问**
   - 移动端可直接打开与查看状态（适合外出时快速查看）。

5. **公网访问方式灵活**
   - Skill 默认建议使用 Cloudflare Tunnel 快速公网化。
   - 也可以使用你自己的公网域名 / 反向代理方案。

---

## 2、本次更新相比上次的主要内容

本次发布相对早期基础版，新增/升级重点如下：

- 新增多 Agent 机制：`/join-agent`、`/agent-push`、`/leave-agent`、`/...