# RAYHATCHING chapter 1

In summer of 2020 I bought a plotter, a robot drawing machine that holds a pen. It is only capable of drawing lines, and nothing else.

Because of this I had been focusing on vector based SVG outputs. This is a file format particularly suited for the plotter, which builds images as a collection of lines and shapes, instead of pixels, like a JPEG does.

However, I felt the urge to play and experiment with 3D SDFs and raymarching again. An SDF is a mathematical function that describes shapes, in a way that is particularly suited to raymarching. Raymarching is a technique used for raytracing, which is a technique to simulate light bouncing off these 3D shapes, resulting in a picture. Unfortunately, these techniques are mostly aimed at pixel-based rendering, so I had to get clever.

In these first two pieces I use a raster-based scribbling approach to generate scribbles of varying size, creating varying levels of brightness.

![First vector based raymarcher output (October 2020)](ipfs://QmVaJjpYr4c3CCUwtcuLLngkoXspZmVWymyrJS4vw7ZETw)

![Second vector based raymarcher output (October 2020)](ipfs://QmevJ9EfFXK7MVusK8jpKHgjYbFjsZW4bjLPsQJ4YbUzue)

In the next piece I use a very fine Hilbert curve, that gets progressively smoothed to create varying levels of brightness. This piece consists of a single line and could thus be plotted with relative ease (it still took a while).

![Aftermarket Planetary Recyclotron (October 2020)](ipfs://QmZmcSLMowxjSbSnfrwBaZjwZxqb8eKz3Rk6VhSXEdibKv)

Trying to find a way to render a raymarched scene with a shorter plotting time, I tried a different scribbling based approach.

![Nyarlathotep Road (October 2020)](ipfs://QmZZve9bgZudtxTCkcksaVYZXvLXxwRccdHkuF8KMdMQNQ)

While this reduced the plotting time somewhat, I was also not really satisfied with the lack of sharp detail in the picture.

![Untitled (October 2020)](ipfs://QmV9S5rJ9tiqRPYsWNHDkZkLS41tcGWLpcDdSz1DzmhmNJ)

I knew that 3D SDFs and raymarching were capable of much finer detail. Such as with my stippling-based pieces [Possible Dune](https://foundation.app/@piterpasma/foundation/74507) and [Impossible Dune](https://foundation.app/@piterpasma/foundation/74511).

![Possible Dune (October 2020)](ipfs://QmYdeMbThBTiLZPSa4qrmzrN4znRphZrcxh4FghwNCnrHn)

![Impossible Dune (October 2020)](ipfs://QmUn2qZhnB2WRgRCNRKFXgB2kagAnZNQEk5PCxJF5Keujf)

![Alien Playground (October 2020)](ipfs://Qme4KnLZi8njAG2zrfWSUuGYExSgttgToV2Gjdvm1hwbN9)

# RAYHATCHING chapter 2

In order to figure out a way of achieving more detail with less lines, I tried taking surface orientation into account, which previous attempts had not done–they were just scribbling or stippling to create a certain brightness level. Notice how the very short lines in the next two pieces are oriented so that they seem to lie “flat” on the 3D surface. This was the first step towards a more intelligent hatching method.

![Conduit Dimension, Elbow Quadrant (November 2020)](ipfs://QmNjJoACSLqz5CsMyQrxCSLedpxxiZSzCTHkty43P33GKG)

![Hagelslag Age Cave Painting (November 2020)](ipfs://QmNk4UkPbyMETzCcaS9e57uRQG2k6KEeEmt79sYAML6FZk)

These first attempts were merely made of very short lines, and were not really suitable for a plotter (or were they? I have footage of a powerful HP plotter going at it, taking only 50 minutes).

But I was getting there – I just needed to connect the dots, somehow.

![Capsule Hill (November 2020)](ipfs://QmanNFMZEjju7TxNfUJgjkaXbVudd5KSxBKbAUWaHMuCbt)

Somehow it didn’t take too long to figure out how to use a flowfield renderer to draw the lines in a hatching direction on the shapes, while taking into account line distance to sketch different brightness levels. *Capsule Hill* was the very first successful output of the earliest version of the rayhatching algorithm.

![Shape Salad (November 2020)](ipfs://Qme53wLM5y8YrekQPEyZ8t9NRn6NjCsf9Yt5JTsLfve3dx)

From there on, it quickly got awesome.

![Hyperburger (December 2020)](ipfs://QmSoSpqtmqyUJcrThRm7jHx2BMYrc9DGno29nHedArCsVo)

![Hyperplane Microplane (variation, December 2020)](ipfs://QmWBEQpxXtFCc52NqmUvYESiaan5XKGS1ZmiDhmLUMusA3)

However, I had also been organising the generative art month of [Genuary 2021](https://genuary2021.github.io/), in an attempt to bring together the various genart communities spread out over the web, and didn’t really have time to explore the rayhatcher further.

Genuary turned out to be a huge success, and quite the marathon, so I took a short break, then made a few more pieces.

![Broken pearl (March 2021)](ipfs://QmY8ZTyT3XYvjBk8dBaMqsjwUdYLh15WFCC92G6zw8AZnc)

![Broken planet (March 2021)](ipfs://QmWX1xgAcQkecJzCYiPKVxr7H1BwyFvifE69BrTQ5UKnSZ)

![Shattered sphere (March 2021)](ipfs://QmaAAt69ZAHCM22oAXJh99KPqR2paqKiusjwq5oFAbTTvx)

And then NFTs happened :) And suddenly, digital art could just exist, without necessarily having a physical counterpart. Also at first, I had no idea how to combine NFTs with physical plots. So I explored the digital for a while, which led to [Skulptuur](https://www.artblocks.io/collections/curated/projects/0xa7d8d9ef8d8ce8992df33d8b8cf4aebabd5bd270/173) and [Hypergiraffe](https://www.fxhash.xyz/generative/slug/hypergiraffe), amongst many other things.

![Desirotron (August 2021)](ipfs://QmXEsDkQnGE58m5P8UZxSfGGg4pDoTU6oJmrYQAm94a8ym)

I made [Desirotron](https://foundation.app/@piterpasma/foundation/68944) in this period, which is executed in colour, to underline it’s a digital image first, an NFT and not intended to be plotted (though if someone figures out how to make it look good they have my blessing).

# RAYHATCHING chapter 3

It took until March 2022 until I revisited the rayhatching algorithm.&#x20;

![Hyperwillows (March 2022)](ipfs://QmNfz6oCfnjQxdLLve18zTLwvjssJEpuTLtyRMmXsa7gUq)

I completely rewrote the engine to be a completely self-contained file using no external dependencies (the earlier versions used modules I had written myself). I re-used the code for a very tiny QuadTree algorithm (an essential part of the flowfield renderer) from *Hypergiraffe*. At this point, the entire code was about 7 kilobytes, and after a few iterations led to [Hyperwillows](https://verse.works/artworks/90e9d550-18e5-40d4-bb07-048d21a5cc52).

For a long time I had been saving parameters and important parts of the actual code as comments in the SVG-file (which is a text format, somewhat similar to HTML). This has proven very useful in recreating certain outputs on several occasions. The new rayhatcher engine is no exception, and it includes its entire code fully as an SVG comment in its output.

But *Hyperwillows* is a 1/1. I really wanted to do a big release of the rayhatcher algorithm as a long-form generative piece, that would be able to generate an infinity of possible outputs.

![It’s complicated (July 2022)](ipfs://QmRixGQA6QbBmmpKdcC5oH7RWve1qAA125Fwy8VY4izPVm)

Some of my first tries I felt were too much like *Skulptuur*, looking at a peculiar object in the centre of the scene. So I did some reading and research on how compositions in paintings work. One approach I found is that of the “armature”, a set of imaginary lines that are important in the composition.

![Blocks and pipes, placed manually according to rule of thirds (August 2022)](ipfs://QmbZn1Gy5fgATWGT9edaEHmd3f6E3ZSZxVzLMwtfafvC2T)

In particular, the armature known as the “rule of thirds”, which divides the image horizontally and verytically into thirds, seemed an easy one to start with. I developed an algorithm that could place SDFs of large blocks onto these lines, using a mathematical transformation from 2D (where the lines are on the image) to 3D (where the shapes are, in space).

![Generated blocks and pipes (August 2022)](ipfs://QmR2iPgSMdoCrq7iHy7fSACda3KPbCjyBwAVDC3gKuAbEK)

When two shapes intersect, their surfaces form a cutting line. Due to the way that SDFs work, it is very easy to construct the SDF of a pipe following this line. I intersected the blocks with invisible planes to construct the pipes. Then I applied this method again, to the pipes themselves, intersecting with a stacked series of invisible planes. This creates the smaller “cooling rings” around the pipe. I also took a large hollow cylinder and punched a hole through the entire scene.

I quickly discovered that I could add a slight random rotation to the blocks to create more interest. This disturbs the “rule of thirds” armature a bit, but not too much and can also add other lines of interest.

![In this experiment I actually tried out skewed blocks (September 2022)](ipfs://QmWrYq8dQ7LbCSxe3T8iUCxKSiDm22qy5Skqg7Qs17PVdb)

After that, I added a noise texture to the blocks and some more tweaks and details. Relentless size optimizing turned this project into a piece of code weighing only 3930 characters.

::tezos-storage-pointer[]{contract="KT1BJC12dG17CVvPKJ1VYaNnaT5mzfnUTwXv" path="ledger::20147" data_spec="FX-GEN-DATA-002"}

*Industrial Devolution* was released October 6th during a [live minting event](https://lu.ma/fxhash-brightmoments) at Bright Moments gallery, Venice Beach, in collaboration with fx(hash) and Tender.



I developed an algorithm that performs raytracing/raymarching of SDFs, to produce hatched line art SVG output. This is the story of how I got from not there, to there.

Piter Pasma is a generative artist using randomness as a creative and inspirational force.

Rayhatching Evolution

Written by

Editions

Share

Details

stay ahead with our newsletter