We are undergoing the difficult time right now in 2020 since the outburst of the COVID-19. The global pandemic is causing so many distress in us. I have been keeping myself busy with movies, books, and cooking while conducting social distancing to prevent the spread of the virus for over two weeks now (today's date is March 28th, 2020). Recently, I am revisiting the Meditations by Marcus Aurelius. This is book is his journals for himself to go through hard times. I find some of the quotes very relevent especially for the COVID-19 situation. I feel the urge to create something so that people can talk about their feelings. As of March 29th, 2020, I created the Simple Diary to fulfill different browser requirements. Upon user testing, some browsers won't allow microphone input. So I will have to figure that out.
The final project by Ashwita Palekar, my dearest friend.
The most important part in terms of design is the pastel color palette. For the shapes, I used this palette, while for the background, I used this palette.
This project is built with p5.js and p5.speech.js along with CSS, html and Javascript. I used p5 speech library to recognize the spoken words and convert them into texts. I split the speech content into words and found the end letter to each word to assign the color of the shapes.
The background color is changed accordingly to the amount of letters in one sentence. I originally only had circles to be generated accordingly to the speech. I wanted to add layers to it. Thus, I created lines, triangles, and arcs.
I also implement four types of fonts for the same reason: Oswald, Liu Jian Mao Cao, Spicy Rice, and Cairo. For the branding, I adapted the look of a typical sound spectrogram and simplified it into the logo we see here. The style for the Audio Diary is minimalistic yet welcoming. In order to make it more welcoming, I used the font Libre Baskerville
In order to make the interaction smooth, I added some features such as footer and header inside the canvas to prompt the users to explore more.
I am making other websites in the meantime to respond to hard times like the current pandemic of COVID-19. Hopefully, I will build a collection of these interactive websites together to alleviate the stress.