Development Updates


#15 Building VR Worlds in a Browser


Explore the latest advancements in user construction features within the VR Me Up platform. This developer update highlights improvements to server code and introduces the "playbuild25" world—a shared, collaborative space for testing building dynamics. Users can effortlessly create and edit structures using an intuitive build menu and model palette, leveraging tools like snapping grids for precision. Designed to gather feedback before rolling out personalized worlds, this update empowers users to shape virtual environments while fostering creativity and interaction. Dive in and start building, no registration required!

#14 Content management and location sharing


Introducing a new content management system to overcome prior limitations in asset management, allowing users to upload assets like skyboxes, models, and sounds directly to the server without rebuilding the application. This system uses a database for storage, a caching mechanism for efficiency, and advanced ZIP archive handling. Enhancements to the VR client include a "return to home" feature for avatar navigation and a "share location" feature for social collaboration. These updates are foundational steps toward enabling users to create their own customizable VR worlds in the future.

#13 Creating sky boxes in Blender for Three.js


Announcing the addition of "sky boxes" to VR Me Up, enhancing both visual appeal and performance by replacing 3D-rendered skies. The update includes methods for creating three types of sky boxes—equirectangular, cube maps, and 6-sided cube textures—using Blender. Detailed instructions, example Blender files, and code for integration with Three.js are provided to help users implement custom sky boxes and environment textures. These improvements support better lighting, reflections, and user creativity, with further resources available for experimentation and exploration.

#12 Hand and Gesture detection in WebXR VR and Three.js


This update outlines enhancements to VR input handling, including the abstraction of input positions, rotations, and pointers for seamless transitions between mechanical controllers and hand tracking. It standardizes axis rotations and pivot points, improving future object attachment relative to the user's hands. Hand gestures are simplified to ensure visibility, considering limitations of camera-based tracking, and dampened pointer movements improve selection accuracy. The update also introduces gesture detection via XRHandSpace joint data and a refined pointer system, enhancing user interaction and ease of use within VR environments.

#11 Virtual Javascript Joystick and UI Enhancements


Introducing significant improvements to the desktop and mobile user interface, including a new "Virtual Joystick" for movement control on touch devices, replacing bottom-screen buttons for a more functional and seamless experience. The joystick, implemented using HTML, CSS, and JavaScript, enables multi-directional movement with simultaneous head control via touch gestures. Additional enhancements include a configurable "padding zone" to prevent unintended movement and relocated menu options for accessibility, such as view mode switching and avatar customization. These updates improve usability and pave the way for future features in VR environments.

#10 Three.js InstancedMesh Performance Optimizations


Major performance enhancements to the WebXR Three.js client, including a shift to using InstancedMesh objects to improve rendering efficiency. By optimizing view frustum culling and implementing Level of Detail techniques with multiple InstancedMesh objects, the update nearly doubles the frame rate while increasing world complexity and viewing distance. Additionally, code for these enhancements will be packaged into an upcoming NPM module, threejs-polygun, enabling others to replicate the optimizations. These improvements address GPU limitations and are particularly beneficial for mobile and embedded VR devices.

#9 Improvements to avatars, lighting and new Halloween zone


Introducing usability improvements, such as an automatic Avatar selection dialog at startup (optional to disable) and the ability to set avatar names, visible to other players in the world. Halloween-themed avatars and a new Halloween zone with spooky assets, like pumpkins and monsters, enhance the experience. Additionally, lighting customization now offers atmospheric adjustments for zones like Mars and Halloween. These updates aim to increase immersion and make exploring and customizing worlds more engaging, with a fully explorable haunted house as a seasonal highlight.

#8 Manual optimization of VRoidStudio VRM Avatars for WebXR VR using Blender


Manually optimize VRoid Studio VRM models using Blender, focusing on three key steps reducing texture sizes to decrease memory usage, optimizing meshes by removing unnecessary polygons and layers, and reducing animation bones to lower CPU and GPU processing demands. These changes improve load times, memory efficiency, and rendering speed, especially beneficial for low-end VR devices or browsers. Detailed methods include handling overlapping polygons, decimating meshes, and fixing vertex weights to ensure animations like running and walking remain smooth. These optimizations are ideal for better performance when managing multiple avatars in VR environments.

#7 VRM VRoid Studio export optimization


Guidance on optimizing VRoid Studio VRM models for WebXR in browsers, focusing on reducing memory usage and improving performance. By adjusting VRoid Studio export settings, such as deleting transparent meshes, lowering mesh quality, reducing materials to 2, and limiting texture quality to 2048, users can significantly decrease model file size, memory use, and load times. Using tools like Play Canvas Viewer helps track metrics like VRAM and load performance. These optimizations ensure smoother experiences on lower-powered devices while maintaining visual quality. Further manual optimizations using Blender are introduced in the following developer log.

#6 Third person camera view of Avatar


Introduces a new Third Person camera view for VR Me Up, automatically enabled on the first load, with seamless switching between First Person and Third Person modes via the menu. Movement controls remain the same, while the right mouse button allows users to view their avatar in Third Person, addressing previous limitations of avatar visibility. Implemented using Three.js controllers and the Spherical class, the camera dynamically adjusts its position and orientation. Example code is provided for developers, enhancing usability and enjoyment across desktop and mobile platforms. Explore this feature through browsers or WebXR-compatible VR headsets.

Let's Get In Touch!


Join us on the journey creating an Open Metaverse