Fireworks — A visual particles editor for Swift
I’m incredibly excited to share a new developer tool I’ve been working on called Fireworks, available to download here 😃
Fireworks generates Swift code on the fly for macOS and iOS as you build particle effects, allowing you to interactively design and iterate without having to constantly rebuild your app.
Once you’re satisfied with your particles design, implementing it in your project only takes 2 steps:
- Add the texture to your assets catalog
- Paste the code generated by Fireworks
No third-party libraries or dependencies needed!
I put together this video to show what it looks like:
Fireworks uses the CAEmitterLayer and CAEmitterCell APIs that are part of Core Animation. If you have used Apple’s SpriteKit framework in the past, you may have seen the SpriteKit particle editor that is built-in to Xcode. It’s a really cool editor, but unfortunately it only works for SKEmitterNodes.
With Fireworks, I wanted to create something similar, but for CAEmitterCells instead, so that people can use it in any iOS or macOS project, without having to import SpriteKit.
Fireworks offers several ways to adjust values:
- Click and drag the controls on the right to quickly scrub through values
- Left click on the preview window to move the particles around
- Hold down CTRL or right mouse button and drag on the preview to resize the emitter
- Enter values directly into the code editor on the left
The app comes with several built-in templates for the usual suspects (snow, rain, confetti, fire, etc). You can export the built-in textures to use freely in your own projects, and you can also import your own textures.
Creating particles visually using Fireworks is a very different experience from building them using code. As you scrub various values back and forth and see immediate results in the preview, you will run into interesting ways to mix and match values, and you will inevitably produce effects that you normally wouldn’t think to program when building particles in code.
After building Fireworks, I spent hours just playing around with the tool, sometimes creating some really strange effects 😅
I can’t wait to see what other people will create!
Upcoming Features
I have several features planned for future updates including:
- Adding more controls to change birthrate and other values at the CAEmitterLayer level (which acts as a multiplier for cells)
- More controls for tweaking cells (such as color speed)
- Add ability to save multiple templates
- A new animations section that lets you animate values over time
- [implemented as of v1.1] Add support for Core Animation Archives for a simpler import process (thanks Guilherme Rambo for the tip!)
If there’s a feature you would like to see, I’d love to hear from you on Twitter!
Open Source and other help
If you’d like to contribute to the code, or just want to look at it, then please let me know. I am thinking of open-sourcing the project if there’s enough interest 😀
If you like Fireworks and want to support its development, there are many ways you can help!
- Download it from the Mac App Store
- Review it on your site or blog
- Share it with friends and colleagues or on social media
Thank you so much for reading, I hope you enjoy using Fireworks and I look forward to hearing your feedback!
Download Fireworks here
p.s: special thanks to John Sundell for his Splash library. All syntax highlighting in the app is powered by Splash 😊
