towards the within: steering code

Up to now, I’ve always treated par­ti­cles as their phys­i­cal equiv­a­lents: point­like objects under­go­ing forces. As a physi­cist, this way of think­ing comes nat­ural, how­ever it is fairly lim­it­ing. There’s a lot of work out there deal­ing with par­ti­cles as agents, capa­ble of steer­ing towards goals, avoid­ing obsta­cles and flock­ing together in inter­est­ing ways.

Towards is my first step in explor­ing the pos­si­bil­i­ties of agent-generated graph­ics. It has an old-fashioned feel about it. (And yes, I got stuck on the black-white-red palette again…)

To get a feel of how this kind of explo­rative pro­gram­ming goes, I’ve uploaded seven ver­sions show­ing the chrono­log­i­cal (pro/re)gression of the code. All pieces need some time to reveal their true dynam­ics. Click on the applet to restart the construct.

towards 01 02 03 04 05 06 07

towards01

towards07

towards04

towards06

This entry was posted on Wednesday, May 21st, 2008 at 19:35 and is filed under Blog, Portfolio, Processing and tagged with , , , . You can follow any responses to this entry through the RSS 2.0 feed.

5 Responses to “towards the within: steering code”

  1. bojana v. says:
    October 29, 2008 at 21:43

    looks pretty amaz­ing > it is curi­ous to see, will be back to see more_

  2. Frederik Vanhoutte says:
    October 30, 2008 at 00:58

    Thanks Bojana,

    it’s always nice to get feed­back from peo­ple in architecture.

  3. Morgan says:
    March 10, 2009 at 22:24

    I really like all these exam­ples, and appre­ci­ate that you’ve included the code. I am very new to Pro­cess­ing and was won­der­ing how you achieved the 3-d “shoe­string” effect of your trac­ers. From the code it looks like they are com­posed of lines and a cou­ple of ellipses? Can you describe this in more detail, or maybe add some com­ments to the code?

    Great work! I love the site.

    –m

  4. Frederik Vanhoutte says:
    March 10, 2009 at 23:50

    Hi mor­gan,

    thanks for the kind com­ment. It’s true that most code is uncom­mented. This is because it’s rough-and-tumble, stream-of-consciousness code. A “sketch” in the true sense of the word.

    The 3D-effect is actu­ally rel­a­tively sim­ple to achieve. The mov­ing par­ti­cles are ren­dered as small cir­cles and drawn over the pre­vi­ous frame. The step size is kept small so there’s a lot of over­lap between two steps. To add the 3D-like emboss, you need to draw every­thing twice. Once with a slight shift and in a “light” color, and then once again, now in the par­ti­cle color and with­out the shift. This way you get the ren­dered cir­cle with a small “light” bor­der in the direc­tion of the shift. If the step size is small enough you get the shoe­string illusion.

    You can find this in the code:

    fill(255,120); // white fill
    ellipse(tracers[t].pos.x+light.x,tracers[t].pos.y+light.y,3,3);// white fill is offset by (light.x, light.y)
    fill(0,120); // black fill
    ellipse(tracers[t].pos.x,tracers[t].pos.y,3,3); // draw the particle

    In this case, the light off­set is fixed for all par­ti­cles, giv­ing the illu­sion of a light source far away in that direc­tion. Another piece, hay­wire gives the illu­sion of a cen­tral light­source. This is achieved by vary­ing the shift accord­ing to the par­ti­cle posi­tion. E.g. a par­ti­cle on the lower-right will have its light fill shifted to the upper-left, etc…

  5. Morgan says:
    March 12, 2009 at 05:52

    Ahh, I see. Nifty trick. So in “Toward #6″ (I like that one best) your off­set is 0, but your light cir­cle size is fixed at 4, where your col­ored cir­cle is size 2. This makes it appear like the light source is directly over­head in the z axis or that the shoe­strings are semi-transparent? I also like the “fuzz” grow­ing out at the tan­gents on this one. I’ll give this a try. If I come up with any­thing inter­est­ing, I’ll send you a link.

    Thanks for the explanation.

    –m

Leave a Reply