Lost Memories

||\//\||

Let’s start with a riddle…
I’m a type of creature that never tires.
My desire to learn is truly inspired.
I’d back expanding to the letter.
As more of everything is better.
I could not stop though the world is sick.
And now my only memories are apocalyptic.
What am I?

If you’d like to know a bit about the ideas behind this piece, and my method for a code based paint effect, see the fxtext article “Lost Memories - Painting like an impressionist android”. Link at the bottom. However feel free to skip the article, my meaning, and everything else if so desired.

||\//\||

Basic info:
This piece uses web tech and WebGL in experimental ways to achieve the paint-like effect. This includes a custom built drawing pipeline. Although well tested, please be sure it's fine for your devices before buying ( give it a whirl drawing basically ).

A faster computer will obviously be better, though I've done my very best to make it fast and efficient for any old laptop. My hope is that you will find the render process quick and enjoyable for the amount of detail that’s present.

The piece comes in portrait to make use of the depth of the body of water. The ratio is 1.5. So the initial render will be 1000px wide and 1500px high. With the ability to scale this up (see below).

||\//\||

Saving the image / prints
Press the [s] key to save the initial render. You will need to wait a few seconds after all the elements have stopped loading. You will know when the render is finished as there will be 3 layers of fish made. For the [s] key to work you may need to open in a new tab. But can right-click save otherwise.

Correct sizing for HD digital images / laptops / phones
Use the [s] key (see above), at most use the [2] key ( see below ) to get double the size. Honestly, anything larger and you will begin to lose the textures as the detail becomes too fine.

Correct sizing for large prints
I strongly suggest using the [3] key ( see below - 3000 x 4500 pixels ) for large prints. I’ve tested this on a 20x30 inch print and it’s the best size. Anything bigger will begin to lose texture and lose detail. However, the option for bigger is there.

Larger sizes:
Press the [2-9] keys to save a resolution of that key size. So [2] saves a 2000x3000 size image, [9] saves a 9000x13500 size image etc ( see above for correct sizing ). After the image will be automatically downloaded.

There may be slight variations in the textures for the larger renders, this is because the shader code has to redraw the textures at the higher pixel resolution, and getting the textures where they sit is more of an art than a science. All the elements remain exact however.

||\//\||

Made with javascript (webgl) and some small extra code:
Some bits by @nathansonic
Twgl - A webgl wrapper - twgljs.org
A Perlin noise generator - github.com/josephg/noisejs