Interactive bar graph

Average reaction times on a lexical decision task of about 20 participants. Lexical decision consists in determining whether a sound is an existing or a non-existing word. Below, pairs of existing and non-existing words are displayed as overlapping bars in green and orange respectively. The name of existing and non-existing words is printed at the bottom of each bar in white and black colored font for existing and non-existing words respectively.

This visualization is very powerful because in one bar it displays 1) the size of the responses to word and non-word and 2) the size of the difference between the two responses. In fact, if the tip of the bar is green reaction time was shorter in deciding that the sound represented a non-word rather than a word (i.e., the orange bar is shorter than the green one). On the other hand, the tip of the graph was orange if the reaction time for deciding that the sound was a word was shorter than for a non-word.

Interactivity

The graphs displays a `large' number of words (about 50 words and 50non-words). To keep the labels readable and not clutter the visual display I added interactivity. The left/right arrow keys allow to scroll through the set of word/non-words pairs. The up/down arrow keys allow to scroll among the single respondents. Please scroll up and down the image when the image is displayed in full screen, or each time you will push an arrow key you will also navigate in the web page itself.

The graph on this page summarizes this data with a different visualization.

This diagram is inspired by the outstanding population pyramid stacked bar graph by Mike Bostock.
Posted by: paolot