CrewWatch

Inspiration

Film production is an industry where safety regulations exist but manual tracking is error-prone. Crew members often work extremely long days—12-16 hours is common on sets—and fatigue-related accidents are a real risk. I wanted to build an autonomous system that ensures compliance with labor regulations while protecting crew safety.

I was inspired by the challenge of the Agentic Cinema hackathon: to build an autonomous agent for a real media & entertainment workflow. Film crew safety monitoring is a perfect use case—it's a genuine problem in the industry, it requires autonomous decision-making, and it integrates naturally with time-series monitoring.

What I Learned

Building CrewWatch taught me several key things:

Google Agent Development Kit (ADK): I learned to use Google's official ADK framework for building agents on the Gemini Enterprise Agent Platform. This included understanding FunctionTool patterns, LlmAgent orchestration, and tool calling with Zod schema validation.

Model Context Protocol (MCP): I implemented Grafana integration via MCP, learning how MCP servers work as standardized protocols for AI agents to connect to external systems. I also built a fallback to direct HTTP API for reliability.

Next.js 16 & React 19: Working with the latest versions of Next.js and React, I learned about App Router patterns, server components, and the new React 19 features.

Agent Architecture: I designed a multi-step agent that sequentially executes tools (query Grafana → check violations → generate diagnostics → take action → log decisions), learning about agent state management and error handling.

How I Built It

Frontend: Built with Next.js 16 using App Router, React 19, and Tailwind CSS 4. The design follows a "production office/call sheet" aesthetic with warm obsidian backgrounds, brass accents, and IBM Plex Mono for data display.

Agent System: Implemented using Google Agent Development Kit (ADK) with 5 FunctionTools:

• check_violation: Detects threshold violations
• generate_diagnostic: AI-powered compliance reports via Gemini
• take_action: Autonomous decision execution
• log_decision: Persistent logging to Firestore
• query_grafana: Historical data retrieval via MCP

Grafana Integration: Two-tier approach—primary via MCP (mcp-grafana server) with fallback to direct HTTP API. This ensures reliability while demonstrating MCP usage.

Data Layer: Google Cloud Firestore for decision logging with localStorage fallback. Mock data system allows local development without external dependencies.

Professional Structure: Added CI/CD with GitHub Actions, comprehensive documentation (ARCHITECTURE.md, CONTRIBUTING.md), automated setup scripts, and MIT license for open source compliance.

Challenges Faced

ADK Integration: Initially struggled with the ADK TypeScript API—FunctionTool configuration, proper schema definition with Zod, and LlmAgent setup. I had to read the ADK documentation extensively and iterate on the agent configuration.

MCP Client: Building a TypeScript wrapper for the Python mcp-grafana server was challenging. I implemented a custom EventEmitter-based client that handles MCP protocol communication, with proper error handling and timeout management.

Performance: Navigation was initially slow due to heavy 3D animations and frequent monitoring requests. I optimized by reducing monitoring intervals (30s → 60s), disabling expensive animations, and simplifying 3D effects.

Type Safety: Ensuring strict TypeScript compliance throughout the project required careful type definitions for all agent tools, Grafana data structures, and crew member types.

Time Constraints: With a 7-hour deadline remaining, I had to prioritize the most impactful features while maintaining professional code quality and documentation standards.

Built With

• adk
• ai
• autonomous-agents
• cloud-run
• docker
• film-production
• firestore
• gemini-enterprise
• google-agent-development-kit
• google-cloud
• grafana
• mcp
• model-context-protocol
• next.js
• node.js
• react
• safetycompliance
• tailwind-css
• time-series-monitoring
• typescript