Repolode
Enviar
paulrobello

paulrobello/claude-office

Oficina pixel art en tiempo real que anima las sesiones de Claude Code: el agente principal es el jefe y los subagentes, sus empleados.

Ver en GitHub
Estrellas
600
Forks
137
Issues abiertos
2
Último commit
hace 22 horas

¿Qué es?

Claude Office Visualizer convierte la actividad de Claude Code en una oficina animada de pixel art. El agente principal de Claude aparece como un personaje «jefe» que delega trabajo, y cada subagente, como un «empleado» que se mueve por la oficina mientras ejecuta tareas. Los hooks instalados en Claude Code envían eventos del ciclo de vida a un backend de FastAPI, que transmite el estado por WebSocket a un frontend creado con Next.js y PixiJS.

Además de la vista principal de la oficina, el proyecto ofrece un Command Center que reúne a los jefes de todas las sesiones activas en una sola vista, y una vista de edificio con varias plantas y oficinas en cada una. Una pizarra con varios modos muestra listas de tareas pendientes, uso de herramientas, tareas en segundo plano y un tablero kanban. El proyecto también incluye un plugin de OpenCode que envía eventos desde OpenCode al mismo backend y puede ejecutarse como contenedor de Docker.

Funciones clave

  • 01Oficina animada donde el agente principal y los subagentes aparecen como personajes de jefe y empleado
  • 02Vista general de Command Center con todas las sesiones activas de Claude Code organizadas en columnas según su estado
  • 03Vista de edificio con varias plantas, oficinas en cada planta y cambio entre sesiones
  • 04Pizarra con 12 modos, incluida una lista de tareas pendientes, un gráfico de uso de herramientas y un tablero kanban
  • 05Seguimiento de la ventana de contexto, representada como un cubo de basura que se llena a medida que crece el contexto
  • 06Compatibilidad con el plugin de OpenCode y despliegue con Docker

Casos de uso

  • Consultar de un vistazo varias terminales de Claude Code que requieren atención o siguen trabajando
  • Observar cómo un agente principal delega trabajo en subagentes durante una tarea de programación compleja
  • Mostrar o enseñar flujos de trabajo con agentes mediante una interfaz visual y animada
  • Ejecutar el visualizador como servicio compartido de Docker, alimentado por hooks de herramientas locales

Inicio rápido

  1. 1

    Clona el repositorio

    git clone https://github.com/paulrobello/claude-office.git
  2. 2

    Entra en el directorio del proyecto

    cd claude-office
  3. 3

    Instala todos los componentes (backend, frontend y hooks)

    make install-all
  4. 4

    Inicia los servidores de desarrollo en tmux y, después, abre http://localhost:3000

    make dev-tmux

Antes de usarlo

  • Requiere Python 3.13 o posterior, Node.js 20 o posterior, uv y una configuración de Claude Code CLI u OpenCode.
  • Los resúmenes de nombres y tareas generados con IA requieren un token OAuth de Claude Code; sin él, se muestran los ID de agente sin procesar.

En colecciones

Herramientas, skills y plugins para Claude CodeFrameworks y apps de agentes de IA open sourceDiagramas, gráficos y visualizaciones animadas

Temas

#claude-code#ai-agents#visualization#pixi-js#nextjs#fastapi#websocket#developer-tools

Preguntas frecuentes

¿Qué es claude-office?
Oficina pixel art en tiempo real que anima las sesiones de Claude Code: el agente principal es el jefe y los subagentes, sus empleados. Claude Office Visualizer convierte la actividad de Claude Code en una oficina animada de pixel art. El agente principal de Claude aparece como un personaje «jefe» que delega trabajo, y cada subagente, como un «empleado» que se mueve por la oficina mientras ejecuta tareas. Los hooks instalados en Claude Code envían eventos del ciclo de vida a un backend de FastAPI, que transmite el estado por WebSocket a un frontend creado con Next.js y PixiJS.
¿claude-office es gratuito? ¿Qué licencia tiene?
claude-office es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿claude-office sigue mantenido?
Mantenimiento activo. El último commit de claude-office fue el 5 nov 2026.
¿Para qué puedo usar claude-office?
Consultar de un vistazo varias terminales de Claude Code que requieren atención o siguen trabajando Observar cómo un agente principal delega trabajo en subagentes durante una tarea de programación compleja Mostrar o enseñar flujos de trabajo con agentes mediante una interfaz visual y animada Ejecutar el visualizador como servicio compartido de Docker, alimentado por hooks de herramientas locales
¿Cómo se instala claude-office?
Clona el repositorio: git clone https://github.com/paulrobello/claude-office.git Entra en el directorio del proyecto: cd claude-office Instala todos los componentes (backend, frontend y hooks): make install-all Inicia los servidores de desarrollo en tmux y, después, abre http://localhost:3000: make dev-tmux
¿Dónde consigo claude-office?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/paulrobello/claude-office

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados