Depth Perception - Facebook

Depth Perception Browser Add-on

I’ve been wondering for a while what the world inside a computer would look like. Would the directory structure form some kind of landscape, with hills and mountains? While I didn’t end up investigating the folder hierarchy on my computer, this question made me look differently at the world of web pages.

Web pages share a similarity to the folder structure inside your computer, which is their hierarchical nature. In addition to that, elements of a web page have dimensions and are part of a visual layout. So will I really discover a landscape this time?

To investigate the structure beneath the surface of a web page, I’ve developed a browser add-on which colors each element based on its  depth in the hierarchy. As you can see in the images below, I’ve applied several color schemes to get a sense of depth. In the night vision color scheme, elements with brighter colors are closer to the viewer (higher) than elements with darker colors. The same holds true for the heat-map color scheme I applied to YouTube.

Still in search of a landscape, I fantasized I might discover islands in an ocean if I were to opt for a geology inspired elevation map color scheme. When I applied this color scheme to my Facebook timeline, it didn’t look very organic or landscape-ish to me. But eventually, when continuing this investigation into three dimensions, I did discover urban landscapes, or structures resembling alien space stations. Take this 3D print of a web page as an example of what Web Spaces look like.

Published by Jip de Beer

Jip de Beer, initiator of MADtech.me, is an artist who operates on the intersection of art and computer science. He's fascinated by automation and attempts to optimize his artistic work(flow) with programming. His work usually involves a Web Browser and tends to be generative, interactive and strongly visual. In his daily life, Jip tries to have a positive influence on the world by living a vegan lifestyle.

2 thoughts on “Depth Perception Browser Add-on”

Leave a Reply