Lucida Tonal Range Visualization

Scroll down to content

This work was published and presented at HCI International 2018 in Las Vegas.

I supported Brad Wrobleski’s empathetic A.I. photography instructor assistant project by designing a visualization system for communicating the 11 tonal ranges of a photo. Traditionally, simple histograms are used to convey lighting information on a camera. However, in Brad’s experience as a photography instructor, he found that these histograms can be difficult for students to interpret. As a solution, I created a simple visualization system for the prototype that used a binning technique to communicate which colours are in a photo at certain ranges. This concept was then used in Brad’s final prototype which simulated a digital A.I. photography instructor assistant which could help students learn basic photography concepts.

The bars at the bottom of Brad’s photos above communicate tonal information in a number of ways. Following Ansel Adams Tonal Zone guide, there are 11 buckets of tonal information displayed, with darker tones starting on the left and lighter tones on the right. The colour of each bar section is determined by most common colour in the photo that has that particular tonal range. This more quickly communicates information about what parts of the photo actually map to a tone when compared to a traditional histogram. The length of the tone bars map to the percent of that tone in the photo’s area to inform photographers how skewed a photo is towards shadows or highlights.

By using the bottom visualization as an approach to filter the colour information in a photo, we can bring tonal data to the foreground of photos themselves. In the above example, we can see the shadows, midtone, and highlights of the image being expressed.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s