Having grown tired of playing with circular branching experiments (hairball, inktest, flowerGlobe), I decided to tackle generating random trees with my new AS3 branching library.
It only took about 1 hour (plus a couple of hours tweaking numbers), versus a week or two for the original AS2 experiments (sakura, tree), and the results are vastly superior (from a realism perspective, if not yet artistically). Much of this was experience, but a lot of it was AS3 and the branching library giving me the freedom to explore the subject without worrying too much about performance or architecture. I also spent some time looking at real trees and really examining their shape and growth patterns – the advantage of winter in Edmonton is that it's really easy to see branch structure.
I plan to see if I can make parts of this interactive, and hopefully create a 3D version in the not too distant future, either with PaperVision, or a simpler custom 3D engine (leaning towards the latter to begin).
It's a little too large to embed here, so you'll have to click the screenshot below to open the demo. You'll need a large monitor (> 1200x1200 pixels) to view this well.
Comments (25)
Awesome, you got the exact same numbers as god ^^
Posted by: Cay at January 16, 2008 10:18 AMURL:
bravo
Posted by: e1 at January 16, 2008 10:38 AMURL:
Damn, that looks/works too cool!
Posted by: wp at January 16, 2008 10:41 AMGreat stuff
URL:
Looking good. I'd love to see the trunk and everything start as small as the tiny branches and grow over time as the rest of the tree forms. :)
Posted by: Josh at January 16, 2008 11:09 AMURL: http://www.zeuslabs.us/
Josh,
A couple of the guys here suggested the same thing. The issue is mainly with vector rendering. I have to blit everything back to a bitmap each frame to keep it running at a reasonable speed, so updating the thickness of existing branches is a bit of a challenge.
On the other hand, I like a challenge, so maybe I'll give it a go sometime. :)
Posted by: Grant Skinner at January 16, 2008 11:54 AMURL: http://gskinner.com/blog/
this i beautiful.
i was working towards a similar project a year ago, but i don't have quite the same skillset in branching and such, so mine's not as pretty.
http://ar11.net/work/daily/2007-01-11.swf
as josh suggested, i was aiming more at a real time growth simulation, but i was busy with other stuff so i never got to finish.
don't run it for too long, it doesn't manage cpu useage in a friendly fashion :-P
Posted by: drMikey at January 16, 2008 12:29 PMURL: http://www.drmikey.com
Ditto on this being beautiful!
Posted by: Tink at January 16, 2008 12:34 PMURL: http://www.tink.ws/blog
gorgeous work!
Posted by: John at January 16, 2008 01:08 PMURL:
Wow! Usually if you've seen one, you've seen them all when it comes to recursive drawings of trees, but this is certainly the most realistic that I've seen done in Flash. Nice work!
Posted by: Kevin at January 16, 2008 03:46 PMURL:
Absolutely gorgeous!
Posted by: Nate Chatellier at January 16, 2008 04:34 PMURL: http://blog.natejc.com
It is the realest tree shade i have ever seen!
Posted by: efish at January 16, 2008 08:47 PMURL: http://www.tan66.cn
Great stuff, looks gorgeous.
Posted by: pedro at January 17, 2008 01:23 AMURL: http://www.dreaminginflash.com
Waoh very realistic indeed ! and so fluid...
But how come I always get the same tree ? How random is this supposed to be ?
{Maz}
Posted by: Maz at January 17, 2008 02:38 AMURL:
I had a crowd of 10 voicing oohs and aahs around my desk :) hats off!
Posted by: sakri at January 17, 2008 03:17 AMURL: http://www.sakri.net/blog
Nice work Grant.
@Maz: its just and illusion, you don't get same tree every time.
Adrian.
Posted by: Adrian Aioanei at January 17, 2008 03:58 AMURL: http://blogs.eyepartner.com/adrian/
Maz - actually you are correct in a sense, the first tree that draws is the same each time you refresh the SWF. This is because I'm using this experiment to test a seeded random class, and I forgot to randomize the seed before the first draw before posting the experiment. Each time you click to restart after the first draw it randomizes the seed, and you get a unique tree.
Now that you've noticed this, I won't bother updating the SWF, so other people can see what you're talking about.
I should be posting the seeded random class in the next couple of days.
Posted by: Grant Skinner at January 17, 2008 08:57 AMURL: http://gskinner.com/blog/
This is really a smooth growing tree. Impressive!
Posted by: Min Thu at January 18, 2008 03:17 AMURL: http://www.flashmo.com
I look forward to that seeded random class, clearly it works very well! I've been wanting to add seeding into a lot of my random generated stuff in AS for awhile...
Posted by: Aaron at January 19, 2008 04:24 PMURL: http://abeall.com
Fine work simply superb.
Posted by: Ten at January 20, 2008 06:44 AMURL: http://www.10tontoys.com
Wow Grant, nice job and looks simply fantastic - you've really taken this a long way from veins! =D
Posted by: Mike J at January 23, 2008 07:17 AMURL: http://mx.coldstorageonline.com
Grantastic!
A tint feature request: branch coloring and an ability to feed the tree with some water :)
Posted by: Rostislav Siryk at January 27, 2008 09:40 AMURL: http://en.flash-ripper.com/
Grant, just stumbled on this. I built a PV3D version of some random trees here (http://lukesh.com/files/Trees/FractalExperiment1.html) more or less to mess around with some of the new PaperVision Great White features. I would really encourage you to take some of your experiments (like this one) into 3D. It's a blast.
Posted by: Fran Lukesh at February 13, 2008 04:40 PMURL: http://lukesh.com
wow awesome... !!!!, this is the first one that actually looks like a real tree..Very Well Done Mister!
Posted by: jakob at April 28, 2008 06:43 PMURL:
Hi ,
Posted by: Borys at July 7, 2008 01:43 PMCould anyone point me out to tutorial on how to do : Elm Tree Branching , "growing plant" effects?
Thaks a lot!
URL:
Really nice, very inspirational. Now how many beers will it take to get a look at that branching library :D
Posted by: mark at October 20, 2008 12:37 AMURL: