> The goal of Explanations is to try to allow people to play with fun parts of computers. Graphics, compression, audio. The tagline is my biggest inspiration: “Play, don’t show”, riffing off the typical “Show, don’t tell” rule of writers and authors everywhere. Why bother giving a diagram when I give you an inspector and let you poke at things yourself!
> Previously, this series was known as “Xplain” and was more focused on the X11 window system and protocol, but I’ve been slowly moving towards anything that interests me, and I’m hijacking this project for it since I really like the format and style I’ve developed. The code for every single one of these demos is available in the GitHub repo, and I do try to comment heavily and go into even more depth there! Play with the code! Use it for one of your own projects! It’s all MIT/X11 licensed. I very much appreciate followup questions and any sort of feedback through the links mentioned above.
> You might have noticed that when you ran your mouse over the stipple, your cursor changed. That’s because this isn’t just any old stipple image, that stipple is actually the background of a full X server session running in your browser using HTML5 canvas. All of the interactive demos will use this framework to explain what’s going on under the hood.
Author comment: https://news.ycombinator.com/item?id=21041340
The Enigma Machine
> The Enigma Machine was one of the centerpoints of World War II, and its cryptanalysis was one of the stepping stones from breaking codes as an art to cryptography as a science. The machine encrypted messages sent between parts of the German army – operators would type a key on its keyboard, the machine would scramble that, and a letter would light up on the top.
> This notebook simulates an Enigma Machine and visualizes how it works. The Enigma Machine is an especially neat thing to visualize because it was electromechanical. As you used it, it moved. Instead of circuit traces, it had beautiful real wires connecting its pieces.
> A whole mangrove forest, lighting up all at once, plunging into darkness, then lighting up all again – in near-perfect synchrony. How do thousands of fireflies coordinate with each other? Who is the conductor of this silent symphony?
> Transparency may not seem particularly exciting. The GIF image format which allowed some pixels to show through the background was published over 30 years ago. Almost every graphic design application released in the last two decades has supported the creation of semi-transparent content. The novelty of these concepts is long gone.
> With this article I’m hoping to show you that transparency in digital imaging is actually much more interesting than it seems – there is a lot of invisible depth and beauty in something that we often take for granted.
> Execute Program is for people who already know a programming language. We’ll help you to fill in gaps in your existing knowledge.
At least in the beginning, seems introductory. Not sure how advanced it goes.
The Atlas of Moons
> Our solar system collectively hosts nearly 200 known moons, some of which are vibrant worlds in their own right. Take a tour of the major moons in our celestial menagerie, including those that are among the most mystifying—or scientifically intriguing—places in our local neighborhood.
Pretty heavy web page.
Urbano Monte’s Massive Map of the Earth (1587)
> In 1587, Urbano Monte made the largest known early map of Earth. The map consists of 60 panels that were meant to be assembled into a planisphere (a circular map that rotates about a central axis) measuring 10 feet across. The David Rumsey Map Center recently acquired a manuscript of Monte’s map and digitally assembled all 60 pieces into the full map (inlined above but click through to zoom/pan).
Weight Agnostic Neural Networks
> Not all neural network architectures are created equal, some perform much better than others for certain tasks. But how important are the weight parameters of a neural network compared to its architecture? In this work, we question to what extent neural network architectures alone, without learning any weight parameters, can encode solutions for a given task. We propose a search method for neural network architectures that can already perform a task without any explicit weight training. To evaluate these networks, we populate the connections with a single shared weight parameter sampled from a uniform random distribution, and measure the expected performance. We demonstrate that our method can find minimal neural network architectures that can perform several reinforcement learning tasks without weight training. On supervised learning domain, we find architectures that can achieve much higher than chance accuracy on MNIST using random weights.
Some fun demos.
> Networks rule our world. From the chemical reaction pathways inside a cell, to the web of relationships in an ecosystem, to the trade and political networks that shape the course of history. Or consider this very post you’re reading. You probably found it on a social network, downloaded it from a computer network, and are currently deciphering it with your neural network. But as much as I’ve thought about networks over the years, I didn’t appreciate (until very recently) the importance of simple diffusion. This is our topic for today: the way things move and spread, somewhat chaotically, across a network.
Medieval Fantasy City Generator
> This application generates a random medieval city layout of a requested size. The generation method is rather arbitrary, the goal is to produce a nice looking map, not an accurate model of a city. Maybe in the future I’ll use its code as a basis for some game or maybe not.
Unraveling the JPEG
> JPEG images are everywhere in our digital lives, but behind the veil of familiarity lie algorithms that remove details that are imperceptible to the human eye. This produces the highest visual quality with the smallest file size—but what does that look like? Let’s see what our eyes can’t see!
> This article is about how to decode a JPEG image. In other words, it’s about what it takes to convert the compressed data stored on your computer to the image that appears on the screen. It’s worth learning about not just because it’s important to understand the technology we all use everyday, but also because, as we unravel the layers of compression, we learn a bit about perception and vision, and about what details our eyes are most sensitive to. It’s also just a lot of fun to play with images this way.
Just going to link to the whole blog.
Log-spherical Mapping in SDF Raymarching
> In this post, I’ll describe a set of techniques for manipulating signed distance fields (SDFs) allowing the creation of self-similar geometries like the flower above. Although these types of geometries have been known and renderable for a long time, I believe the techniques described here offer much unexplored creative potential, since they allow the creation of raymarchable SDFs of self-similar geometries with an infinite level of visual recursion, which can be explored in realtime on the average current-gen graphics card. This is done by crafting distance functions based on the log-spherical mapping, which I’ll explain starting with basic tilings and building up to the recursive shell transformation.
> This application visualizes the relationships between the convex, regular-faced polyhedra. The 120 solids presented here can be transformed into each other by a network of operations.
Two Chaotic Motion Demos
> I’ve put together two online, interactive, demonstrations of chaotic motion. One is 2D and the other is 3D, but both are rendered using WebGL — which, for me, is the most interesting part. Both are governed by ordinary differential equations. Both are integrated using the Runge–Kutta method, specifically RK4.
NYC Travel Time Map
> On this map, each stop‘s distance from your chosen stop is based on the time it‘ll take to travel there.
> Histograms are a way to summarize a numeric variable. They use counts to aggregate similar values together and show you the overall distribution. However, they can be sensitive to parameter choices! We’re going to take you step by step through the considerations with lots of data visualizations.
An Interactive Tutorial on Numerical Optimization
Pretty cool final example, converting distances to a map.