UNITY 3D REPLICANICS: Replicating Steam’s Collectible Card Display Mechanic — Part III
--
Replicanic /ˈrɛplɪkanɪk/: A blend of replicate and mechanic. The term aims to define the act of duplicating mechanics from any commercial application in your game engine of choice. The main idea of this exercise is to learn through observation and analysis. Although the term Replicanic may be made up (copyright pending), the idea it represents is a widely used technique for improving one’s skills. Go ahead, challenge yourself!
After adjusting our project to fit Unity’s dynamic lighting system, we are ready to create our custom shader to complete the effect. Let’s take a final look at the objective and our progress.
Objective:
The objective is to replicate Steam’s collectible card display mechanics.
So Far:
Our progress from parts 1 and 2:
- They are activated when the cursor hovers over them, and they deactivate after the cursor moves away.
- They rotate based on the cursor’s position over them.
- They scale up when active and scale back down when inactive.
- They are affected by subtle top-down lighting.
- They simulate a forced perspective that is centered on each card individually.
- Once selected, they project a soft shadow behind them.
Custom Shader:
To replicate the illusion of perspective in each card, we will take advantage of Shader Graph’s nodes to manipulate the rendering of our card objects.
Note: You have to install the Shader Graph package from the package manager inside of Unity. Unity Documentation Link
In a new directory named Shaders, we can right-click to create a new Lit Shader.