[Unity/PlayMaker] How to use Post Processing Stack V1 (for STYLY mobile app creators)

The latest version of Unity’s post-processing currently only works in STYLY VR, so it cannot be used in AR.

This time, we will explain how to use a post-processing method that can also be used with the STYLY mobile app. This method can be used in both AR and VR scenes.

In this article, we will use Post Processing Stack V1 and PlayMaker (paid).

What is post-processing?

Post-effects refers to the application of effects (filters) to “the result of rendering the information (3D model, lights, etc.) captured by the camera on the display.

Think of the camera application “SNOW” or the image editing software “Photoshop”.

In Unity, the Post Processing Stack provided by Unity can be used by downloading and importing the Post Processing Stack from the Package Manager.

This is a useful feature because it allows you to improve the quality of a scene in a few simple steps.

Introduction

We will use Unity2022.3.27f1.

First, install the STYLY Plugin for Unity.

STYLY Plugin for Unity

STYLY Plugin for Unity


Download the STYLY Plugin from the link in the above article and import it via Assets→Import Package→Custom Package.

Assets→Import Package→Custom Package

Assets→Import Package→Custom Package


Right-click on Assets and click Show in Explorer to display the file in Explorer.

Show in Explorer

Show in Explorer


Next, download the STYLY-Unity-Examples repository from GitHub as a Zip.

STYLY-Unity-Examples

STYLY-Unity-Examples


https://github.com/styly-dev/STYLY-Unity-Examples

Unzip the downloaded Zip file,

Copy the folder /Assets/STYLY_Examples/SetPostProcessing

folder under Assets in the previously opened Unity project.

Assets/STYLY_Examples/SetPostProcessing→Assets

Assets/STYLY_Examples/SetPostProcessing→Assets


A folder called SetPostProcessing will then be added to the Assets section of the Unity screen.

SetPostProcessing

SetPostProcessing


Drag and drop SetPostProcessing/Prefabs/SetPostProcessing(Upload to STYLY) into the hierarchy.

SetPostProcessing/Prefabs/SetPostProcessing(Upload to STYLY)

SetPostProcessing/Prefabs/SetPostProcessing(Upload to STYLY)


Import Post-Processing Stack V1 and Playmaker (paid).

See the following article for instructions on how to install Playmaker.

If you have already purchased Playmake, please install Playmaker from Package Manager→My Assets.

Package Manager→My Assets→Playmaker

Package Manager→My Assets→Playmaker


Download Post-Processing Stack V1 from the following URL and import it in Unity via Assets→Import Package→Custom Package.

Download Post-Processing Stack V1

Download Post-Processing Stack V1


https://github.com/Unity-Technologies/PostProcessing/releases/tag/1.0.4

Assets→Import Package→Custom Package

Assets→Import Package→Custom Package


Post-Processing Stack V1

Post-Processing Stack V1


This will cause an error, so we will modify it slightly.

After import is complete, right-click on Assets/PostProcessing/Editor/PropertyDrawers/Min Drawer in Unity and click Show in Explorer to view the file in Explorer.

Assets/PostProcessing/Editor/PropertyDrawers/Min Drawer→Show in Explorer

Assets/PostProcessing/Editor/PropertyDrawers/Min Drawer→Show in Explorer


Double-click MinDrawer.cs to open VisualStudio and modify its contents.

MinDrawer.cs→VisualStudio

MinDrawer.cs→VisualStudio


Line 2 : using UnityEngine.PostProcessing;

using UnityEngine.PostProcessing;

using UnityEngine.PostProcessing;


Line 2 : using MinAttribute = UnityEngine.PostProcessing.MinAttribute;

using MinAttribute = UnityEngine.PostProcessing.MinAttribute;

using MinAttribute = UnityEngine.PostProcessing.MinAttribute;


After modifying the file, press Ctrl+[S] to save and close VisualStudio.

When you return to Unity, you will see a screen like this, click “Yes, for these and other files that might be found later”.

”Yes,  for these and other files that might be found later”

”Yes,  for these and other files that might be found later”


Add an object to the scene so that the post-process changes can be easily seen.

Right-click in the hierarchy and add 3D Object→Cube.

Then right-click anywhere on the asset and Create→Material.

3D Object→Cube、Create→Material

3D Object→Cube、Create→Material


Check Emission from the Inspector for the material, change the color to the color you want and change Intensity to 1.

Emission→Intensity=1

Emission→Intensity=1


If you run (play) the Unity editor in this state, you will see the changes in the scene.

Play Scene

Play Scene


Bloom

Bloom


This completes the installation.

How to use SetPostProcessing

Double-click PostProcessing Profile in the inspector of SetPostProcessing (Upload to STYLY) in the hierarchy to display the list of effects.

SetPostProcessing(Upload to STYLY)→PostProcessing Profile

SetPostProcessing(Upload to STYLY)→PostProcessing Profile


Change these parameters and values to create a scene to your liking.

Change parameters

Change parameters


Please check the article below to see how the appearance of each item changes.

If you check the scene in the STYLY app, you will see that the post-processing bloom is on in AR.

AR

AR

Cautions for use

Some PostProcessing Profile settings are not suitable for STYLY or VR.

STYLY settings that cannot be used (due to Forward Rendering/MSAA enabled)

Placing multiple SetPostProcesses in the same scene will cause conflicts. It also conflicts with STYLY’s Filter function, so do not use it.

・Fog:It can only be used with deferred Rendering Path.

・Antialiasing : Only Fast Approximate Anti-aliasing is available; Temporal Anit-aliasing is not available.

・Screen Space Reflection

Items not suitable for use in VR scenes

・Depth Of Field

・Motion Blur

・Chromatic Aberration:Effect of chromatic aberration toward the edges of the screen; not so effective in VR.

・Grain:Noise effect on the screen, not recommended for VR.

・Vignette:An effect that blurs the periphery of the screen to black, not recommended for VR.

Uploading to STYLY

Let’s actually upload the scene to STYLY and use it.

When using Post Processing, upload the entire scene, not Prefab.

This time we will upload the Unity scene directly to STYLY.

Create a STYLY account

account