Creating a smoke trail effect with spinning circle sprites
A while ago a saw a really awesome prototype gif from a developer who’s work I’ve come to love: stuffed wombat
final look & name for the comic game pic.twitter.com/uc9uYjzWhI
— Stuffed Wombat (@wombatstuff) March 27, 2018
I loved the effect of the seeming alive smoke trails. The way they seemed to move in on themselves in this 1 bit style really appealed to me. In the responses to the tweet someone else picked up on this effect as well and asked about it. The method was so simple and clever its amazing I never thought to do anything like it.
Each part of the smoke “cloud” is just 2 small rotating circles, a white outer circle and a black inner circle. The black inner circle always draws over top of the white outer circles so the white outline gets covered over by other circles when they overlap!
It certainly isn’t the most optimized solution but it would suffice for the small nice touch type of effect it is. Additionally I realized this is likely how he handles the textbox overlaps where they seem to join into one textbox as well. Brilliant!
Here’s a quick gif of my implementation of this (which took just a few minutes because the effect is so simple):
For those who want to see source code, here is a quick and sloppily put together scene I made to work in Nez (FNA).
Full credit to @wombatstuff for this great little effect.