Decorating office walls for me is a reflection of mu personality and interests. For many in the tech community, this often translates to displaying items that showcase their passion for technology, mathematics, or creative problem-solving. This at least is true for me. Usually ideas like LED gadgets or iconic movie posters might come to mind, but I decided to take a different approach by creating (more like stealing and adapting) flow field art.

Flow fields are a beautiful visual representations of mathematical concepts, offering a unique blend of beauty and complexity. Much like the Lorenz Attractor (of which i have a tattoo on my chest, but that’s just a side-note) they are an awesome medium for combining mathematical formulas with artistic expression. This project not only allowed me to explore the this side of algorithms but also resulted in some visually striking pieces that are now found on my walls.

If you know, you know; otherwise, it still looks pretty nice.

That’s the perfect description for these kinds of visualizations. They’re mathematically generated patterns that look like someone took a Sharpie to a whiteboard while on a particularly good acid trip. But if you know what you’re looking at (like how they’re based on noise functions and gradient fields), it adds another layer of appreciation—kind of like getting the joke in an XKCD comic. I randomly stumbled upon flow fields via Tyler Hobbs’ work a few years ago (here) and was instantly hooked. But apart from some reminders via NFTs in the NFT-hype-phase I totally forgot about them. Until recently, when I - you guessed it - faced the empty-wall-problem.

Stealing, Modifying, and Experimenting

I found a Jupyter notebook example (*shoutout to this one *) that generated Perlin noise patterns and decided to use it as my starting point. I’m not a math wizard, but I’m interested enough that I just tinkered with the parameters to see what happened. But first of all I extracted all generative information from the Notebook and put them into a single function called flow().

Parameter Chaos: I wasn’t entirely sure which changes would lead to drastically different images, so I did a pseudo-grid search—changing one parameter at a time, rerunning the code, and generating a bunch of weird-looking images.

• index: I added this parameter to differentiate the single results. It’s just used for naming the output files.
• w(width): Specifies the width of the plot in pixels.
• h (height): Specifies the height of the plot in pixels.
• colors: Determines the color palette available for drawing lines. The flow function randomly selects an element from this array to create visually distinct lines in the flow field.
• num_lines: Controls the number of lines drawn in each image. A higher value results in a more dense pattern of lines.
• num_steps: Influences how many steps each line takes, affecting the length and detail of each line segment.
• octaves: Refers to the number of layers or levels in the noise calculation (e.g., Perlin noise). More octaves add complexity and smoothness to the pattern.
• factor: Scales the output of the noise function before applying a transformation, affecting the variation in line directions.
• line_size: Controls the thickness of the lines drawn in the visualization, influencing the aesthetic appearance of the flow field.

Line Thickness and Amount: Generally I would suggest increasing only one of these parameters, since having a high number of thick lines result in non-distinguishable image. Also: A few thin lines leave the canvas pretty empty.

Color Palette Choices: For my own office I settled on a grayscale palette to have a solid base that i could post-process. To further customize the images i used Photopea to add colors that I liked (and that are similar to what my office generally looks like).

Scaling Up

Since I wanted three posters to hang side by side, I needed to render them in high resolution—each at 30cm x 40cm with a 300 DPI setting. This ensured they’d look sharp and not pixelated when printed.

The process involved:

• Generating the images in the notebook.
• Exporting them as high-resolution PNGs.
• Fine-tuning the colors in Photopea to get that perfect grayscale-to-color transition.
• Sending them off to be printed

The final product arrived at my house a few days later (I think it’ll be faster if you use a superlocal service, which I didn’t) and I immediately hung them up. Here’s what it looks like now:

Results

While my flow fields didn’t quite reach the level of sophistication that Tyler Hobbs achieved, I still love how they turned out. They’re subtle enough to fit in a professional setting but weird enough to spark curiosity (and maybe even admiration) from anyone who knows what they’re looking at. Creating these posters was a fun way to combine my love for coding, design, and mathematics into something tangible. It’s also a reminder that you don’t need to be a professional artist or mathematician to create something beautiful—it just takes a little experimentation and willingness to learn.

The Notebooks

You can find the Notebook in my playground Repository: https://github.com/lakrizz/playground/blob/main/flowfield/flow_field.ipynb