React-ing htmlFor=empathy
summary
Builds a browser app that simulates partner‑assisted scanning using the WebGazer.js library, running gaze regression in a web worker and keeping all video client‑side under a GPL license. Letters loop through a frequency‑ordered alphabet with start/pause/reset controls; two blinks = select on the current letter and the app resets the loop after each selection. Blink detection is hacked into the API, webcam tracking falters in poor light or with glasses, and the prototype is explicitly a proof of concept that spells short words.
AI-written summary · about
chapters (25)
- 0:00Intro
- 4:26About the project
- 11:48About Webgazer JAS
- 12:49Webgazer API
- 13:36Script tags
- 13:49Web workers
- 14:38React app
- 14:58Webgazer component
- 15:51Blink detection
- 16:45Rendering
- 17:03Lighting
- 17:36Cleanup
- 17:49Prediction Points
- 18:24Cursor Movement
- 19:06Sketch
- 19:28Partner
- 20:24Scanner
- 21:14Looping
- 21:40State
- 24:14SelectLetter
- 25:29Component
- 26:05Demo
- 27:30Webcams
- 28:17First webcam
- 29:20Conclusions
related talks
48mRadically Accessible Internet Applications 💯
26mEmpathy-Driven Development
47mCreating interactive frontend apps with GopherJS and React
25mCreate Collaborative VR Environment in the Browser with React and GraphQL
40mAAA 3D graphics on the Web with ReactJS + BabylonJS + Unity3D
45mReact Web Components How It Is and How It Could Be
36mBlasting React into Space: Building fluid interface swith React and WebGL
29mParallel computing in ReactJS: Provide a pleasant user experience