• Register

Multimedia Fusion is the perfect tool for creating applications, multimedia applications and exciting games. MMF continues the amazingly powerful graphical programming interface started with Klik & Play and continued with The Games Factory. Powerful new objects, exciting new transitions and a graphics library packed with megabytes of royalty free graphics and sounds. We also offer an SDK package so you can make your own extensions using C++ and plug them into MMF.

Post tutorial Report RSS How to make 2D games look better by adding realism with a drop shadow - Clickteam Fusion

When I was young, I always wondered why some games seem more real to my eye and others not. Why some of them gave me a false impression of depth and solidity and others seemed like the characters were floating. It didn’t take me long to understand that shadows were the trick.

Posted by on - Basic Other

When I was young, I always wondered why some games seem more real to my eye and others not. Why some of them gave me a false impression of depth and solidity and others seemed like the characters were floating. It didn’t take me long to understand that shadows were the trick.

In 3D graphics, automatic shadow casting is most of the times implemented in graphics engines and adding just a couple of light sources will do the trick. In 2D though it is a harder process and there have been several ways to achieve a good result. Three common ways are the following:

article 01 01article 01 02article 01 03


  1. The easiest of all is just a black filled circle under the moving character.
  2. The second one is an exact copy of the character which has synchronized animation.
  3. The third type is as number 2 but also it changes direction, depending on the angle of the closest light source.

For Maniakos Mineras, I have selected the 2nd approach and here is a step by step explanation of the process.

  • Clone the Active object
  • In the properties window, go to Display Options – Effect – RGB Coefficient and select the Black color
  • You could put a blend value as an effect too (I put something around 80)
  • In the properties window, go to Size / Position – Angle and put a value around 60 degrees
  • In the event editor (if you have the commercial version of Fusion you may do it in the Behavior of the shadow also), create an always event and put the position relative to your character at the desired position
  • In the same event you can add the animation synchronization

article 01 04


Personaly I am very pleased with the result and I feel it gives a touch of realism without much work. Especially the fact that even the shadow is animated (due to the fact that it is a copy of the original active object) makes the whole effect look very polished.

A good addition would be to change the angle of the shadow depending on where the nearest shadow comes from. It would be little tricky but I think it would be possible.

Post a comment
Sign in or join with:

Only registered members can share their thoughts. So come on! Join the community today (totally free - or sign in with your social account on the right) and join in the conversation.

Follow Report Profile
Platforms
Windows
Company
Clickteam
Contact
Send Message
Homepage
Clickteam.com
Licence
Commercial
Release date
Engine watch
Follow
Related Engines
Multimedia Fusion
Multimedia Fusion Commercial
Related Groups
Clickteam
Clickteam Developer & Publisher with 2 members
Indie Devs
Indie Devs Hobbies & Interests with 1,652 members