Inspiration We wanted to bridge the gap between remote collaboration and hands-on learning. Traditional video conferencing lacks the immersive, spatial interaction that makes in-person workshops effective. WebXR offers the opportunity to create truly collaborative 3D environments where remote participants can work together as if they're in the same room. What it does WebXR Remote Workshop creates an immersive virtual environment where users can join collaborative sessions from VR headsets or web browsers. Participants can interact with 3D objects, share spatial content, and engage in hands-on learning experiences together, regardless of physical location. How we built it

Frontend: Vite + TypeScript for fast development and optimized builds 3D Graphics: Three.js for WebXR scene rendering and interaction Deployment: Vercel for continuous deployment and hosting WebXR API: For cross-device VR/AR support Built with responsive fallbacks for non-XR devices to ensure accessibility

Challenges we ran into

Configuring Vite's build system to properly resolve module paths for Vercel deployment Handling WebXR API compatibility across different browsers and devices Creating intuitive 3D interactions that work for both VR headset users and desktop browsers Managing real-time synchronization of 3D object states between multiple users

Accomplishments that we're proud of

Successfully deployed a working WebXR application that runs across multiple platforms Created an accessible experience with graceful fallbacks for non-XR devices Solved complex build configuration issues to enable seamless CI/CD Built an intuitive 3D interface that makes remote collaboration feel natural

What we learned

Deep understanding of WebXR API capabilities and limitations Advanced Vite configuration and build optimization techniques The importance of progressive enhancement for emerging web technologies How to design 3D user interfaces that are intuitive for both VR and non-VR users

What's next for WebXR remote workshop

Add real-time multiplayer synchronization with WebRTC or WebSockets Implement hand tracking for more natural interactions Create a library of workshop templates for different use cases Add recording and playback features for asynchronous learning Expand device support to include AR capabilities for mobile devices Build collaborative tools like 3D whiteboards, spatial annotations, and shared object manipulation

Built With

Share this project:

Updates