Visualization Design according to Munzner’s Model

20160417_152622.jpg

We decide to approach our visualization in more systematic way. We went back a step and applied Tamara Munzner’s model of visualization design to our data:
Tamara Munzner. Visualization Analysis and Design. CRC Press, 2014. [library ebook]

Bildschirmfoto 2016-04-17 um 16.02.06

Munzner divides the process of visualization into 3 steps:

  1. Data Abstraction – What type of data are you using?
  2. Task Abstraction – Why is the user looking at it?
  3. Idiom – How do you show the data, based on the data type and tasks?

Following these steps, we defined our data and tasks according to her terms.

1. Data Abstraction

First we categorized our data into items, which themselves have attributes which acn either be nominal, ordinal or quantitative. In our case our items are the (library)words from the comments, which have the attributes of
“word” (the actual english word e.g “awesome”, “song”),
“category” (grammar type, or maybe also affinity to a specific genre)
“time” (the point in time at which the word appears),
the derived attribute of “frequency”,
and also the text of the comment it originates from.
We did the same for the item “song” and finally classified all the attributes.

This left us with a nice and clear overview of the data we are actually dealing with and which requirements in visualization these data types might carry in them.

Bildschirmfoto 2016-04-17 um 16.03.16.png

type

 

2. Task Abstraction

Next, task abstraction. Task abstraction helps to define what the actual goal of the visualization is supposed to be. What do we want the user to do? What should he achieve?

Munzner gives a set of actions and targets, which are combined into target-actions pairs to formulate user tasks.

It helped us immensely to think about our goals in terms of target.action pairs. We defined our highest ranked task as “discover-features”, namely the “word-composition” of a song. The user should be able, looking at the visualization, to discover which words are used to describe the song, in which frequency they appear, at which point in time etc.

Other, secondary tasks are
“look up – distribution” (find a specific word and see it’s distribution in the song), “compare-distribution” (is the word frequency pattern for a specific song following the trend/distribution of the genre in whole? Could be separate, small visualization.)
and “enjoy”.

Bildschirmfoto 2016-04-17 um 18.49.05.png

tasks

 

3. Idiom

Based on the data types and tasks we defined in the first 2 steps we tried to choose a fitting visual encoding. Which “idiom” (visualization technique) suits our tasks, how can we “map” our attributes?

Through this though process we realized that the visualization types we had previously pivoting towards might actually not work with the tasks we wanted the user to fulfill. We therefore continued to ideate, now with Munzners model in mind, and narrowed down the possibilities to two idioms that we felt to be more appropriate:

  • Steamgraph
    visual example:
    streamgraph.png
  • Unit chart
    visual example:
    Bildschirmfoto 2016-04-17 um 23.52.32.png

While the Streamgraph provides the user with a better overview of the distribution of the words (also in time) is better for comparison between different songs, and is visually more appealing (especially since it resembles the frequency visualization that is commonly used for music), the unit chart is better suited for the exploration of the data, as we could show the word in the context of the comment through interactivity. Also the attributes “word” and “category” would be more easy to map in the unit chart, since position could be used as a visual variable.

Idiom

 

Afterthoughts / Questions

  • How do we handle the element of time in our visualization? We want the data to update as the respective song is playing, which means we have an element of animation. We are not sure however how to best present that. Should we mask the Streamgraph and reveal it when the song plays? Would that be too boring? Should it organically grow?
    Were and how do the markers in the unit chart appear? Do they pop up or come in from a specific time?
  • How can we make our visualization visually interesting enough to be enjoyable and novel enough for the user without it being totally arbitrary and unreadable?
  • The unit markers give us an opportunity to play with – can we do something “fancy” with them?
Advertisements

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s