Designing with D3

For an assignment in my Notational Systems class, each student was tasked to create their own way of representing something. It could be a data set, method of showing instructions, anything. I decided to conduct a survey to see the work habits and personality types of the students in my class. I decided to show only three data profiles in my class, but I felt these students might work well together based on their survey responses.

Struggles

My initial design intention was to portray the data profiles and have the lines grow thicker during mouseover and have the meaning of each shape pop up during the click function. There would be no color, but decided to add it in the end to make the diagram more visually appealing. I struggled to figure out how to get the text to work. Instead I showed a key below the image for each answer and decided to have a click function show the portrait in black and white. Both versions portray the information but in different ways. I also really struggled making this website but had help from Youtube videos, W3 schools, and my peers.

End Results

I feel my D3 interaction is very simple but I am proud that I was able to make it work. If I knew how to begin, I think it would have been cool to make the survey as part of the click interaction and clicking the answers would form your own data profile.