Tutorial 3

Tutorial 3- Spark AR

Intro

Main Content

To complete the navigation, open the patch editor
make the following setup
1)Drag 2d node needs to be first imported from the resources folder
2)The device node can be brought in by dragging the devie from the hierarchy in the scene panel.
3)Hook the object tap from map icon to "drag enabled" in the drag 2d node and also connect it the visibility from "map".

Now we need to restrict the range of pointer...we can do this by using a clamp node(clamp node restricts between 2 values)Make the clamp node to be vector 2. Then use divide patch and make it vector 2 as well....fill 3 in both x and y because we scaled the map by 3 earlier....Connect it to position of pointer.

Now we need to hook the movement of the camera with these values...we will do this by hooking our main world root object in the opposite direction to create a sense of the camera moving...
First we use the from range node and make it vector 2 as well.(This node converts the range values between 0 and 1)...Now we have the values from 0 to 1....we need to convert these to actual position values....these position values will be choosen according to the size of your world....make sure that at the extremes the camera does not go outside the skysphere....I will be using 1 unit as a demo...So now we have to convert 0-1 to (-1) and 1...we will multiply by 2 and add -1.....in the y axis we have tested that multiplying by -2 and adding 1 works
we will use unpack node to get individual values....then we will get pack node and make it vector 3....connect x to x.....connect y to z....write -1 in the y value....connect it to world root position.

Short Summary

Connect the pointer, connect the world root

Resources

drag 2d node

Fun Points

The user can play with different values to see the effect to understand it better

Comments

Post a Comment

Popular posts from this blog

Tutorial 4

Tutorial 4- Spark AR Intro Main Content To make the instructions  1)Add a rectangle by right clicking on the canvas....make sure the rectangle is on the same layer as canvas....this will be used as a temporary button to toggle the info screen until the native ui picker is hooked properly....rename it accordingly......move the rectangle to top right of the screen. Create a new material in the assets panel and name it info_icon....use the info_icon image as the texture of the image....Apply the material to the texture 2)Add another rectangle by right clicking on the canvas....make sure the rectangle is on the same layer as canvas....this will be used as info screen....rename it "instructions" .create and add material in the same way as before....Scale this by 3 on all axes by filling the values in properties panel. 3)Add object tap to info_icon and connect it with the visibility of info screen Short Summary connect the info screen Resources info icon and instructions image Fun ...
Read more

Tutorial 6

Image
Tutorial 6- Spark AR Intro Main Content To make the rain effect add an emitter in the scene....drag it up in the y axis a little bit so that it is just out of the camera....play with different values to see what effects what....use the values below to get the result similar to below...change the material to raindrop material....make sure the emitter has a new layer of its own and is topmost on the layer list   Hook the visibility of the emitter with the third variable of the native ui picker Short Summary add emitter, change layers, change values, change materials, hook with native ui picker Resources raindrop texture Fun Points play with different values to show what else can be done
Read more