CRT screen effect in Open Frameworks

The quality of digital displays have been changing over the years. Now, we have such quality of processing and density of pixels that we can see 4K videos at 120hz in hand-held devices. The fidelity of image is astounding.

Older screen technologies had constrains that left distinctive remarks on the image that was perceived by our eyes. In particular, the technical characteristics of CRT screens had an effect on the final image that one would see, despite what the input data represented. This is most obvious when one displays pixelated images like videogame sprites from console videogames in modern LSD and LED screens; and this is very apparent when you see the same image displayed in different types of screens, like this fantastic twitter account shows. For this particular type of art, it looses much of its appeal.

So, I wanted to see what would happen if I would to roughly imitate how the color is printed in CRT screens with code. For that reason, I wrote a simple openFrameworks program that does the following:

1. Load an image and read its pixels.
2. Map each color channel to a 0 to 1 interval.
3. Use that interval to render an element (like a rectangle) and control characteristics of that element, like size and transparency
4. Do this for each pixel.

The results are actually very pleasant (click to enlarge):

Those images are entirely comprised of red, green and blue rectangles; there are no oranges, yellows or whites.

And since I had a 0-to-1 mapping of color infomation, I could easily animate a transition between images.

I think this is a concept that can be extended and refined further to transform any kind of image and give it a bit of a retro-feel to it.

The code is in a Visual Studio 22 solution and C++, to execute you’ll need that IDE installed.

You can find a link to the code here: https://github.com/leacasas/cathodic_pixels