Discrete cosine transform demo

This is the demo of a discrete cosine transform for JPEG encoding that I used in my talk Reconstructing game footage from a Game Boy's memory bus at the 37th Chaos Communication Congress. Please refer to the talk to understand the context (the part about JPEG encoding starts at around 42min).

Each 8x8 tile of a JPEG image is stored as its discrete cosine transform. In other words, each 8x8 tile is stored as a superposition of 64 basic tiles that you can see below as a grid with little sliders next to them. The positions of the sliders represent the coefficients and if you multiply each tile by its coefficient and add all of them up, you end up with the 8x8 tile in the center.

Usage

Sorry, this is not optimized for mobile or actually anything but the slide during the talk :)

Note that the scaling of the sliders and the colors of the individual tiles has been scaled to make the contribution of each tile more visible. Also, the color scale is picked such that zero is a gray value to allow for a visual representation of negative numbers. In the real JPEG encoding the coefficients are not scaled to be directly visualized with a color representation.

Links and references related to the talk