May 4, 2021
In this tutorial, you will learn how to create a very simple Web AR Project with an image.
First of all, you will need an XR.+ account, so go to the register page and create a free acount. Follow the steps to complete your registration, and now, let’s start your project!
On the XR+ studio home screen, click on the “Create your first project” button.
Here you can choose a project template to see the possibilities of the studio, in this tutorial, we will use “Empty project”. Name your project and click on “Create project”.
Welcome to the main project edition screen! Open your assets library by clicking on “Open library”, which is empty for now.
Import your image by clicking on the button named “Import a File”, then click on the “Add to scene” button.
Now, we have your image in the 3D space of the editor. You can move it by selecting one of the two main tools of the view in the bottom left corner. Place it at your will. You can resize it or move it by entering the coordinates in the tool bar at the bottom of the 3D view.
Your project is already published and live, above to the QR code, you can see the public link to the project, in this case: https://xr.plus/nnz (yours will be different).
Type this web address on your phone web browser or scan the QR code in the editor to view the project in web augmented reality.
Congratulation you’ve made it!
April 26, 2021
XR+ provides the highest level of compatibility with smartphones to deliver advanced AR / VR experiences to 3+ billions of end users
 | iOS: 98% iPhones and iPads running on iOS 14 or newer, that’s all iOS devices launched since 2017 Android: 95% Android phones launched since 2018 with a minimum of 2GB RAM Together, that’s 96% of phones compatible |
WebXR projects made with the XR+ studio are compatible with all major web browsers
 |  |  |  |  |
| Chrome | Safari | Firefox | Samsung internet | Edge |
XR+ supports Oculus Quest 1 & 2, Meta Quest Pro, PICO 4, and the combo Chrome + Oculus / HTC Vive on computers
April 21, 2021
Import assets to the project library so you can add them to the composition scenes. Each asset can be added once or multiple times on each scene of the composition.
3D models
You can import .obj, .fbx and .glb (compressed gltf) 3D models up to 12 MB.
The 3D models can be animated.
We recommend importing 3D models with less than 100 000 triangle faces (polygons).
Images
You can import .jpg, .png and .webp images
Videos
You can import .mp4 videos files
Maximum resolution: 1920x 1080 pixels.
Maximum size: 50MB
Audio files
You can import .mp3 files up to 10 MB.
Create skins to customize the design of the loading and start screens of your experiences.
They key screens that can be customized are the loading screens and the main screen.
There are 6 material shaders available in the webXR materials editor
 | Phong Basic material with a color texture and a normal texture |
 | Unlit A shadeless material with a single color texture. Lights do not affect unlit materials, recommend on models made from 3D scans where the lights are already applied. |
 | PBR Physically based rendering material with 3 textures: color, normal and metalness Use it for realistic shading |
 | Toon Toon shading, for a cartoon effect (also called cell shading). When using toon shading, we recommend to keep only one light active on the scene, set the color to the other lights to black |
| Video Same as unlit, but with a video as texture |
 | Mask Use the mask shader to mask other objects, great to make magic AR portal effects. |
Image AR markers are reference images used for image AR tracking. When the user points his phone camera on a image marker, the XR+ composition is displayed in AR, on top of the image marker.
Those markers also have a few constraints:
– They must be square.
They work best with images that have a lot of visual features. Images that work well have:
– Many sharp angles.
– High contrast. Both color and black and white images can be used.
– Many unique features that don’t repeat very often.
Photos typically makes much better image trackers than logos!
Keep in mind you don’t need to use the whole poster or photo as tracking pattern, sometimes using only a portion of it gives better results… In this example, to attach a webAR scene to this photo, it would recommended to use only the centre of the photo as tracking pattern.
