Self-Portraits in JavaScript
summary
Three concrete approaches to face work in the browser: Azure/Google Cloud Vision via REST (capture canvas → blob → fetch) returns landmark coordinates plus attributes like age gender and emotion but needs network and latency; face-api.js (TensorFlow) client-side models runs entirely in-browser, detects landmarks and expressions but loads slowly and is CPU‑heavy; OpenCV via WebAssembly is very fast for classic detection; the experimental Shape Detection API in Chromium/Electron is minimal and snappy. Also demos include neural style transfer (Magenta) and a quick privacy caveat.
AI-written summary · about
chapters (19)
- 0:00Introduction and about me
- 2:32What are self-portraits
- 3:33Camera obscura and camera lucida
- 4:37First attempts at drawing
- 5:42Improving the drawing tool
- 6:23Adding machine learning
- 8:11Facial recognition approaches
- 9:54Web-based services demo
- 13:53Google Cloud Vision demo
- 15:39Pure client-side with face-api.js
- 17:03face-api.js demo
- 19:05OpenCV.js for detection
- 20:50Shape Detection API
- 21:33Shape Detection API demo
- 23:02Final self-portrait tool
- 24:14Emotion-based music player
- 24:58Magenta.js neural style transfer
- 25:43Privacy and ethical thoughts
- 26:04Summary and Q&A
related talks
48mThe Future of Machine Learning & JavaScript
28mBuilding Motion Controlled Websites in JavaScript
39mAI + JavaScript Rocks
29mSuperpowers for next gen web apps: Machine learning
34mThe Future of JavaScript and AI
35mAI JavaScript Rocks
01h 00mYES!! ML in JavaScript! But why?
34mThe Future of JavaScript is A.I.