Have you ever found a chart on a web page and been unable to determine a precise value of
some item on the chart? I tested several solutions to that problem and developed a prototype
interface to demonstrate a couple of the solutions. Formaly:
The purpose of this prototype user interface is to enable end-users to accurately identify axes
intersection points on x-y-plot charts on web pages.
How to:
The prototype interface below uses both slider bars and mouse movement to help you identify
precise values from the chart. Mouse:
Move your mouse over the chart to select a precise chart location. Slider Bars:
Click anywhere on the chart to turn off the mouse movement.
Move the sliders to select a precise chart location.
To start the mouse movement again, click anywhere on the chart.
Body Mass Index:
BMI stands for Body Mass Index and is explained at the Center for Disease Control.
Basically, a lower number is healthier than a higher number. The boundaries indicate healthy(green), overweight(yellow),
and obese(red).
Usability Results:
I conducted two usability studies on this interface. You might be surprised to learn that people
were generally faster, more accurate, and preferred the sliders over mouse movement.
Here is my final report along with the source code for the projet.