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:

• http://127.0.0.1:18791

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

You’ll get a https://xxx.trycloudflare.com URL.

Security notes

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

License

MIT