Gorilla Newsletter 80

Matt DesLaurier's BITFRAMES - Rayhatching with Piter Pasma - SVG Exporter for P5 - Random Mazes with JS - Everything in Math is a Set - Analysis of Title Drops in Movies - CSS New Logo - Shopify BFCM Animation Breakdown - LLMs For Curious Beginners - LLMs & Chess

Gorilla Newsletter 80
A Gorilla in the Wild: Pics of the Creative Coding Workshop I gave at Trilitech

Hey everyone, after a much needed two week break—I'm back!

You'll quickly notice that this week's issue has a bit of a different format! Shorter than usual, but still just as many interesting things as before. If you're curious about the why for this change, I share some reasons and thoughts on this matter at the end of the post.

That said—welcome back to the 80th issue of the Gorilla Newsletter! A weekly online publication that sums up everything noteworthy from the past week in generative art, creative coding, tech, and AI.

We also have a discord server, come and say hi!

Let's get into the news👇

All the Generative Things

1 — Matt DesLauriers' BITFRAMES: arguably the biggest thing that's happening in genart this week. BITFRAMES is an open source project and crowdfund, where 100% of the proceeds support the creation of a generative art documentary that Matt is working on simultaneously.

I actually met Matt briefly in Berlin for the Genart Summit, and by chance chatted with one of the two production people that were accompanying him, telling me that they were working on a movie—it was mentioned that it was a documentary. It makes sense now though, they were likely interviewing some of the pioneers that were present at the summit.

The project is really interesting—both conceptually and how it is technically executed. Matt built his own custom project page, from which collectors can create their own individual editions and then mint them. Matt also shared some tech notes on the project in this tweet. Of course it's also aesthetically really nice, here's two outputs I saw on my timeline:

Link to Tweet #1 | Link to Tweet #2

If you want to learn more about the project, Le Random naturally already covered Matt's documentary effort in a recent article of theirs, where Monk sits down with Matt to talk about a Generative World.

2 — Piter Pasma on Rayhatching 🧵: another accomplished generative artist that I got to chat with during the Berlin summit is Piter Pasma—back then he gifted me a mini print of his Epihyperderpflardioids, and told me a bit about how they work. Now it sits on my desk where I often admire when I'm procrastinating.

To get to the point though, recently the banner for warpcast's genart channel has been on a rotation, with artists throwing their artwork into the ring—this week it's been one of Piter's rayhatched pieces that adorns the top of the channel:

For the occasion he posted a big thread about how he made the rayhatched piece. The thread links to many useful articles, one of which is Piter's own, which I wasn't aware of previously; published back in October 2022 it explains the evolution of his rayhatching algorithm and provides some big insights into how the he iteratively refined it. If you've been meaning to implement something similar, this is your starting point.

3 — A Plotter-Oriented SVG Exporter for p5.js ✏️: Golan Levin released a SVG exporting library for our beloved P5 that is in essence directly meant to be used for plotter work—specifically tailored for path-based vector output devices like the Axi-Draw. One of the most popular articles on the blog is about exporting P5 sketches as SVG, hence this is probably of interest to you guys.

4 — Generating Random Mazes with JavaScript 🔗: Paul Herbert wrote a tutorial for generating random mazes with JS, in which he essentially programs a random walk, with backtracking, that finds a path through a grid, and then constructs a maze around it.

I really loved these hand-drawn sketches that Paul included. The last one gives a pretty good idea of how the algo works—you basically create branching paths for the main one through the maze.

Yours truly has written something similar, not for generating mazes per se, but that you could equivalently use for that purpose: An Object Oriented Approach to Random Walkers.

5 — Everything in Math is a Set 📐: this one's for the math nerds. Mateusz Kubusok wrote a super, super in depth article that explains how any mathematical object can be defined using sets, simply by "wrapping up empty sets and merging it with more wrapped empty sets in various degree of wrapping" as he puts it.

6 — Creating Your Own Programming Language 💻: In a recent Computerphile video, Dr Laurie Tratt teaches us how to make our own programming language—who doesn't want to program their own programming language at some point?

Tech & Web Dev

1 — An Analysis of Title Drops in Movies 🎬: Dominikus Baur is yet another cool dude I met in Berlin—joined by Alice Thud, he published a large-scale data visualization of title drops in 73,921 movies that have been released over the past 80 years.

Full of Themselves: An analysis of title drops in movies
A title drop is when a character in a movie says the title of the movie they’re in. Here’s a large-scale analysis of 73,921 movies from the last 80 years on how often, when and maybe even why that happens.

A title drop is essentially when the the dialogue of the movie contains the name of the movie itself. It's a really fascinating article, and an impressive feat of work; the website even reached top spot on Hacker News!

2 — CSS got a New Logo 💻: After well over a decade of using the “CSS3” badge, there’s now a new CSS logo that fits nicely next to the JS, TS and friends logo’s—Kilian Valkhof provides an outline version. The backstory behind the logo's color —namely #663399 rebeccapurple—is surprisingly sad and heartwarming: It's named after Eric Meyer's daughter that passed away from a brain tumor at the age of 6.

rebeccapurple
On the proposal to add the named color rebeccapurple (equivalent to #663399) to the CSS specification.

3 — How Shopify built its BFCM 2023 Globe 🌐: Every year for Black Friday Cyber Monday (BFCM), Shopify puts together a real-time visualization of purchases made through Shopify-powered merchants worldwide—last year they represented this as a globe that would shoot fireworks out at the location where a purchase happened. Leading to this year's BFCM, they published an in depth write-up of how it was done.

How We Built the BFCM 2023 Globe (2024) - Shopify
Every year for Black Friday Cyber Monday (BFCM), we put together a real-time visualization of purchases made through Shopify-powered merchants worldwide. This year we’re cooking up something big, and in anticipation we wanted to show you how we built the globe last year. Video of BFCM 2023 Globe Besides going for better visuals, a big focus was performance. We’ve put together an interactive deep dive into how we built and optimized the 3D visuals using technologies such as Three.js and React-three-fiber. Before we jump in, here’s the globe with simulated data that you can play with. Arcs The arcs flying around are the most important component. Each one represents an order being placed in real time, and they travel from the merchant to the buyer’s location. These can be defined as a Bézier curve with 4 control points. Each point is a 3-dimensional vector. P0: located at start position P1: located 25% of the way between start and end P2: located 75% of the way between start and end P3: located at end position Arc height can be adjusted by moving control points P1 and P2 away from the surface. To render the arc, we create a mesh that is a strip of triangles moving along the curve. This gives us the ability to control thickness and have better flexibility for stylizing it with shaders. You’ll notice however that as you move the mesh around, it disappears from certain angles. We needed a way to make it always face the viewer. The solution was surprisingly simple. The red lines along the curve represent the tangent at those points. Taking the cross product of the tangent with the direction of the camera gives a new vector. This is used in the vertex shader to offset the position so the mesh always faces the viewer. To texture the arcs, the UVs of the mesh are defined with v going from 0 at the start to 1 at the end. So a vertex in the middle of the

Daniel Beauchamp also wrote a more condensed TwiX thread on it.

AI Corner

1 — LLMs For Curious Beginners 🤖: Grant Sanderson shares a new video as a lighter-weight, but still substantive, intro to Large Language Models, complementing the more technical breakdowns of the underlying architecture that other videos of the channel cover.

2 — Something weird is happening with LLMs and chess ♟️: Making LLMs play chess is not a new idea—there's been a bunch of hilarious attempts at matching up two different models and letting them hallucinate all sorts of fantasy moves—but apparently something strange is happening, according to Dynomight: surprisingly gpt-3.5-turbo-instruct beats all other models in its chess abilities! Dynomight also has a hunch for the why, but we'll have to wait for another article to get our answer here.

And that pretty much wraps up the news this week. Now for some other stuff that I want to address 👇

So... why the new format?

We are the architects of our own cages. If something doesn't work anymore—you change it. Simple as that.

I started this newsletter in search of a more sustainable way for producing a piece of writing every week, that still was valuable in some way to the blog's readership without it being a super in-depth researched tutorial. Back then I also had a lot more time on my hands. This hasn't been the case for the past couple of months or so, not really because of the work at fxhash—it's been a really great experience overall—but basically because the newsletter had started feeling like a chore rather than an enjoyable thing that I do on my weekends.

I also have this really bad habit of overdoing things. A newsletter's purpose is to provide a quick update about things, and also be an enjoyable read—however, I tried turning it into some sort of abomination that attempts to go in depth on several topics at once, and to somehow outdo myself every week.

Over the past weeks it started feeling like I was not really giving any one of the topics the attention it deserved—hence why I will not try to do that anymore, simply because it doesn't work, and isn't fun for me anymore. I know that for some of you guys it felt like a mixed bag of candies, informing about a lot of new things at once, but I'd much rather reserve these writing juices of mine that I have left at the end of the week to go towards more in depths pieces and tutorials—which there has been a big lack of this past year. I want to change that in 2025. 🤞

Moving forward, the newsletter will be more concise—I'll still share the same amount of links/things I find interesting throughout the week, but I'm imposing a stricter word limit on myself, and will not spend more than a morning/afternoon on writing it. I believe this new approach will still fulfill the same purpose in our creative coding niche, but with the advantage of giving me more time for the other endeavors that I want/should tackle. Like doing some more sketching again (I did some today 😄), posting more on social media, being active in the discord, and maybe even just going on an additional mental health walk occasionally. 😬

Anyway, let me know what you think about this new format—it'll likely change a little bit throughout in the coming weeks as I fine-tune it!

What have I been up to?

While I took a break from the newsletter, I've still been quite busy—in the last issue that came out before this mini break I announced that I'd be traveling, and not just for fun, but for creative coding purposes! Friday the 8th of November I was kindly invited by Helge Rhodin, a professor, lecturer and researcher at the university of Bielefeld, to give a guest lecture for his Video Game Programming course and introduce the undergrads there to creative coding. Big thanks go out to Dave Pagurek for putting me in touch with Helge—check out Dave's blog, he's got a few really cool posts!

The following week I found myself for a couple of days in London to give not one, but two creative coding workshops for the lovely folks at Trilitech. The first one was public for everyone to attend, and another internal one for the devs there. While I don't have pics for the guest lecture, I do have some pics for the workshop that you already saw in the banner—but sharing again here:

We didn't expect there to be that many people, 30 had RSVP'd and usually that means that a third will actually show up, but in this case it was probably more than 20.

I was also told some more profesh pics and a short post about it are on the way. Big thanks to Vincianne and Beata for inviting me—the idea for this came together after the workshop I gave in Ghent, and I'm really happy that it happened! Definitely going down as a highlight of this year for me!

Some progress on the re-design

When I woke up Saturday morning after the workshop, I felt like a lot of weight had come off my shoulders. It was the first day in a while where I didn't set an alarm to wake me up—but I still ended up opening my eyes around 9:00AM. I felt really well rested then.

When I eventually mustered the strength to peel the covers off of me, and splash my face with some cold London water; I packed my laptop and headed downtown again—somehow I really enjoyed the bustling vibes of Soho. I picked one of those hipster coffee shops in one of the alleways, plugged in my airpods like all the other cool kids, and allowed myself to just do whatever I felt like on my mac—I ended up working for a couple of hours on the blog before my grumbling stomach notified me that it was lunchtime.

Long story short, I ended up making quite a bit of progress on the new theme for the blog, that's also hopefully quite functional when it comes out—I am aiming for the end of the year, with where I'm at, and with what I have right now it is a realistic timeline for me.

Here's a sneek-peak of potentially the new articles/archive page! Might potentially even add a bookmark feature like you can make out here, that lets you save articles for later, and stores them as a cookie in your browser. Still need to figure out a couple of things here though!

Anyway, that's it from me this week—any before I forget it, here's my music recommendation:

Okay, let's roll the credits! If you've read this far, thanks a million! If you're still hungry for more generative art things, you can check out last week's issue of the newsletter here:

Gorilla Newsletter 79
Crafting Painterly Shaders - Djikstra’s Algorithm Universally Optimal - Poisson Point Process on Infinite Grids - Ahmad Shadeed on CSS Masonry - A Modern CSS Reset - Democratising Publishing with Ghost - Github Spark - Building Things with Claude Artifacts

And a backlog of all previous issues can be found here:

Newsletter - Gorilla Sun
Weekly recap of Gorilla Articles, Art and other interesting things from the world of generative art and creative coding.

Cheers, happy coding, and again, hope that you have a fantastic week! See you in the next one!

~ Gorilla Sun 🌸