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

5 Responses to “towards the within: steering code”

  1. bojana v. says:

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

  2. Thanks Bojana,

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

  3. Morgan says:

    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. 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:

    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