Manga example

Animation-like effects can be achieved with only shaders by using a time parameter. This example shows one such effect

  • First, open DeepAR Studio, go to File → Create new effect

  • Select Root and in Node Properties, change the Position mode to Position in camera space

  • Next, go to Node → Add Quad

  • Select the Quad and in Node Properties, set the layer to Post process layer

  • Go to Assets → Set shader paths and add a new a path to the manga shader, provided in the Time_dependent_example folder

  • Go to Assets → Compile shaders, compile and ensure the manga shader successfully compiled

  • Now, select the Quad

  • In Material properties under Select shader choose Manga

  • For the Postprocessing texture uniform choose the Postprocessing texture, and set a Color (optional)

At this time the effect will be visible but not animated. This is because the u_currentTime uniform of the shader has not been set from the engine.

To set and update the u_currentTime uniform and achieve the animated look select the Quad and add Shader Time through Add Component in the menu bar.

Now you should have the moving lines on the screen, you can further customize the effect by selecting Quad and changing the value of the uniforms (Speed, Color, Size, Center X and Center Y) under Material properties.

Download this example with all assets

Did this answer your question?