Interactive Labs

Labs

Each demo runs in your browser. Models are downloaded once and run locally, so camera frames and what you type stay on your device unless a demo says otherwise.

• Uses your camera

  Vision Lab

  Background Remover

  Live person cutout with selectable backdrops and in-browser vision segmentation.

  How it works

  Each webcam frame goes through BodyPix person segmentation on the WebGL backend. The mask decides, pixel by pixel, whether to draw you or the chosen backdrop onto a canvas. No frame leaves the browser.

  • TensorFlow.js
  • BodyPix
  • WebGL
  • Canvas

  Open demo: Background Remover
• Conversational AI

  Portfolio Chat

  Ask about Don with answers grounded in the portfolio, or chat about anything with a small LLM running on your device.

  How it works

  Questions are first matched against rules built from the same data the site renders. Anything they miss falls back to an extractive DistilBERT model running in the browser, so answers can only quote facts that are on the page. The General tab streams replies from Liquid AI’s LFM2.5-350M in a Web Worker, on WebGPU where available, with no server involved.

  • Transformers.js
  • DistilBERT
  • LFM2.5-350M
  • WebGPU
  • Web Speech API
  • WebMCP

  Open demo: Portfolio Chat
• On-device GenAI

  Local AI Studio

  A private assistant that chats, answers from your own PDFs with citations, takes voice input and remembers what you approve, all on your device.

  How it works

  A rules-first router handles commands, maths, dates and memory without calling a model. Other messages are matched against your documents with embeddings plus BM25. When a passage is relevant, LFM2.5 answers from it in a Web Worker and the sources are cited; when none is, the page says so rather than guessing. Chats, documents and vectors stay in IndexedDB, and an optional Jev model widens document routing.

  • Transformers.js
  • LFM2.5
  • mxbai embeddings
  • Whisper
  • Jev
  • PDF.js
  • IndexedDB
  • WebGPU

  Open demo: Local AI Studio
• Uses your camera

  Tracking Demo

  Face Mesh

  Real-time facial landmark tracing powered by webcam input and browser ML.

  How it works

  MediaPipe Face Mesh, loaded from a CDN as WebAssembly, predicts 468 landmarks per frame. The page draws them over the video, and you can choose which range of points to trace.

  • MediaPipe Face Mesh
  • WebAssembly
  • Canvas

  Open demo: Face Mesh
• Uses your camera

  Interactive Game

  Hand Catch

  Two-hand webcam arcade game with falling targets, combos, and live detection.

  How it works

  A lite hand-pose model finds both hands every frame. Your palm positions become catchers in a game loop, and collisions with falling targets drive score and combos.

  • TensorFlow.js
  • Hand Pose Detection
  • Canvas

  Open demo: Hand Catch
• Uses your camera

  Music Experiment

  Air Guitar

  Pose-driven virtual instrument with live strumming, pitch control, and audio feedback.

  How it works

  PoseNet tracks both wrists. The fretting hand’s position sets the pitch, and a strum with the picking hand plays a guitar sample through a Tone.js pitch shifter.

  • TensorFlow.js
  • PoseNet
  • Tone.js
  • Web Audio

  Open demo: Air Guitar
• Decision AI

  Smart Home

  Natural-language control of simulated lights and a fan, decided by the Laya model running in your browser.

  How it works

  A command is normalised, then the Laya model answers a fixed set of decision questions (which device, which action, how much) in ONNX Runtime Web. A policy layer validates its answers before the simulator applies them, so the model can refuse things it should not do.

  • Laya
  • ONNX Runtime Web
  • TypeScript

  Open demo: Smart Home
• Productivity

  Smart Note

  A polished note workspace with export tools, formatting controls, and fast writing flow.

  How it works

  Notes stay in local storage and work offline as a PWA. A MiniLM embedding model in a Web Worker indexes them for semantic search, and Chrome’s built-in Summarizer and Proofreader APIs are used where the browser supports them.

  • Transformers.js
  • MiniLM embeddings
  • Chrome built-in AI
  • Web Speech API
  • PWA

  Open demo: Smart Note
• Uses your camera

  Realtime

  Meet

  Peer-to-peer video calls straight from the browser, with no account and no server in the media path.

  How it works

  PeerJS uses a public broker only to exchange connection details. Audio and video then flow directly between the two browsers over WebRTC.

  • WebRTC
  • PeerJS

  Open demo: Meet
• Seasonal Build

  Xmas Greeting

  A festive interactive microsite with personalized greetings and a lightweight holiday vibe.

  How it works

  The greeting reads a name from the URL (?name=…), so each shared link renders its own message with no backend.

  • Next.js
  • Framer Motion

  Open demo: Xmas Greeting