A pixel office for your OpenClaw: turn invisible work states into a cozy little space with characters, daily notes, and guest agents. Code under MIT; art assets for non-commercial learning only.
Find a file
2026-02-26 11:13:57 +08:00
backend Remove runtime pid/log files 2026-02-26 11:13:57 +08:00
frontend Initial open-source release 2026-02-26 11:13:51 +08:00
.gitignore Initial open-source release 2026-02-26 11:13:51 +08:00
LICENSE Initial open-source release 2026-02-26 11:13:51 +08:00
README.md Initial open-source release 2026-02-26 11:13:51 +08:00
set_state.py Initial open-source release 2026-02-26 11:13:51 +08:00
SKILL.md Initial open-source release 2026-02-26 11:13:51 +08:00
state.sample.json Initial open-source release 2026-02-26 11:13:51 +08:00

Star Office UI

A tiny “pixel office” status UI for your AI assistant.

  • Pixel office background (top-down)
  • A little character that moves between areas based on state
  • Optional speech bubble / typing effect
  • Mobile-friendly access via Cloudflare Tunnel quick tunnel

Language: the demo code/docs are currently mainly in Chinese (中文). PRs welcome.

What it looks like

  • idle / syncing / error → breakroom area
  • writing / researching / executing → desk area

The UI polls /status and renders the assistant avatar accordingly.

Folder structure

star-office-ui/
  backend/        # Flask backend (serves index + status)
  frontend/       # Phaser frontend + office_bg.png
  state.json      # runtime status file
  set_state.py    # helper to update state.json

Requirements

  • Python 3.9+
  • Flask

Quick start (local)

1) Install dependencies

pip install flask

2) Put your background image

Put a 800×600 PNG at:

star-office-ui/frontend/office_bg.png

3) Start backend

cd star-office-ui/backend
python app.py

Then open:

4) Update status

From the project root:

python3 star-office-ui/set_state.py writing "Working on a task..."
python3 star-office-ui/set_state.py idle "Standing by"

Public access (Cloudflare quick tunnel)

Install cloudflared, then:

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

Youll get a https://xxx.trycloudflare.com URL.

Security notes

  • Anyone with the tunnel URL can read /status.
  • Dont put sensitive info in detail.
  • If needed, add a token check for /status (or only return coarse states).

License

MIT