Project #9: Data Portrait

View my code here!

Description

In this project, I documented the daily amount of water consumed for 7 days, and created a json file for the data. The size of the rounded rectangles represents the amount of water, and the distance between them represents the time.

Technical components that I explored in this project:

- setTimeout()

- setInterval()

- Creating and Loading JSON in P5.JS

Design Process

I took this project as a chance to help myself drink more water and become healthier as I tend to focus on my work and forget to drink water. To log my data for this project, I started by choosing a water glass that I’ll be drinking water from for the next 7 days. 10 would represent a whole glass of water and 5 would equal to about half a glass of water, but mostly I just eyeballed it. After obtaining the data, and transferring my data from excel to json, I started to think about the visual of my project. It rains down like an old typewriter, logging my daily water consumption line by line, which reminds me of rain and the motion of water. I intentionally wanted my final project to have some relationship to water, or at least reminds people of water somehow.

My Water Logging Sheet:

Reflection

Personally, I really enjoyed this project, not only because I drank more water during this project and hydrated myself, but also because I learned a lot about the relationship between arrays, data, objects, dot notation. Everything kind of cleared out for me after this project, and I obtained more understanding of the interactions between each element. Overall, I really enjoyed working with data, and data visualization.