[{"data":1,"prerenderedAt":30},["ShallowReactive",2],{"project-spatial-web":3},{"id":4,"title":5,"approach":6,"challenge":7,"created_at":8,"description":9,"extension":10,"github_url":11,"hero_image":12,"learnings":13,"live_url":14,"meta":15,"outcome":16,"role":17,"screenshot_captions":18,"screenshots":20,"status":12,"stem":22,"tags":23,"__hash__":29},"projects\u002Fprojects\u002Fspatial-web.yml","Spatial Web","MediaPipe HandLandmarker tracks a camera stream while a requestAnimationFrame loop handles cursor mapping, pinch-to-grab interactions, collision checks, spring motion, and release velocity. The experience includes graceful camera-permission fallbacks and a mirrored immersive background.","Most web interfaces assume a mouse or touch surface. Spatial Web explores what happens when the user’s hand becomes the cursor and interface objects respond with weight, proximity, and momentum.","2026-04-03T19:13:02Z","An experimental interface controlled by hand gestures, where webcam tracking turns the browser into a physical-feeling spatial canvas.","yml","https:\u002F\u002Fgithub.com\u002Frealabdullah\u002Fspatial-web",null,"High-frequency interaction state belongs outside Vue reactivity; keeping the physics loop imperative makes gesture feedback smoother and easier to tune.","https:\u002F\u002Fspatial.abdspace.xyz\u002F",{},"A browser-based interaction study combining MediaPipe hand landmarks, gesture recognition, spring physics, inertia, and an immersive camera mode.","Creative technologist",[19],"Gesture-controlled spatial canvas with draggable interface objects",[21],"https:\u002F\u002Fres.cloudinary.com\u002Fdxvhsze0l\u002Fimage\u002Fupload\u002Fv1783856578\u002Fiteqojvalzbcqsduhjoq.webp","projects\u002Fspatial-web",[24,25,26,27,28],"Nuxt","MediaPipe","GSAP","Computer Vision","Interaction","nHtxqOTwm_GiwpvTbTLPgO9EpT5Gex4Be4OadTCUzyk",1783862755218]