Texgen time!

Posted 26 Jan 2015


Textgen.. It’s a little piece of JS that went out half a day ago. It’s pretty neat. And, like all technology that deals with graphic representations of a mishmash of algorithms, I have the feeling it’s wasted on my eyes. I usually try 3 functions, everything looks the same, (refer to the 4 images above!), and I give up with the notion that all those impressive fractal Mona Lisas out there are spawn of superiorly mathematical people, who can tap into another - more visually satisfying - ether than the functional one I usually deal with.

Then I got curious, and started to hammer.

I started, not far from the example provided on github, with some XOR magic:

  new TG.Texture( 512, 256 )
    .add( new TG.XOR().color( 1, 0.5, 0.7 ) )
    .toCanvas();


It’s obviously pretty cool, but even that gets tiring with enough color-iterations. I tried the Sine wave function:

  new TG.Texture( 512, 256 )
    .add( new TG.XOR().color( 1, 0.5, 0.7 ) )
    .add( new TG.SinY().frequency( 0.004 ).color( 0, 0, 0.3) )
    .toCanvas();


Mkay. Glowy. What now? I tried to add a few of the others, but they didn’t expand much on the thing. Then i tried to not just add, but multiply, and divide.

  new TG.Texture( 512, 256 )
    .add( new TG.XOR().color( 1, 0.5, 0.7 ) )
    .add( new TG.SinY().frequency( 0.004 ).color( 0, 0, 0.3) )
    .mul( new TG.OR().color( 0.3, 0.8, 0.5 ) )
    .mul( new TG.SinX().frequency( 0.04 ) )
    .div( new TG.SinY().frequency( 0.04 ) )
    .add( new TG.SinX().frequency( 0.2 ).color( 0.3, 0, 0 ) )
    .mul( new TG.Noise().color( 0.3, 0, 0 ) )
    .toCanvas();


Uooouh.

I tried starting from scratch

new TG.Texture( 512, 256 )
  .add( new TG.SinX().frequency( 0.005 ) )
  .mul( new TG.SinY().frequency( 0.008 ) )
  .mul( new TG.SinX().frequency( 0.004 ).color( 0.3, 0, 0.4 ) )
  .div( new TG.Noise().color( 0.2, 0.2, 0 ) )
  .mul( new TG.SinY().frequency( 0.057 ) )
  .div( new TG.OR().color( 0.5, 0, 0.7 ) )
  .mul( new TG.SinX().frequency(0.014))
  .toCanvas();


Oooh.

new TG.Texture( 512, 256 )
  .add( new TG.Noise() )
  .div( new TG.SinY().frequency( 0.004 ) )
  .mul( new TG.SinX().frequency( 0.002 ) )
  .mul( new TG.OR().color( 0.4, 0.1, 0 ) )
  .mul( new TG.SinX().frequency( 0.095 ).color( 0.5, 0.2, 0.1 ) )
  .toCanvas();


Okay, yeah, I have no idea what I’m doing. But I’m sure it’s useful in some context I have yet to discover!

That’s all from me. Stay tuned.