Homework #3
This visualization presents student grades as a set of circles positioned along a common scale from 0 to 6 on the x-axis, with student codes on the y-axis. Each circle is colored based on its distance from the class average: green for the maximum grade, red for the minimum, blue for grades within one standard deviation, orange for those within two standard deviations, and purple for outliers beyond that. The visualization uses position and color hue to support tasks of presenting grades and discovering extreme values, and includes animated text labels for grades, interactive tooltips on mouseover, and gridlines to aid in comparison across the distribution.
AI-generated descriptionBuilt with blockbuilder.org
Homework #3
Juan Sebastian Martinez. Cod: 201125846
What, Why and How Analysis:
What?
In this case, data is presented as a set of tuples with the structure {code:[code] , grade:[grade]} where every grade is identified by it's corresponding student code. We can think of this structure in a more abstract form as if it was a table, with rows that represent student codes and one single column that contains the grade obtained.
Why?
For this visualization, the main task to accomplish is to present the student grades. In addition, we can propose the task of discovering the extreme values of the set of grades and discover other features, like identifying the distribution of distances between students and the average grade of the class, by dividing them in categories that represent how far away from the average are their grades, in terms of standard deviations.
How?
For the tasks described above, we need to separate data to compare and discover the extreme values of the set, later, we need to map data into colors to represent the grade obtained for each student and to identify if the grade is close to the average value.
Decisions for visualization
For this visualization, the tasks deal with numerical or ordered data, as we are trying to present the grades for all the students. With this purpose, it is known that positioning the grades on their common scale is a very effective magnitude channel to present the data. For this purpose, the X axis is used as the common scale from 0 to 5 for all the grades, and the Y axis is used to locate the student codes.
To compare the grades, color is used as another channel for visualization. As we know, color hue is a very effective channel for categorical attributes. In this case, we want to identify the extreme values and group data in categories divided by standard deviations from the average grade. To accomplish this, all points have different colors according to the scale that follows:
The green point represents the maximum grade
The red point relates to the minimum grade
The blue points are the grades that fit within one standard deviation of the average grade
The orange points are the grades that fit within two standard deviations from the average grade.