refineXR

Inspiration

As we developed our webAR flashcard application, we found ourselves creating numerous web pages with similar structures but varying content. This repetitive task of crafting hundreds of cards can be monotonous, highlighting the need for a management system.

What it does

Refine-XR is a CRUD-based management system that enables users to manage 3D assets and create web-based XR applications without requiring any programming expertise.

The system comprises a 3D viewer within the admin dashboard, enabling users to configure WebXR experiences using various input options. Additionally, users can directly publish their experiences within the system.

In principle, RefineXR can integrate with any type of WebXR solutions or frameworks via extensions. Currently, the system supports markerless AR experiences, image tracking AR experiences as well as VR experiences.

How we built it

To create our NextJS application that communicates with a backend REST server serving as the data provider, we leveraged the Refine framework. For local development, we developed a basic REST server using json-server, which can be replaced with other data providers as needed.

We integrated ThreeJS into our asset management module to implement the 3D viewer. For image tracking AR experiences, we employed MindAR SDK, while markerless AR experiences were implemented using Google's . Additionally, we used AFRAME to develop VR experiences.