Particle images for Particle Playground

Today Particle Playground was released on the Mac App Store. Since there is only one default particle emitter image included I thought you might be interested in the other particle images I used to make the screenshots for the Mac App Store.

Fire

The very first emitter I created was a fire emitter (based on this tutorial by Marin Todorov from raywenderlich.com). With Particle Playground I was able to tweak it some more and this is what I got in the end. For the particle image I just used a irregular-shaped brush in Photoshop and erased the odd ends.

fire

Stars

This may be one of the most common “You win” emitter I would guess. Creating the particle image wasn’t even that hard. Create a star maks in Photoshop and overlay it with a radial gradient. That’s all there is to it. Download it here.

star

Hearts

One day late for valentine’s day, but here you go. A love emitter. Creating this shape was a little harder. It took me quite a few tries with the vector tool but in the end it was worth it I guess. After you have the basic shape it’s pretty straight-forward. Color the inside red and add a white outline. You can create the highlight manually with a brush or – as I did it – with another vector shape so you can tweak it some more.

heart

Rain

This is one of my favorite particle emitters. You can add some more (or less) wind by tweaking the xAcceleration slider/property. Or you can add some more rain. You can even tint it green to make it toxic rain. So… make it rain!

raindrop

Creating this shape was super-easy. Just a few bezier curves and you are done. Inside is a white->blue linear gradient and the highlight is another small vector shape.

If you are wondering why the raindrop is upside down in the particle image you should read this blog post.

Freaky Spiral

This is what happens when you play with the contentsRect. You should try this. You can create lots of freaky effects. But beware: this may either stress the device way beyond its limits or it simply may not look too cool on the device and honestly… when would you ever need this kind of emitter? Nevertheless, download the savefile here.

mysprite

To create this image I just painted a white cross, rotated it 45 degrees and overlayed it with a radial gradient white->transparent from the center of the cross. By the way: This is the default particle for Particle Playground 🙂

If you enjoyed this post, how about leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

One thought on “Particle images for Particle Playground

  1. Dave rogers

    Hi Kai I downloaded Particle Playground for some dev work – great app. I am having trouble with this step due to my own lack of programming knowledge –
    6. Create a custom view with the class “PPEmitterView” (in Interface Builder or programmatically)

    Can you recommend a good tutorial for something analogous? Thanks

Leave a Reply

Your email address will not be published.