Characters’ parallax frame

By 14/02/2019 General

Here’s how to create a really simple parallax effect in Unity, in this case in the game’s UI.

You can also read my tutorial about How to create UI for all resolutions.

  • Check if the mouse is inside the Rect, then rotate it based on its distance from the centre.
  • Setup the Character’s frame adding what you prefer; I’ve added a Mask (so the character doesn’t go outside the panel when rotating), a Text and an Image.
  • To create the “Parallax” effect while the panel rotates, move the characters’ image (or the element where you want the effect) backwards/forward. On my example the Z value of the Slime’s transform is set to -100.
  • Reset the target rotation if the mouse is outside the rect and rotate it smoothly.
    • I’m using the function AngleLerp, because if you try to use Vector3.Lerp etc, the transition doesn’t work properly and the angle messes up.

There is more!

Read Bonus and Exclusive content, Get Updated when I release new posts, see Behind The Scenes, learn italian words and recipes (it is a joke.. maybe), all for free from your friendly and not-a-corporation febucci! Also, No Spam! Only a few emails each month (and you can unsubscribe at any time)! Give it a try and join us!

Support this blog

From "sharing my posts around" to "contributions on Patreon", this website exists thanks to the support of these awesome people! Please consider supporting me so I can keep producing tutorials for everyone! Thanks!

Become a Patron!