My Door

Data Visualisation

Watch a week in my pandemic life told through the opening and closing of the door to my room. Hover over the doors to read more! (If possible, please see the sketch within the p5js editor, it runs a tad slow on this website)

Data visualisation has always seemed quite straightforward to me. Telling stories with the help of data is easy enough. There's plenty of ways to do so, for example using bar graphs, pie charts, alluvial diagrams, waffle grids, amongst others. However I've never given much thought to embedding stories and narratives within the data visualisation. Telling a personal story through a period of time with data is new for me.

I wanted to track a data point which is unique to my context and surroundings. I initially thought of tracking my digital behaviours, but it wasn't an accurate reflection of me, in this moment. I narrowed in on either tracking the number of times I would bite my nails, or the number of times the door to my room would open. However I quickly realised that the moment I would become aware of biting my nails, I would stop doing it. Although it's a great way to perhaps stop biting my nails, I'd probably end up with no data, or inaccurate data. And so I started tracking the number of times I would open the door to my room.

Before I started tracking the data, I wanted to figure out what my visualisation would look like. This would help define the parameters I would need to collect.

Although I initially got bogged down in trying to use traditional data visualisation techniques, I realised that they didn't convey the essence of the data. I wanted to convey the long gaps in between me opening my door. I wanted to tell the story of my routine through the opening of the door.

Finally, I figured out a simple solution to the problem. Just as I would draw out my idea or the story I wanted to convey, the data visualisation would do the same thing.

Now that I knew what the visualisation would look like, I started collecting the data in a spreadsheet.

Development

As I collected the data, I started work on translating the drawn sketches into an p5js sketch. As I started coding out the visualisation, I realised I had two big challenges.

The first challenge was simply animating a line as it went from one end of the screen to the other end. I figured out that I would have to store the location of a point as it goes across the screen, and then draw a line using vertex(). I didn't want to simply turn off background refresh, as I needed the background to refresh for the visuals. Although in theory, all was well, and the logic worked perfectly in Processing (Java), for some unknown reason, it simply refused to work in javascript. I was trying to use PVector() to store the location values of the point as it went across the screen. I was stuck at this point, but luckily Olivier came to the rescue with a system that used an Object to store location values. This worked as I had envisioned, and now I had a system which would draw lines across the screen! A lot of work for a very simple visual element, but definitely worth the effort. Having successfully figured out how to draw a line, I got stuck in another quagmire which was drawing multiple lines across the screen, all while coordinating with another system which would sequentially create the doors.

The second issue I ran into was the use of setTimeout(), and the way it would delay the drawing of the doors if there were any slowdowns in running the sketch. As it needs a time based value, I had to calculate the timing according to the speed at which the line would travel across the sketch. After some optimisation, the speed of the sketch changed, which affected the way the doors would be drawn. The speed is also dependent on speed of the computer upon which it runs. Hence, the sketch may or may not run well depending on the hardware of the computer. This is worrying as I couldn't find a fix for the issue.

Reflection

Of the many realisations I had while creating this sketch, the most profound one was during the process of creating my own data. Not only was it very empowering, but it helped me see myself through a different lens. It's strange to objectify myself with numbers, especially ones that I have consciously generated myself. I had to make an effort in not changing the way I went about my day. I also explored new ways of narration through data analysis and visualisation. There's a great story to be told through data, and the story becomes even better with some effort and thinking. Sometimes, it pays to keep it simple.