Branching is fun.
It all started with this animated gif I found lurking on the internets some months ago...
I saved it for the day I was inspired enough to make the effect with Javascript. That day was yesterday...
I know I know, this isn't really branching, it's just a disgusting worms kind of effect, that was something I got while playing with it. The code is simple, a bunch of particles and you generate a random value that apply to the direction of each particle (aka random walk). To get branching now you need to randomly generate more particles on the position of these particles. Here it's the result:
I posted the effects over twitter and minutes later @thespite emailed me a modified version of this last iteration.
That was interesting! I didn't know <canvas> had a method for blitting. It gave an effect as if it was algae continuously growing while the camera was moving back. To enhance the effect I changed the path drawing to thicker circles.
That looked nice but was starting to be too visually complex (and cpu intensive). I like the 2D version better and then I wondered how could it work if I wired some of the values to the sound amplitude of a tune and then using <audio> again. Here it's the result.
I spent 10x more time looking for a track that suited the effect than doing the effect itself. In the end I found a nice track at the always-interesting enoughrecords netlabel.
And... that is all for today... as usual, with Javascript, the source code is one right click and one left click away. Have fun!
PS: It was nice to see that most of the effects worked on my Android phone. I guess they also work on iPhone? :D
I saved it for the day I was inspired enough to make the effect with Javascript. That day was yesterday...
I know I know, this isn't really branching, it's just a disgusting worms kind of effect, that was something I got while playing with it. The code is simple, a bunch of particles and you generate a random value that apply to the direction of each particle (aka random walk). To get branching now you need to randomly generate more particles on the position of these particles. Here it's the result:
I posted the effects over twitter and minutes later @thespite emailed me a modified version of this last iteration.
That was interesting! I didn't know <canvas> had a method for blitting. It gave an effect as if it was algae continuously growing while the camera was moving back. To enhance the effect I changed the path drawing to thicker circles.
That looked nice but was starting to be too visually complex (and cpu intensive). I like the 2D version better and then I wondered how could it work if I wired some of the values to the sound amplitude of a tune and then using <audio> again. Here it's the result.
I spent 10x more time looking for a track that suited the effect than doing the effect itself. In the end I found a nice track at the always-interesting enoughrecords netlabel.
And... that is all for today... as usual, with Javascript, the source code is one right click and one left click away. Have fun!
PS: It was nice to see that most of the effects worked on my Android phone. I guess they also work on iPhone? :D
Source: http://mrdoob.com
