Good Night

I have always had a habit of napping, and I love sleeping. For this project, I tracked my sleeping and napping pattern in seven days. In addition to the sleeping and napping pattern, I also record if the quality of sleep/nap is good or not, and whether I dreamed everytime I sleep or nap during the week.

Project Instruction

On the background, there are seven main sections representing seven days of this week. Rectangles represents sleeping, and circles represents napping. The length of the rectangle is corresponding the the duration of sleep. For napping, I use the circles differently - for each nap, the upper circle represents the starting time of the nap and the lower circle represents the end time of the nap. From the overlapping circles, you can tell that the nap is really short. For the sleep quality, red means bad quality and the calming purple means I sleep / nap well. Lastly, I incorporated the occasions of dreams into the shapes. If I dreamed, the rectangle or circle will be random colors blinking.

Design Process

I first collected the data and record them into excel table. Then, I classified the data into different types, sleep or nap, good or bad quality, dreamed or not. Then I use rectangles to represents sleep, circles to represent nap. Good quality is calming light purple while bad quality is dingy red. I used setTimeout to animate the Zzz… to bring some fun elements into the sketch, and it looks like the little girl is falling asleep and snoozing. I also used setInterval to animate the slogans. Nowadays, many people don’t sleep well. So I want to sent some wishes to people. I wish people to sleep tight, nap soundly and have sweet dreams. I used setInterval to loop these wishes so that people can get the message constantly when they look at my sketch. A little issue that I encountered for this project: I was trying to use setTimeout to bring out the “dream” occasion, but it did not work out as another setTimeout that I use to show the text(‘Zzz…’), still trying to get it works.

Assignment Reflection

Data visualization is fun. It turns boring data into intriguing visual elements that are easy to understand. Using a customer font definitely brings some flavor to the project. I learnt how to store data in JSON file and extract them correctly into the p5 sketch. I also learnt how to animate text differently by using setTimeout and setInterval. I know there is still space to improve, such as making the random color of “dream” executing by setTimeout, and present the time of the day more clearly on the graph. I also want to add in the index to help viewers to understand the graph.