For this Workshop, we're doing a Coding Challenge! It can be tricky to sit down and practise new coding techniques, so here's a fun exercise that'll help you learn how to use particle effects by giving you some ideas for what to do with them.
Update: I've added my own demo to the post, complete with source code; it's a Stage3D and Starling dynamic "fire trail" generator, inspired by Back to the Future!
Did you see Shiu's recent Stage3D Starling Particle Effects tutorial? Here's my favourite demo from it:
(Drag the mouse to move the ship, and press A to increase the smouldering.)
I think Starling and Stage3D are really important topics to learn for any Flash developer working on games or graphical effects. But I realise sometimes it can be hard to find inspiration for what to do with these tools, so this challenge is to encourage you to experiment and share your creations.
Here are a few suggestions:
The time travel effects from Back to the Future:
Pretty much any Doctor Who intro:
Phasers (blasters, plasma rifles, etc.):
Star Trek transporters:
All these examples are in 3D, but yours doesn't have to be - in fact, it'd probably make it easier to concentrate on the effects themselves if you used simple 2D graphics.
Let Us See!
This is a personal challenge; the aim is to help encourage you to play with new techniques, rather than to compete to win a prize. Having said that, I'd love to see what you make, and I'm sure other readers would find your examples really useful, too!
So, if you come up with something neat, please send it in using this form or link to it in a comment below.
I could do with brushing up on my own particle effect skills, so I've made something for the challenge myself: a Back to the Future-inspired fire trail generator!
Here's a picture of some sample output:
It works by creating multiple particle emitters, evenly spread along a line, each shooting particles backwards along that line. The emitters are given a wide spread to mimic the tire tracks from the movie.
Have a go with the demo; click in one place and then another to draw a straight line between the two points, or drag the mouse around to draw curvy trails:
You can play with a full-screen version of the demo, too.
The full source files (with lots of comments) can be downloaded here.
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.Update me weekly
Envato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!Translate this post