Whose turn is it anyway? Augmented reality board games.
summary
A browser app that uses Vue.js + ActionCable and WebRTC to stream data URI webcam frames to a Rails server, parses them with OpenCV Hough Transform to find round wooden cars, and builds a pixel mask of the 630‑combination PitchCar track to ignore off‑track pixels. The demo shows live detection, leaves a crosshair where a car disappears, handles glare and false positives (hands) with tuning, and mostly works though occasional misfires prompt GUI and ML improvements.
AI-written summary · about
chapters (22)
- 0:00Introduction
- 6:09Getting the image
- 8:07ActionCable
- 11:48Data URI
- 13:03Matrixes
- 17:05Binary mode
- 21:03VModel
- 23:07How Transform
- 24:39Pitch Car
- 25:12Optimization
- 26:20Geometry
- 28:10Track Description
- 28:38Corner
- 30:49Mask of Truth
- 31:00Car Detection
- 31:41Testing
- 32:42Reset
- 34:32Takeaways
- 35:44Machine Learning
- 36:46Why
- 37:18Would I use UJS
- 37:45Is vim better than react
related talks
23mPerformant Augmented Reality for the Web
24mCreating a WebXR Tic-Tac-Toe game with Voice Chat
26mHow to Cheat at Life with JS, CV, and AR
33mWebXR? Native virtual and augmented reality in browsers
47mAugmented Reality on the Web
01h 15mDeveloper Roadshow
56mBringing mixed reality to the web
23mWebAR: the Augmented Reality for your Browser