Homework 1

Steven Rea

Completed

C Level

1.
I changed number of decimal points visible to 0
made frequency dynamic
changed outer tick size (to 10)
changed outer tick padding (to 10)
2.
added grid lines
changed color of grid lines to light blue
changed axis font size (to 15)
removed word 'frequency' from y axis
changed color of axis line to light blue
4.
Modify the sort order (e.g. sort alphabetically vs sort by value). <== overridden by B Level 2. Functionality

B Level

2. Add a button that allows you to change between sorting alphabetically and sorting by value.
3. Add a tooltip that shows the exact value of a bar when hovering over it.

A Level

1. At the start of your visualization, show one bar at a time and smoothly grow each bar from the bottom up to its value.

Undone

C Level

3. Modify the bar colors (e.g. color vowels differently from consonants).

B Level

1. Show a grid line at the mouse y-position (behind the bars) when mouse is hovered over plot area, and show exact value for that line.
4. Figure out how to add a search box on the page, and show the word count for the text in that box instead of from the URL query string.

A Level

Customize the transitions used in your visualization. For example, you could choose one or more of the following:
2. Allow the user to continue adding new text via a search box and button combo, and use transitions to smoothly update the values. (You will likely need to update your y-axis scale as well if you have a new max value.)
3. Smoothly fade in the axis line, tick labels, and grid lines for the y-axis only when your plot area is hovered over by the mouse, and smoothly fade out that information when the plot area is no longer hovered over by the mouse.

Reflections

Most of my design decisions were made to make sure that what I had accomplished was easy to notice for grading. For instance, in general I prefer everything to happen as quickly as possible so that getting information is only limited by your own ability to process it but in this assignment I kept transitions slow so that it would be easy to notice the functionality provided. Also, I think that overall the plot looks better without grid lines -- one of my favorite parts of the Storytelling with Data talk we went to was when the speaker stripped the charts down to their bare necessities (and thereby increased the data:ink ratio).
In general I kept colors as simple as possible since I liked how simple the chart appeared by doing so. However, I liked the transition to orange in the tooltip since it quickly draws your eye to that point in the chart. If a chart like this were to be used in a meeting it would make it much easier to see what was being referenced.