Vues (Virtual User Experiences) Vues

Vues are 3D simulations that are rendered in real time. It is like an animated 3D scene that will be played around the user in a virtually augmented 3D world (AR/VR/MR) on the user's mobile device. Upload Vues to showcase Architecture, Engineering, Medical anatomy, Life scale product demo, send message to community, Education and training, Entertainment, to promote a brand or a product or pretty much like showing anything and everything in XR (Xtended Reality). Vues can also be spawned at a geo location(GPS) with respect to true north direction and in this case the users will only be able to xperience the Vue when they are at that particular geo location physically. The possibilities are endless.

Vues can be created using "Unity 3D" editor software, which is available for free from, Unity - Store. Unity is a cross-platform game engine developed by Unity Technologies, which is primarily used to develop video games and simulations for computers, consoles and mobile devices. VueXR, as of now, only supports unity's asset bundles for vues. So lets go through on how to create and upload a Vue.

If you already know or have been using unity3D, then creating Vue is going to be a fairly simple process for you. Just download VueXR Rig(Vue builder) from Unity's asset store , a Vue may contain just one or even more game objects that are animated individually or are a part of wholesome scene with graphics and aesthetics just like the unity's very own The ADAM series. From small fictional particle systems to creating the whole known universe, A Vue can comprise of 3D models(mesh), animations, lights, PBR materials, VFX, Particle systems, physics materials, Event triggers and sounds. If you are already through with how to create a Vue, please skip to 'Its time to upload your vue''.

-> Starting with unity3D

Now you first need to download unity3d editor tool from Unity - Store. Once downloaded, follow the instructions given here, Unity - Manual: Downloading and Installing Unity and you have your unity editor installed. Note to just select 'Unity components', 'Documentation' and 'Standard Assets' and either 'Android Build support' or 'iOS Build support' depending on the mobile device you have for testing. Anyway, selecting these 4 options would get you started and just in case if you feel like developing games, you can always go back to the website and download related and required components and start creating with unity.

Unity has a huge developer user base across globe and has its own Q&A site for questions and queries @ Unity Answers. Stackoverflow also has a good amount of solved questions which might help get you through the learning phase. Besides Q&A sites, the best place to land in case of any doubt or query is the unity's documentation website @ Unity User Manual.

-> Let's create a vue

First of all start by creating a 3D project with unity by giving a name let's say 'My first vue'. Now even if you don't need to build a whole game for any mobile device, the first thing you should do is switch platform to either Android or iOS depending on the mobile device you have for testing your vue and the one which you downloaded earlier. This will enable all the options available inside the unity editor that are available for creating a 3D animated scene for mobile devices.

Now a vue may consist of one or more 3D game objects. Unity does have basic shapes of 3D objects like Cube, Sphere, Capsule, Cylinder, Plane and Quad, but for creating complex shapes and figures like a house or a human figure, you would need 3D editors like Blender, 3D max, Maya, etc. 3D objects made with different platforms can be brought to unity and animated. To learn more about the formats supported by Unity 3D engine go to this link, Unity Manual: 3D formats

For beginners, it is advisable to search for ready made game objects at the Asset Store. Unity asset store is a den for great assets and pluggins for the unity tool. You can download the game objects directly from the Asset Store inside the unity editor tool and from the download manager inside the unity editor's Asset Store, import the 3D game objects directly to your project.

Now creation of a 3D object is one part and animating it, is other. Get things moving now! All you need to start animating in Unity is explained @ Unity Manual: Animation

Also particle systems are a great way to give a visual treat. You can learn everything about particle systems from this playlist of the Unity's official youtube channel, Visual Effects With Particle Systems





Now create a vue using whatever you learned from above and get ready to show it to the world in XR(Xtended Reality), on our platform. Once you have your vue ready in Unity 3D, build a Vue of your prefab by following the steps given below,


  1. Open Unity 2020.x, and download VueXR Rig(Vue Builder) from Unity Asset store.

  2. Double click to Load VueXR Rig Scene. Now drag and drop the 3D model folder into Unity project.

  3. Select the 3D model file and extract the materials, once the materials are extracted drop the 3D model in the scene and apply the necessary textures to the materials.

  4. Position the 3D model at x-0, z-0 and y axis as required, use the Human model as reference and scale the 3D model accordingly.

  5. In case if you have image textures, sprites and sound files as your assets, make sure to compress them according to your needs, as the display is going to be a mobile device, so a high definition texture or sprite might just increase the size of your asset bundle and might not create any difference in your visual experience. Size of the vue is equally important to its content. Cause a heavy vue may not get effectively rendered in some mobile devices due low or average device configurations and this could lead to your vue not reaching some VueXR users.

  6. You can also add animations, lights, PBR materials, VFX, Particle systems, physics materials, Event triggers and sounds.

  7. Now create an empty object and place it at x-0, y-0, and z-0 and rename it.

  8. Drag and drop the 3D model and all other objects(i.e. lights, vfx, particle systems, sounds, etc.) in the empty object and make its child.

  9. Now drag and drop the Parent object in the project folder to make a prefab.

  10. Select VuePlayer in the heirarchy window and drop the prefab in the Vue prefab to spawn option in the inspector window.

  11. Make sure your game window aspect ratio is 1920x1080 and hit play, test your content here and take a screenshot for the thumbnail.

  12. Now go to VueXR Rig tab in the menu bar and select build and select the prefab you want to build. This will build Vues for Android, IOS and Web Browser.

  13. Once it is built its time to upload.

-> Its time to upload your vue

To upload your Vue on VueXR log on to www.VueXR.com and sign in if you are already registered or just register yourself, it takes less than a minute to register on VueXR.

Then click on VueXR Rig -> Upload Vues from Unity -> Add new Vue by filling in the form with details such as,

  • Vue Title - Give your creativity a catchy title for the world to remember.

  • Description - Describe your Vue in brief, tell the viewers the story behind it.

  • Category - Select a category for your Vue for better search results.

  • Banner - Upload a creative thumbnail that attracts the viewers to experience your XR work.

  • Tags - Add keywords that are popular and related to your content to show in Vue searches .

  • Far clip - This adjust the distance of viewing for your content. Keep the far clip to minimum for better performance in Heavy objects that spreads across acres of land.

  • View display Mode - Select AR or VR to showcase your 3D media content in either in AR or VR.

  • Background Colour - Choose a colour to set as a background of your 3D media content in Web browser player.

  • Ambient Light - If you want to use the device's surrounding light to light your XR content then turn this option on.

  • Interactivity - Turn it on if you wish users to interact with your XR content.

  • Vue Spawn Mode - Anywhere -If you select this option users will be able to view your vue anywhere.

  • Vue Spawn Mode - Vuespot - Select this options and give coordinates in the following input field, If you select this option users will have to reach the selected Geo location on the planet earth to experience the Vue. This option is good if your work is related to a geo location ( like a big space ship crashed somewhere, Giant Industrial/Residential/commercial compound, Archelogical sites, etc.)

  • Click on Upload.

-> Now what next?

Once you are done uploading the vue go to VueXR app on your mobile device sign in with the same ID(used to upload vues) and follow this steps to test and publish it:

  1. Click on VueXR icon in the right bottom corner of the screen and go to the menu

  2. Go to Uploaded Vues

  3. select the uploaded Vue and play it

  4. The vue is downloaded and played, once you are happy with it, click on publish and it becomes available for the whole world to experience.
Vues Vues

What are Vues?




Vues are 3D simulations that are rendered in real time. It is like an animated 3D scene that will be played around the user in a virtually augmented 3D world (AR/VR/MR) on the user's mobile device. Upload Vues to showcase Architecture, Engineering, Medical anatomy, Life scale product demo, send message to community, Education and training, Entertainment, to promote a brand or a product or pretty much like showing anything and everything in XR (Xtended Reality). Vues can also be spawned at a geo location(GPS) with respect to true north direction and in this case the users will only be able to xperience the Vue when they are at that particular geo location physically. The possibilities are endless.

Vues can be created using "Unity 3D" editor software, which is available for free from, Unity - Store. Unity is a cross-platform game engine developed by Unity Technologies, which is primarily used to develop video games and simulations for computers, consoles and mobile devices. VueXR, as of now, only supports unity's asset bundles for vues. So lets go through on how to create and upload a Vue.

If you already know or have been using unity3D, then creating Vue is going to be a fairly simple process for you. Just download VueXR Rig(Vue builder) from Unity's asset store , a Vue may contain just one or even more game objects that are animated individually or are a part of wholesome scene with graphics and aesthetics just like the unity's very own The ADAM series. From small fictional particle systems to creating the whole known universe, A Vue can comprise of 3D models(mesh), animations, lights, PBR materials, VFX, Particle systems, physics materials, Event triggers and sounds. If you are already through with how to create a Vue, please skip to 'Its time to upload your vue''.

Download Unity V 2020.x from the link given below,

https://unity3d.com/get-unity/download/archive
Vues Create a Vue



Since the invention of smartphones, we have been looking at the gap of a global platform that allows users to upload, watch and share 3D animated content in XR. Now imagine experiencing this 3 Dimensional animated scene playing around you inside your very own smartphone. We call them Vues.

VueXR mobile application projects these Vues in a virtually augmented 3D environment, the light in this AR environment is adjusted according to the device's surrounding light using light estimation algorithms. For GPS based Vues called Vuespots there is a virtual sunlight, precise to the device holder's GPS location, to cast real-time sunlight and shadows. By creating Vuespots VueXR gives an option to the Vue uploader of playing the content only at a specific GPS location to get that feeling of 'what if I paint this place red'.

Now a vue may consist of one or more 3D game objects. Unity does have basic shapes of 3D objects like Cube, Sphere, Capsule, Cylinder, Plane and Quad, but for creating complex shapes and figures like a house or a human figure, you would need 3D editors like Blender, 3D max, Maya, etc. 3D objects made with different platforms can be brought to unity and animated. To learn more about the formats supported by Unity 3D engine go to this link, Unity Manual: 3D formats

For beginners, it is advisable to search for ready made game objects at the Asset Store. Unity asset store is a den for great assets and pluggins for the unity tool. You can download the game objects directly from the Asset Store inside the unity editor tool and from the download manager inside the unity editor's Asset Store, import the 3D game objects directly to your project.

Now creation of a 3D object is one part and animating it, is other. Get things moving now! All you need to start animating in Unity is explained @ Unity Manual: Animation

Also particle systems are a great way to give a visual treat. You can learn everything about particle systems from this playlist of the Unity's official youtube channel, Visual Effects With Particle Systems





Now create a vue using whatever you learned from above and get ready to show it to the world in XR(Xtended Reality), on our platform. Once you have your vue ready in Unity 3D, build a Vue of your prefab by following the steps given below,


  1. Open Unity 2020.x, and download VueXR Rig(Vue Builder) from Unity Asset store.

  2. Double click to Load VueXR Rig Scene. Now drag and drop the 3D model folder into Unity project.

  3. Select the 3D model file and extract the materials, once the materials are extracted drop the 3D model in the scene and apply the necessary textures to the materials.

  4. Position the 3D model at x-0, z-0 and y axis as required, use the Human model as reference and scale the 3D model accordingly.

  5. In case if you have image textures, sprites and sound files as your assets, make sure to compress them according to your needs, as the display is going to be a mobile device, so a high definition texture or sprite might just increase the size of your asset bundle and might not create any difference in your visual experience. Size of the vue is equally important to its content. Cause a heavy vue may not get effectively rendered in some mobile devices due low or average device configurations and this could lead to your vue not reaching some VueXR users.

  6. You can also add animations, lights, PBR materials, VFX, Particle systems, physics materials, Event triggers and sounds.

  7. Now create an empty object and place it at x-0, y-0, and z-0 and rename it.

  8. Drag and drop the 3D model and all other objects(i.e. lights, vfx, particle systems, sounds, etc.) in the empty object and make its child.

  9. Now drag and drop the Parent object in the project folder to make a prefab.

  10. Select VuePlayer in the heirarchy window and drop the prefab in the Vue prefab to spawn option in the inspector window.

  11. Make sure your game window aspect ratio is 1920x1080 and hit play, test your content here and take a screenshot for the thumbnail.

  12. Now go to VueXR Rig tab in the menu bar and select build and select the prefab you want to build. This will build Vues for Android, IOS and Web Browser.

  13. Once it is built its time to upload.


  14. Some of the key applications of 'VueXR' include:


    • Malls, Supermarkets, shops, etc. can create augmented scene that make viewers feel like they are part of the scene at their very own business location. Click here

    • Real estate, structural engineering etc. industries can project a building or a bridge before it is constructed, respectively to a geolocation and its orientation. Click here

    • The entertainment industry can project trailers and content around the users for promotions. Click here

    • An aeronautical engineering company can project their planes in real time for better understanding. The technical training can be conducted easily.Click here

    • Educational institutes can reach users via educational content that is played around the users in real time.Click here

    • You can have AR/VR emoji and greetings. Click here

    • Send a message to the community using AR/VR content.Click here

    • Automobile industry can use it to project the car models in 3D right in front of the users.


    Now the best part is that you can use it for free!



    How can you make the best out of VueXR?


    • create 3D animated scenes with magical VFX, festive themes, action, movie trailers, special effects, etc. for entertainment.
Vues Unity for Vues

Vue (Visual User Experience) is an asset bundle for VueXR platform that is created using unity editor as of now, this unity asset bundle is an archive file containing platform specific Assets(3D Models(mesh), Animations, Lights, Pbr materials, VFX, Particle systems, Physics materials, Event triggers, Sounds and even an entire scene) that can be loaded at runtime, unity asset bundle cannot hold an external script as of now. We don’t need any scripts in an asset bundle, therefore we will only be focusing on using the standard components provided by unity to create vues.

This section contains video tutorials of Unity basics,

Download Unity V 2020.x from the link given below,

https://unity3d.com/get-unity/download/archive

Basic Objects



Meshes



Materials







Textures



Particle systems (VFX)



Lights



Animations



Physics objects (Rigidbodies)



Prefabs



Physics materials



Colliders



Mesh Renderers and filters



Sounds



Unity Asset store



Unity’s official youtube channel

https://www.youtube.com/user/Unity3D/playlists?flow=grid&view=50&shelf_id=3

Vues Upload Vues

Once you are done with creating and testing of your object prefab, Build your Vue by clicking on VueXR Rig in the menu bar and click on build Vues.

There is a VueXR Rig menu in menu bar

It has 4 menu items

Build Vues

Upload Vue from unity

Upload Vue to VueXR website

And Download vue unity package

After completion of the build process. Now, your vues are ready to be uploaded

You can upload vue directly from unity or you can upload it via the VueXR website.

If you want to upload directly from unity click on upload vue from unity then add new vue

Give your credentials.Here is a new pop window of the VueXR rig. Fill the form with details. Select vue type, title and description. For the banner image, you have to upload an image with aspect ratio 16 cross 9 with a minimum resolution of 720 cross 405. You can also change the background colour for the web browser player. Select your Vue display mode as AR or VR. Select the spawn mode as anywhere or Vuespot for GPS based Vue and give the coordinates. Then simply click on upload.

After uploading you will find pop up window by clicking view button you will be redirected to the VueXR website. Again, by giving your credentials you can check your vue on the website.

If you want to upload directly to the VueXR website. Click on upload vue to VueXR website then click on add new vue. This will redirect you to the VueXR website. Now, give your credentials and log in. Here, give your Vue a title and description. Then select your category according to your vue. Select your vue banner image and upload it. Now for android Vue file go to unity screen then open My Vue folder there you will find one folder with your given name. Open the android folder by right-clicking, then select show in explorer here, click on the android folder there are two files. One is unity 3d file and another one is metafile. Select unity 3d file. Do the same for other three asset bundle. You can also change the background colour for the web browser player. Select your Vue display mode as AR or VR.

Last option is for the location where you want to show your vue. Anywhere or at specific GPS location. For anywhere just select this button. And for Vuespot give city name where you want to show this vue and select the coordinates on map and then select a radius, which is the visibility range of vue. Then check the rules of engagement box if you agree. And then click on save button.

You can upload your vue by these two methods. The first method of uploading directly from unity is quite short as compared to the second one. However, the choice is yours.

Let’s test, publish and share our Vue. Once you are done uploading the vue to the website . Go to VueXR app on your mobile device and sign in with the same ID that is used to upload the Vue, and follow this steps to test and publish it:

Click on the VueXR icon in the right bottom corner of the screen

Click on menu icon

Then go to my Vues

Click on uploaded Vues

Click on the card of vue uploaded by you which is unlisted at this moment

Click on download button showing the file size.

The vue is downloaded and played

Once you are happy with it, click on publish and it becomes available for the whole world to experience.

Vues VueXR Rig

It is an asset store package that allows users to upload and edit Vues asset bundles and unity packages directly from unity 3D to VueXR platform. VueXR is a Xtended reality platform that showcases the uploaded content in AR, VR and MR.

To upload a vue on VueXR you have to create an asset bundle first.

For that, go to the asset store and download VueXR Rig asset.

Download and Import this asset to your project .
Vue Rig

After importing VueXR rig file you will find VueXR Rig menu option in the menu bar
Vue Rig

You will find vue rig folder into the project window. There are 3 subfolders to the folder Editor, Resources, and Scenes. You don’t have to worry about all these folders except Scenes folder. Here in this folder, you will find a scene named VueXR Rig Scene. In the Hierarchy window, you can see an untitled scene which was loaded by default on unity startup.
We don't need this scene, we will be using VueXR Rig scene. Click on Rig scene to load it.
Vue Rig

The VueXR Rig scene is loaded with some objects by default. The main camera, Floorplane Directional light, Eventsystem, and VuePlayer.

In VueXR Rig,

The Observer resembles the viewer (user) in VueXR, its height is 1.4 meters which is an average human height. There is a camera located in the observer’s head, this camera allows the user to view the VueXR world with the perspective of a Human. Users have to use this observer as a reference to Position, Rotate and Scale the 3D objects while creating a Vue.
Vue Rig

For Vues we don’t need a scene means no camera at all, but we will use this main camera and light for reference only. VueXR already has a main camera in the scene and this camera is controlled by the user to view the scene in every direction.

Floor Plane

Vue Rig

The plane in VueXR rig is located at x-0, Y-0,Z-0. The plane represents ground in VueXR. We don’t need plane in our Vues as VueXR already has a plane which acts as a ground. This place also casts shadows of the objects.

Directional light

Vue Rig

Directional light is like a sunlight in a scene in unity, for this scene we will only use it for reference purpose only. And we don’t have to worry about its position and rotation you can change it for your reference.
VueXR uses light estimation in Vues, this works by estimating the visible light around the user’s device and adjusting the scene light while playing a vue. VueXR also plays XR content on GPS location, this type of Vue is called a Vuespot. To make a users experience more realistic for a VueSpot, VueXR uses the device’s gps location to cast light and shadows that resemble the sunlight for a location of a VueSpot.

Event system – we don’t need to worry about it, it is a part of canvas UI

Vueplayer

Vue Rig

Select it and go to the inspector window to explore its components. There is a script to spawn an object is attached to it.
These are all the objects that came along with the scene. You can create your object in this scene or you can simply drag and drop it from your other projects. Now create a prefab by dragging the object in your project window. Then drag the prefab you want to play in VueXR and drop it on Vue prefab to spawn, on the script component in the inspector window.
Vue Rig

Before you hit the play button please check aspect ratio in the game window. Select it 1920 by 1080 aspect ratio, if it is not visible then click on add button then manually add values to it.

Now Play your Vue

Vue Rig

You can view the scene from different angles simply by left click and drag the scene around in the game window
Vue Rig

Scroll up and down to zoom in and out of the scene,
Vue Rig

Pause the scene with this pause button.
Vue Rig

Take a snapshot using this button, you can use this as the cover banner for your Vue
Vue Rig

Click on this button to fly freely in 6 DOF using arrow keys, this allows you to test fly mode in your VR Vue
Vue Rig

Use this seek bar to adjust your moving speed in the test mode, similar option is available to viewers in the webGl
Vue Rig

Click on help button for help
Vue Rig

Click on this button to close your Vue in unity’s play mode
Vue Rig

Click on this button to reload your Vue in unity’s play mode
Vue Rig

Once you are done with creating and testing of your object prefab, its time to build Vue. Go to Vues option in the menu bar.

VueXR Rig menu

The VueXR Rig menu in the menu bar has 6 menu items with submenu items,

  • Build Vues

  • Upload Vue from unity
    • Add new Vue
    • Edit unlisted Vues

  • Upload Vue to VueXR website
    • Add new Vue
    • Edit unlisted Vues

  • Download vue unity package

  • Sign in

  • Sign out


  • Build Vues



    Select this option to build Vues. Once clicked, it will open build window, select the prefab you want to build and click on build button, it will automatically build Vue for all available platforms such as Android, IOS, and WebGL. It will also build unity package of your prefab.



    Once the build process is done You will find My Vues folder in project window into the assets. Now, your Vues are ready to be uploaded.



    You can upload Vue directly from unity or you can upload it via the VueXR website.

  • Upload Vue from unity



    • Add new Vue

      If you want to upload directly from unity click on upload vue from unity then click on add new vue. Give your credentials.



      A form is displayed. Fill the form with details. Select Vue type, title, and description. For the banner image, click on choose image and select the screenshot you took while playing the vue, you have to upload an image with aspect ratio 16 cross 9 with a minimum resolution of 720 X 405. You can also change the background color and display mode here. Set ambient light on/off and turn on/off interactivity as required. Then simply click on upload. After uploading you will find pop up window by clicking view button you will be redirected to the VueXR website. Again, by giving your credentials you can check your Vue on the website.





    • Edit unlisted Vues

      Now, what if you want to edit your vue. To edit your vue, first, unlist it using your mobile device. Editing and uploading again are quite easy here, You can edit vue directly from unity or you can edit it via the VueXR website.





      First, let’s edit our vue directly from unity, after making the required changes, click on apply to update your prefab. Then go to vue and click on build vue. After completion of the build process, one popup window will be displayed do not select upload. Select Cancel Then go to upload vue from unity then click on edit unlisted vues.

      Login with your credentials. It will show you all unlisted vues. Select the vue you want to edit.



      If you want to edit anything in form edit it and save it.



      Then click on go ahead in the popup window. Click on view button, it will redirect you to vue website. Here, you can check your edited vue.

  • Upload Vue to VueXR website

    • Add new Vue

      To upload directly to the VueXR website. Click on upload vue to the VueXR website then click on add new vue. This will redirect you to the VueXR website.



      Now, give your credentials and log in. Here, give Vue title and description. Then select your category according to your Vue. Select your Vue banner image and upload it. Now for android Vue file go to unity screen then open My Vues folder, here you will find one folder with your given name. Open the android folder by right-clicking, then select show in explorer here, click on the android folder there are two files. One is unity 3d file and another one is metafile. Select unity 3d file. Do the same for other three asset bundle and the unity package. Now select the display mode. And you can select any background color for webgl view of your Vue. Last option is for the location where you want to show your Vue. Anywhere or at specific GPS location.

      For anywhere just select this button and for Vuespot give the city name where you want to show this Vue and then select radius which is the visibility range of Vue, then click the button of rules of engagement. And then click on save button.

      You can upload your vue by these two methods. The first method of uploading directly from unity is quite short as compared to the second one. However, the choice is yours.


    • Edit unlisted Vues



      To edit our Vue from the VueXR website, Make your required changes and go to VueXR Rig and click on build Vue. After completion of the build process, one pop-up window will be displayed do not select upload. Please select cancel

      Now go to upload Vue to the VueXR website then click on edit unlisted Vues. This will redirect you to the VueXR website. Now, give your credentials and log in. Edit, title, description, category and banner image if required.

      Now update the Vue files for all available platforms. Now for android Vue file go to unity screen then open My Vue folder there you will find one folder with your given name. Open the android folder by right-clicking, then select show in explorer here, click on the android folder, there are two files. One is unity 3d file and another one is metafile. Select unity 3d file. Do the same for other three Vue files and unity package. Edit the display mode, background color and anywhere or Vuespot option if required. And then click on save button.

  • Download Vue unity package



    And the last option is for downloading your uploaded Vue unity export package from www.VueXR.com you can use this option if you don’t have your Vue project with you and you want to edit it.


To test and Publish Vue

Once you are done uploading the Vue to the website go to VueXR app on your mobile device sign in with the same ID (used to upload Vues) and follow this steps to test and publish it:

  • Click on the VueXR icon in the right bottom corner of the screen

  • Click on Vues icon

  • Click on uploaded Vues icon

  • Click on the card of vue uploaded by you which is unlisted at this moment

  • Click on view

The Vue is downloaded and played, once you are happy with it, click on publish and it becomes available for the whole world to experience.