TGB particles, and such...
by Magnus Blikstad · 04/10/2007 (8:33 pm) · 17 comments
Hello all, long time since I got around to write anything here, been awfully busy (as usual I suppose).
In either case, what have I've been up to then? Well, also as usual, lots of stuff I can't talk about yet etc so let's just skip that. I have had a chance to work a lot with TGB lately though, which is perfectly fine with me. There's a lot of interesting ways to "cheat" when you're working with 2d art and effects...
The challenge
One of my recent challenges came when Jon Frisby needed nicely animated grass in his game Harmonic Convergence, I promised him to do a little write up about how I ended up doing it so I figured I might as well put it into a blog here. My first thought was of course to just create a number of animated sprites but I quickly realized this would both take me way too long to get it "just right", require a rather large amount of images to get the animation smooth and most likely have various issues with the animations being obviously looped and such.
Particles to the rescue
The solution ended up being particles! It's of course pretty obvious, but the way I ended up going about it may not be. You could use one particle per "strand", but this would quickly get prohibitive due to way too many particles. What I did was to create one(!) image frame of a couple of dozen of strands (fig 1). (it was created with the 3d studio max "hair and fur" system by the way (fig 2)). The fact that I only needed a single image to make the effect work of course saves on both resources (texture memory, download size and what not) and the time needed to produce the stuff.

Systems a go
This is the particle system I ended up with (don't worry, I'll explain what makes it tick in a moment), there IS a lot of "cheating" going on here. For one a particle can't have infinite life, like a piece of grass (at least not with the TGB particle system they can't). So the "sheets" of grass are constantly being faded in/out, the trick is to tweak the life, size and other parameters just right so it doesn't become too obvious.
As you can see by the image to the right our particle system will play infinitely, the particles will be spawned on the extent of the entity in the editor on the X axis (LINEX) and it's using our single frame grass imagemap for the particles.
Getting all the parameters correct will most certainly take some messing, what you want is a rather long life for your particles and a rather high quantity (not too high though, you have to balance this against the life of your particle so you don't get too many). Further you don't want your particles to move (since grass really doesn't "move" now does it?), you instead give them a tiny amount of spin (notice that I have the limits set to a very, very low amount in the image to the right).

To make the fading in/out thing something you don't really think about I came up with this visibility graph.
Covering up
Due to the spinning of the particles the bottom of the effect will always look pretty horrible, so what do we do when something looks horrible? We cover it up of course! Just adding a big static sprite on top of the effect to make sure nothing shows that we don't want to and we're done.
Here's the finished effect in the TGB editor; I had to use two separate grass particle systems for this particular level (the stuff on the far right is a separate system).

In motion
And since all of this REALLY can't be made justice with just static images here's a video for you too! (it does look a bit sharper in the game, stupid video compression killing it a bit). All the levels in the video use the same basic effect with a few tiny parameters tweaked and the grass image switched out. As you can see you can get a quite different effect with only very minor changes.
www.blikstad.com/gg/grass_particles.wmv
Hope I've managed to show you you can do some very nice things with TGBs particles, this particular system could be used for a lot of things like fur or hair or whatever. I'm also using some very similar ideas to create animated water/waves and nice subtle light beams and such.
Other stuff...
In addition to working with Jon on Harmonic Convergence I've been working with some of the final things on GameSlingers TaeKwonDo World Champion... getting really close to release now.
Then of course we have all that secret stuff I'm not allowed to talk about, but well... as I said before, we'll take that another day... =)
I also of course have to shout out a huge congratulations to Josh and Lara on the pending wedding!
In conclusion
I'm finishing up some contracts at the moment, so, if you have any art that need to be done or any problems that need fixing feel free to take a look at my portfolio, my profile or simply fire off an email (magnus@witentertainment.com) and we'll talk.

In either case, what have I've been up to then? Well, also as usual, lots of stuff I can't talk about yet etc so let's just skip that. I have had a chance to work a lot with TGB lately though, which is perfectly fine with me. There's a lot of interesting ways to "cheat" when you're working with 2d art and effects...
The challengeOne of my recent challenges came when Jon Frisby needed nicely animated grass in his game Harmonic Convergence, I promised him to do a little write up about how I ended up doing it so I figured I might as well put it into a blog here. My first thought was of course to just create a number of animated sprites but I quickly realized this would both take me way too long to get it "just right", require a rather large amount of images to get the animation smooth and most likely have various issues with the animations being obviously looped and such.
Particles to the rescueThe solution ended up being particles! It's of course pretty obvious, but the way I ended up going about it may not be. You could use one particle per "strand", but this would quickly get prohibitive due to way too many particles. What I did was to create one(!) image frame of a couple of dozen of strands (fig 1). (it was created with the 3d studio max "hair and fur" system by the way (fig 2)). The fact that I only needed a single image to make the effect work of course saves on both resources (texture memory, download size and what not) and the time needed to produce the stuff.

Systems a goThis is the particle system I ended up with (don't worry, I'll explain what makes it tick in a moment), there IS a lot of "cheating" going on here. For one a particle can't have infinite life, like a piece of grass (at least not with the TGB particle system they can't). So the "sheets" of grass are constantly being faded in/out, the trick is to tweak the life, size and other parameters just right so it doesn't become too obvious.
As you can see by the image to the right our particle system will play infinitely, the particles will be spawned on the extent of the entity in the editor on the X axis (LINEX) and it's using our single frame grass imagemap for the particles.
Getting all the parameters correct will most certainly take some messing, what you want is a rather long life for your particles and a rather high quantity (not too high though, you have to balance this against the life of your particle so you don't get too many). Further you don't want your particles to move (since grass really doesn't "move" now does it?), you instead give them a tiny amount of spin (notice that I have the limits set to a very, very low amount in the image to the right).
To make the fading in/out thing something you don't really think about I came up with this visibility graph.
Covering upDue to the spinning of the particles the bottom of the effect will always look pretty horrible, so what do we do when something looks horrible? We cover it up of course! Just adding a big static sprite on top of the effect to make sure nothing shows that we don't want to and we're done.
Here's the finished effect in the TGB editor; I had to use two separate grass particle systems for this particular level (the stuff on the far right is a separate system).

In motion
And since all of this REALLY can't be made justice with just static images here's a video for you too! (it does look a bit sharper in the game, stupid video compression killing it a bit). All the levels in the video use the same basic effect with a few tiny parameters tweaked and the grass image switched out. As you can see you can get a quite different effect with only very minor changes.
www.blikstad.com/gg/grass_particles.wmv
Hope I've managed to show you you can do some very nice things with TGBs particles, this particular system could be used for a lot of things like fur or hair or whatever. I'm also using some very similar ideas to create animated water/waves and nice subtle light beams and such.
Other stuff...In addition to working with Jon on Harmonic Convergence I've been working with some of the final things on GameSlingers TaeKwonDo World Champion... getting really close to release now.
Then of course we have all that secret stuff I'm not allowed to talk about, but well... as I said before, we'll take that another day... =)
I also of course have to shout out a huge congratulations to Josh and Lara on the pending wedding!
In conclusion
I'm finishing up some contracts at the moment, so, if you have any art that need to be done or any problems that need fixing feel free to take a look at my portfolio, my profile or simply fire off an email (magnus@witentertainment.com) and we'll talk.

#2
04/10/2007 (8:57 pm)
Very cool. Although, if you watch the grass it seems to be constantly spinning in one direction rather than swaying. Is there anything you can do to counteract this effect?
#3
04/10/2007 (9:02 pm)
great write-up ! and the effect is nice too.
#4
04/10/2007 (9:13 pm)
Thomas, yes, you can definitely make the grass sway back/forth more (just vary the 'spin life' graph more), but this always end up making the fact that the "grass sprites" don't have infinite life much more obvious. In this case I preferred the way I did it since it over all looked much smoother. (and you're generally a bit too busy to study the grass in great detail while playing the game so it works out well in that regard too =).
#5
04/10/2007 (9:57 pm)
Are you doing all the art in HC or just detail work? The HC video looks fabulous.
#7
04/10/2007 (10:29 pm)
Joshua; No, I can't take the credit for most of the HC art. My responsibilities there are mostly "fix things and make them look better". =)
#8
04/11/2007 (5:45 am)
What a beautiful use of particles, good job! Maybe we should create an area on TDN for random creative uses of the particle system, with writeups such as this.
#9
04/11/2007 (5:51 am)
@Magnus: Makes sense. Looks very sweet, nonetheless. Thanks for sharing this with us. :)
#10
04/11/2007 (8:42 am)
Checked out the video Magnus, Wow, I thought it was very impressive! In addition to the animated grass, the clouds, waterfalls and leafs etc all look great too, this looks like a potential candidate for the gg shop!
#11
04/11/2007 (10:34 am)
@Magnus: Cool with that taekwondo game, being a taekwondo practitioner myself and all. We're not that spoiled with taekwondo in games so far - the only ones I can recall is some old C64 game and Whoarang & Baek in the Tekken series...
#12
Great job ... and I loved the write up, always nice to see some creative juices flowing ...
04/11/2007 (5:18 pm)
Couldn't the 'sway' effect also be accomplished by stacking two copies of the effect on top of each other and flipping one of them ... so it renders 'backwards' ... maybe reduce the number of grass blades in the effect to do this so the effect isn't overly saturated with grass when you stack them on top of each other ... not sure how particle effects work, but if you can do a simple 'Flip X' on them ... that might accomplish quite a nice effect ... Great job ... and I loved the write up, always nice to see some creative juices flowing ...
#13
@David, depends on what sort of effect you're after, you'd have to play with it a bit and see what happens. My particles already rotate "both ways" as it is (just they don't change direction that often, as I said before you can do this by just messing with the spin life graph).
There was definitely a reason I made the straws look like they were facing only one direction though, pretty much the same reason as I posted above; makes the effect smoother. What I was going for here was to make something look pretty seamless without anything sticking out. Having the grass pointing in different directions could work in some situations but it would definitely make the effect "harder" (as opposed to "smooth", and only for the lack of a better word).
04/11/2007 (7:54 pm)
@Johan, yeah... It's interesting. I knew absolutely nothing about taekwondo.... but the guys making this game sure do so I've had to learn (well, theoretically at least =).@David, depends on what sort of effect you're after, you'd have to play with it a bit and see what happens. My particles already rotate "both ways" as it is (just they don't change direction that often, as I said before you can do this by just messing with the spin life graph).
There was definitely a reason I made the straws look like they were facing only one direction though, pretty much the same reason as I posted above; makes the effect smoother. What I was going for here was to make something look pretty seamless without anything sticking out. Having the grass pointing in different directions could work in some situations but it would definitely make the effect "harder" (as opposed to "smooth", and only for the lack of a better word).
#14
04/12/2007 (4:11 am)
nice! I have been having fun with particles making waterfalls and clouds. This is a definate unique system here. Great Jorb!
#15
Thinking about it, allowing particles to live infinitely is a crazy-easy feature to add and I'm not sure why I only allowed it on single-particles now. I think it would probably be better to define its life as usual using the normalized 0->1 system but allow something similar to the emitter e.g. die @ 1.0 (default behavior), cycle back to 0.0 or clamp @ 1.0. At least this way you could define its behavior over a period of time and either die, repeat ad-infinitum (or for a specific number of cycles) or freeze @ 1.0 settings.
Again, great work and nice write-up!
- Melv.
04/12/2007 (8:18 am)
It's always cool to see subtle and accurate usage of a particle system; it's amazing how some minor tweaks can make such a big difference.Thinking about it, allowing particles to live infinitely is a crazy-easy feature to add and I'm not sure why I only allowed it on single-particles now. I think it would probably be better to define its life as usual using the normalized 0->1 system but allow something similar to the emitter e.g. die @ 1.0 (default behavior), cycle back to 0.0 or clamp @ 1.0. At least this way you could define its behavior over a period of time and either die, repeat ad-infinitum (or for a specific number of cycles) or freeze @ 1.0 settings.
Again, great work and nice write-up!
- Melv.
#16
@Magnus: I love it, very inspiring work... you can really do a lot of cool stuff with particle systems. And that video is killer..that grass just sets the mood in the scenes. :)
04/13/2007 (7:03 pm)
@Melv: Or ping-pong! :)@Magnus: I love it, very inspiring work... you can really do a lot of cool stuff with particle systems. And that video is killer..that grass just sets the mood in the scenes. :)
#17
(hm, I really wish I could get a graph window that would let me choose exactly which graphs to show by the way. As in showing more than one graph at a time. It's a bit time consuming having to switch graphs all the time...)
Oh, and Thomas; I actually ended up doing a more of a back/forth "sway" in a different level now the other day, the problem there was that I didn't want the grass nearly as thick so going for the smoothness didn't quite work (I wanted to be able to see through the straws once in a while). It worked out pretty well for that particular situation.
Oliver; Thank you; you can do a lot of things with 2d graphics I'd say; Not ONLY particles, I worked on something extremely cool the other day using fading blended images... but there will probably be more about that later. =)
04/14/2007 (1:25 am)
Melv; yeah. Having the option of "cycling" a particle should do just fine. cycle/clamp would have to be per variable though, that way you could cycle things like rotation but clamp quantity. It gets a bit messy "interface wise" I suppose, but should be doable. (hm, I really wish I could get a graph window that would let me choose exactly which graphs to show by the way. As in showing more than one graph at a time. It's a bit time consuming having to switch graphs all the time...)
Oh, and Thomas; I actually ended up doing a more of a back/forth "sway" in a different level now the other day, the problem there was that I didn't want the grass nearly as thick so going for the smoothness didn't quite work (I wanted to be able to see through the straws once in a while). It worked out pretty well for that particular situation.
Oliver; Thank you; you can do a lot of things with 2d graphics I'd say; Not ONLY particles, I worked on something extremely cool the other day using fading blended images... but there will probably be more about that later. =)
Torque Owner Christian S