Spatial p5

Spatial p5 brings together the open-source tools p5.xr, p5.live, and p5.js into a seamless workflow for immersive design. p5.xr simplifies working with mixed reality, p5.live enables real-time collaboration and live-coding, and p5.js provides a familiar foundation for creative coding. Together, they make rapid prototyping more accessible and intuitive, removing typical barriers and allowing artists and designers to work and interate fluidly.

p5.xr brings WebXR capabilities into the p5.js ecosystem, handling core features like the camera, stereoscopic rendering, and support for multiple browsers and devices right out of the box. It simplifies using WebXR’s advanced functionalities, like hand tracking, with a familiar API, allowing people to integrate immersive elements without complex setup.

p5.live is an editor tailored for live coding, providing real-time feedback as you write code. This immediacy allows creators to see the results of their changes instantly, making the iteration process smoother and more intuitive. It also supports collaborative coding, enabling multiple users to edit together in real time, ensuring that everyone shares the same view in Mixed Reality headsets. This shared environment makes it easier to align perspectives and work together seamlessly.

p5.js simplifies coding by removing the unnecessary complexity often found in traditional programming environments. With an intuitive structure and clear syntax, it allows creators to focus on their ideas instead of setup and configuration. Getting started is easy, thanks to a wealth of examples that demonstrate key concepts, enabling users to jump right into creative coding and build interactive projects quickly.

The Sketchbook offers a collection of examples in the familiar p5.js style, providing a hands-on way to explore Spatial p5. Each example is designed to be easily modified, allowing users to see immediate results and experiment.

A series of experimental workshops have been organized to test Spatial p5 with participants, addressing common challenges in mixed reality, such as the difficulty of seeing what others are doing in headsets and the need for additional tools for collaboration. Spatial p5 offers solutions to these issues, making it easier to navigate MR workshops. If you’re interested in having a workshop hosted, read the blog post here for insights or get in touch.

Thank you to Ted Davis for creating p5.live, Stalgia Grigg for initiating p5.xr, and the entire p5.js community. Special thanks to Ekaterina Bliznyuk, Robin Bervini, and Amaury Hamon for their invaluable support.