wiki.sine.space | sinespace

Gestures/Snapshot Tools

From wiki.sine.space
Jump to: navigation, search

Introduction

The snapshot tools allow users to create camera positions, filters, poses & overlays that can be used for taking awesome pictures in Sinespace using the snapshot system. In the tutorials below we will cover how to make and upload your own snapshot tools that you can sell in the shop or share with other users.

Setting Up The Scene (Beginner)

Snapshot1.png

In the drop down menu select About Sinespace and create a new region by clicking the Create region button in the box that appears.

Snapshot2.png

In the hierarchy select the landmark and disable it, we wont be needing it for this tutorial.

Snapshot3.png

We want to be able to preview what we are doing so at the top of the main window grab the game tab and drag it down and to the right to make a split screen as show above.

Snapshot4.png

In the hierarchy right click to add a camera to the scene.

Snapshot5.png

In the search bar above the project window search for 2017 male or female avatar, drag the model into the hierarchy.

Snapshot6.png

In your scene window use your mouse & scroll wheel to position yourself on the avatar, in hierarchy select the main camera and press cntrl-shift-f to focus the camera on the avatar.

Creating Snapshot Filters

Snapshot filters are used to change the post processing effects while using the snapshot tool, we use Unity's post processing tools to create an effect to upload to Sinespace.

SnapshotFilter1.png

In order to see the changes we make to the post processing effects we need to add a post processing layer to the main camera. Select the camera in the hierarchy and click the add component button in the inspector, add the post processing layer component.

SnapshotFilter2.png

In your project window right click and select create/post processing profile, name it custom profile (you can name this whatever you like).

SnapshotFilter3.png

In the hierarchy select the Post Processing Settings and make sure Is Global is checked, set a high priority number 99999999 and then drag your custom profile from the project window into the profile section of the post processing volume component. Important : make sure that the layer at the top of the inspector is set to transparentFX.

SnapshotFilter4.png

Click on the custom profile in the project window then in the inspector click add effect, for this tutorial we will only be using the color grading tools but you can add any effects you like.

SnapshotFilter5.png

At this point we can check to see if the post processing effects are working by changing the post-exposure in the inspector window to an extreme value. You should now see an over exposed effect in our "preview window".

SnapshotFilter6.png

If the post processing is not visible in the preview window click on the camera in the hierarchy and looking in the post processing layer component, ensure that the layer field is set to everything, also check that the layer is set to transparentFX when clicking on the post processing settings in the hierarchy (this setting can be found at the top of the inspector window).

SnapshotFilter7.png

Next we will create our filter effect, click on the custom post profile in the project window and reset the exposure back to 0, check the color filter checkbox and click in the color box to the right for this tutorial I have set the color to hex code #DF83FF.

SnapshotFilter8.png

Next we will change some channel mixers settings, select the red filter tab and check the red/green/blue check boxes to enable them, set the values red -7, green - 57, blue 59.

SnapshotFilter9.png

Select the blue channel tab and again set the red/green/blue check boxes to enable them, set the values red 12, green -12, blue 27.

SnapshotFilter10.png

Now we will setup the blue channel, click the blue channel tab and enable the red/green/blue channel check boxes, set the values red 41, green 93, blue 172.

SnapshotFilter11.png

Finally to finish off the effect we will set some of the other settings in the custom profile, set the following value : mode ACES, temperature 20.1, post-exposure 2.33, saturation -38.3, contrast -5.9.

SnapshotFilter12.png

We are now ready to upload our effect to Sinespace, right click in the hierarchy and create an empty game object (name it as required), in the inspector click on the add component button and add the screenshot filter component, drag our custom profile from the project window into the post processing v2 field in the screenshot filter component.

SnapshotFilter13.png

While still having our empty game object selected click on the add component button in the inspector and add a virtual goods component, in the type field set Custom, custom type is InventoryCameraFilter and category is effects/snapshot/filter. Fill in the rest of the virtual goods as required.

SnapshotF14.png

Finally drag our empty game object from the hierarchy into the project window to prefab it, right click on the prefab and select upload to Sinespace (this can now be viewed on the preview server once processing is complete).

Creating Snapshot Poses

Snapshot poses allow us to be able to upload custom poses/animations that we can use in the snapshot tool in Sinespace. For this tutorial we will need to have created a pose or animation using an animation program or you can down load animations from a site such as https://mixamo.com.

SnapshotPose 1.png

Drag your chosen animation into the project window and click on it, in the inspector under the rig tab make sure the animation type is set to humanoid and click apply.

SnapshotPose 2.png

We need our animation to be looped so selected the animation tab in the inspector and check the loop time checkbox.

SnapshotPose 3.png

If you have downloaded an animation from Mixamo we will need to change the animation so it is not read only, this is so that we can edit it later in the tutorial, click the arrow next to your animations prefab (blue box) click on the animation as arrowed above and click cntrl-D to duplicate it. You can now delete the original animation prefab as this is no longer required.

Snapshot Pose 4.png

We now need to be able to preview the animation inside of the editor so we can work with it, right click in the project window and select create/Animator Controller and name it Custom Controller.

Snapshot Pose 5.png

Select the 2017 avatar in the hierarchy and click on the add component button in the inspector, add an animator controller component and drag our custom controller into the controller field. Make sure the avatar has the correct 2015 profile for the avatar we are using either male/female.

SnapshotPose 6.png

While still having the 2017 avatar selected click on the animator tab above the main scene window, if you don't have this tab your can right click on the scene tab and click add new tab/animator. Drag our animation into the animator window from the project window.

SnapshotPose 7.png

Now select the animation tab above the project window, if you don't have this tab you can add it by right clicking the project tab and select add tab/animation. Now if you grab the white time line in the animator window while holding the left mouse button you can scrub through the time line, the animation will be shown on our avatar in the preview window.

Snapshot Pose 8.png

You can upload full animations to Sinespace for use in the snapshot system, for this tutorial I am going to create a static pose. Scrub through the time line and find a pose that you like then work through the time line and delete the key frames that are no longer needed until you have only that key frame left as pictured above.

Snapshot Pose 9.png

Our avatar looks a little miserable for a picture so lets give her a smile, in the animation window click the record button then in the hierarchy open up 2017 avatar and click on either the femalebody or malebody found under Geo_GRP. In the inspector under the skinned mesh renderer open up the blend shapes menu by clicking the arrow next to blend shapes.

Snapshot Pose 10.png

We will change some of the mouth settings to make our avatar smile, for the tutorial i will set the mouth_anim.mouth_ah to 50 and the moth_anim.mouth_eee to 25, you can change other settings to suit. Warning : do not change anything that has slider in the name, this will break things in world. Our blend shape changes will now have been saved to the animation so we can click on the record button in the animation window to stop recording.