Expanso Webcam Pipeline Demo

Quick Start

# Clone the repo
git clone https://github.com/aronchick/webcam-demo.git
cd webcam-demo

# Start the demo
./demo.sh

# Open the displayed URL in a browser

That's it! The demo script handles everything automatically.

Pre-Demo Setup Checklist

Complete these steps 5-10 minutes before your demo:

1. Start the Demo

cd webcam-demo
./demo.sh

2. Verify Everything Works

Dashboard loads at the displayed URL
Shows "Deploy a pipeline to begin" message
Webcam LED is on (if applicable)
Network is stable

3. Prepare Browser Windows

Dashboard open in one window/tab
Expanso Cloud open in another (cloud.expanso.io)
Both visible to audience (or ready to switch)

4. Test the Stages

# Quick test - run each command and verify dashboard updates:
curl -X POST http://localhost:8181/api/stage/1
curl -X POST http://localhost:8181/api/stage/2
curl -X POST http://localhost:8181/api/stage/3
curl -X POST http://localhost:8181/api/stage/4
curl -X POST http://localhost:8181/api/stage/0  # Reset

Demo Script

Follow these steps during your live demo. Each step includes what to say and what the audience will see.

Introduction - Empty State

"This is our edge device - a Raspberry Pi running the Expanso agent. The dashboard is ready and waiting, but no pipelines have been deployed yet. Let's change that."

Audience Sees

Empty video area with message: "Deploy a pipeline to begin"

Deploy Video Capture

"Let's deploy our first pipeline - video capture. This will stream video from the webcam in 3-second chunks."

Go to cloud.expanso.io → Select your device → Deploy 01-capture pipeline

Audience Sees

Video feed appears immediately. Category counters all show 0. Header shows "Stage: 1".

Deploy ML Detection

"Now let's add intelligence. This pipeline adds ML-powered pose detection using MediaPipe. It can recognize when someone raises their left hand, right hand, or both."

In cloud.expanso.io → Deploy 02-detection pipeline

Audience Sees

When you raise your LEFT hand: Giant GREEN arrow flashes across the video + screen pulses green + counter increments

When you raise your RIGHT hand: Giant BLUE arrow flashes + screen pulses blue

When you raise BOTH hands: Giant PURPLE icon flashes + screen pulses purple

Demo tip: Stand back from the camera and raise hands dramatically. The indicators are designed to be visible from 20+ feet away!

Deploy Counting Pipeline

"Let's make this more fun. This pipeline adds a scoreboard to track left vs right gestures. We can use this for competitions or engagement tracking."

In cloud.expanso.io → Deploy 03-counting pipeline

Audience Sees

Stadium-style scoreboard appears: LEFT: 5 VS RIGHT: 3

Scores update in real-time as gestures are detected.

Demo tip: Challenge an audience member to a "gesture battle" - who can score more points?

Deploy Alerts Pipeline

"Finally, let's add some celebration! This pipeline triggers special effects when both hands are raised - perfect for engagement moments."

In cloud.expanso.io → Deploy 04-alerts pipeline

Audience Sees

When BOTH hands are raised: Confetti explosion animation fills the screen!

Demo tip: Build up to this moment. "Let's all raise both hands together... 3... 2... 1..." then confetti!

End

Wrap Up

"That's the power of Expanso - progressive deployment of intelligent pipelines at the edge. Each pipeline added new capabilities without any downtime or reconfiguration."

Press Ctrl+C in the terminal to end the demo. All data is automatically cleared.

Stage Reference

Stage	Pipeline	What It Does	Visual Effect
0	None	Waiting state	Empty state message
1	Capture	Webcam → 3s video chunks	Video feed appears
2	Detection	MediaPipe pose detection	Giant icons + color flash + glow border
3	Counting	Gesture statistics	Stadium scoreboard
4	Alerts	Event triggers	Confetti on both-hands

Local Debugging (Without Expanso Cloud)

For development and testing, use the debug script:

# Interactive debug menu
./debug.sh

# Run specific components
./debug.sh dashboard    # Start dashboard only
./debug.sh full         # Run full pipeline locally
./debug.sh stage 2      # Manually set stage to 2

Note: Local debugging is for development only. For demos, always use ./demo.sh and deploy via cloud.expanso.io.

Troubleshooting

Dashboard won't start

# Check if port is already in use
ss -tlnp | grep 8181

# Kill any existing processes
pkill -f dashboard.py

# Restart
./demo.sh

Camera not detected

# List available cameras
uv run -s capture_video.py --list-devices

# Use a specific camera
export VIDEO_DEVICE=/dev/video1
./demo.sh

Detections not working

Ensure good, even lighting
Stand 3-6 feet from camera
Raise hand clearly ABOVE shoulder level
Wear contrasting colors (not same as background)

Reset everything

# Stop demo and clear all data
# Press Ctrl+C, or:
pkill -f demo.sh
pkill -f dashboard.py
rm -rf chunks/ processed/ pipeline.db