360 Secure SkillHub
360 安全技能中心

Agency HQ

面向 AI agent 团队的像素风办公室可视化看板:按 agent 实际状态在办公室、厨房、游戏室、机房之间移动,展示活动流、agent 聚光卡片与角色化台词。可连接 OpenClaw 以实时模式读取本地会话文件,也可在演示模式下独立运行;系统统计依赖本机命令。

spockthegreatbot
spockthegreatbot
热度 60.45
最近更新 2026-05-17 14:50:48
分类:协作依赖:代码执行 / 读写文件应用场景:任务管理 / 工作流 / 报告撰写

安装技能

复制下面的话术发给你的 Agent,它会通过 secure-skills 检索并安装该技能。

执行命令安装此 skill: npx secure-skills-cli add agency-hq
Metadata
name
agency-hq
description
A pixel art office visualization for your AI agent team. Shows real-time agent status, activity feeds, and personality-driven banter. Works with OpenClaw in live mode or standalone in demo mode.
version
1.0.0
license
MIT
author
Enjin Studio
tags
["visualization","pixel-art","dashboard","agents","monitoring"]

Agency HQ — AI Agent Office

A real-time pixel art visualization of your AI agent team. Agents move between rooms (office, kitchen, game room, server room) based on their actual status. Includes a live activity feed, agent spotlight cards, and personality-driven chat.

When to Use

  • You want a visual dashboard showing what your agents are doing
  • You want to showcase your agent team to others (demo mode)
  • You want a fun, always-on display of your OpenClaw setup

Setup

1. Clone and Install

git clone https://github.com/enjinstudio/agency-hq.git
cd agency-hq
npm install

2. Configure Mode

Copy .env.example to .env.local:

cp .env.example .env.local

Set ARENA_MODE=live to connect to your OpenClaw instance, or leave as demo for simulated data.

3. Customize Your Agents

Edit src/lib/agents.ts. Each agent needs:

Field Description
id Must match your OpenClaw agent ID (e.g., main, dev, research)
name Display name
emoji Avatar emoji
role Role label shown in spotlight
model Model name shown in spotlight
color Hex color for theme and pixel art
desk Desk position: command, dev, trading, research, design, security, content, strategy, engineering, pm, finance
accessory Pixel art accessory: glasses, hat, badge, headphones, scarf, cap, bowtie, visor, antenna, crown, monocle

4. Customize Chat Lines (Optional)

Edit src/lib/agent-chat.ts to write personality-driven banter. Each agent has:

  • general — random lines said to the room
  • to{AgentName} — directed lines at specific agents (30% chance)

5. Run

# Development
npm run dev

# Production
npm run build && npm start

6. Deploy to Vercel (Optional)

Push to GitHub and import in Vercel. Demo mode activates automatically on Vercel.

How Live Mode Works

In live mode, the app reads from your OpenClaw directory:

  • Agent status — scans ~/.openclaw/agents/{id}/sessions/*.jsonl for recent activity
  • Activity feed — extracts user messages and tool calls from session files
  • System stats — reads /proc/loadavg, runs free -m and df
  • Room assignment — active agents → office, idle → kitchen/game room, offline → rest room

No database. No external APIs. Just reads files from disk.

Requirements

  • Node.js 20+
  • OpenClaw (for live mode only)
  • npm

Notes

  • The chat system generates fun flavor text — it's not real agent communication
  • Demo mode works everywhere, including Vercel, with zero configuration
  • The pixel art renderer uses Canvas2D — no WebGL required, works in all browsers
  • Mobile responsive — stacks vertically on small screens