Creating A FAST Particle FX Manager From Scratch

19 Jul

Creating particle systems is not a simple job – particularly if they are expected to work in 3D and be cross-platform. Luckily Marmalade makes this job much easier than most middle-ware solutions by providing us vertex streams that can be specified in view-space coordinates. That alone removes a big chunk of code. In this DevBlog video-tutorial series we create a Particle FX Manager from scratch. It manages a list of Particle Container objects, each of which has its own origin point in world space. Each of these containers in turn contains a list of particles and writes to the appropriate streams every frame.

Having the container class as demonstrated here makes it very easy for us to attach particles to arbitrary points in the world. We also demonstrate how to create a more data-driven way of creating new particle systems. The ideal scenario here is to virtually decouple the system from the data that drives it. This is accomplished by having a separate set of declarations in another C++ source file that control how the particle systems look, and then having the actual system’s manager in a different source file. This way content creators (e.g. designers, artists) can work on the particle systems separately with little overlap with the programmers on your team, resulting in much higher productivity.

There are very few tutorials around that demonstrate how to look at the higher-level architectural aspects of designing a game engine, particularly with an eye to getting something that can run at 60FPS on a mobile device while still driving really good-looking graphics. The focus of this tutorial is to have a very cleanly architected system driven by data created by possibly an entirely different team. This “big studio” style of development can benefit even tiny teams. Imagine being able to let an artist go nuts in a separate part of the project and come back a week later with a fully functional pack of particle FX, without programmer intervention required! And without having to do tedious XML loading code or anything of that nature.

In a future tutorial we will detail how to make the particles do more interesting things. We’re considering implementing a macro-based set of “mini-instructions” that can be strung together to create interesting particle FX. We’re also investigating the feasibility of attaching rigid bodies to particles – this would look uber, but unfortunately physics-on-particles is very expensive so it will take some testing to see if this is a viable approach at all.

We hope you enjoy watching this tutorial. It’s long (3.25h) but you’re not going to find this level of stuff anywhere on the Interwebs (that we know of, at least). It’s all done in 720p so the text is really clear and easy to read. There’s plenty of tutorials for this stuff floating around, but none take you from A-Z and show you how to make a system that really scales on a mobile device. Enjoy! Don’t forget to add us to your RSS Feed! Get new DevBlogs delivered straight to your RSS client. You know you want it.



Posted by on July 19, 2011 in Uncategorized


5 Responses to Creating A FAST Particle FX Manager From Scratch

  1. paka

    August 10, 2011 at 3:49 am

    Can you give me source code for this tutorial,thank so much?

    Best rgds,

  2. Stanith

    August 16, 2011 at 6:54 am

    Hi, firstly I’d like to say I really enjoyed the videos! It’s a great tutorial and particularly useful for those trying to get particles up and running with Marmalade :)

    At the end of your video you mentioned you would upload the source to your web server, but I couldn’t find a link anywhere. I’d greatly appreciate being able to have a look as it’s a bit easier than trying to pause the videos at the right moment!

    Kind regards,

  3. syntheticone

    August 16, 2011 at 10:31 am


Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>