Project 3 Experimental Clock

p5js link: https://editor.p5js.org/jum031/sketches/NRWJdthUR

I used sceentime feature on Mac to check the real working time during my internship

Back to last year, I was taking an internship at a design consultancy company, I did a lot of presentation board, CAD modeling, model rendering and so on. Every single work I did basically was on the laptop, thus the time of using the laptop actually equal to the time of working. So during that time, I always checked my Screen Time tool to see how long have I worked, and I would look how long I spent on each software I used. Since the normal work time for this job was 8 hours, I pushed myself make sure that I need to use the screen time over than 8 hours, otherwise I was kind loaf on the job. The reason that I checked the screen time other than the real clock was that the real clock also counted the time I had lunch or took a break.

Design process

I thought the biggest challenge for me was to figure out how to simulate time consuming in a short animation. I spent a lot of time doing the if(){}else{} for the moving bar, I wanted the moving speed of the bar corresponding to the time change of the screen time. And then I created software categories so it’s easier to see the individual time for each category. Another thing I tried in this project was loading images into P5js, I put three real icons of software to increase the sense of reality.

Reflection

1.The most annoying part in this project was that when the number of the time changed, there was a long sequence of number following the decimal point, I’m not sure if there was a way that could only show integer changing.

2.I thought I need more time on trying frameCount(); and millis();, I might control time of the animation better if I could dig deeper into these commands.