Clock tab how to#

Clock tab how to#

Accomplishments that we're proud ofĪctually managed to make a working web appįiguring out how to gather local time of user’s computer in javascript There were some small challenges when it came to the coding aspect of things, however stack overflow and w3schools were amazing in helping us solve the problems. As a group, we planned each step of the way very clearly and had quick update meetings every hour or so to stay on track. To be fairly honest we didn't run into any major problems at all. Bottom left corner is the random inspirational quote generator, and opposite in the bottom right is a pop-up collaborative playlist full of chill bops for studying! Challenges we ran into Lastly, at the bottom footer, we have our copyright statement in the center. The clock is actually divided into many smaller boxes, one for hours, minutes, seconds, am/pm, date, and month. Moving down in the beige coloured section is the main body clock area. Opposite in the top right corner is the Clock Tab name, and when a timer is activated it will substitute over the name. The header consists of two drop-down menu lists, one for the to-do list and the other for timers. Clock Tab is split into 3 boxed sections, header, main body, and footer. This single-page frontend web app is constructed with HTML, CSS, and JavaScript. The application also comes with a to-do list feature, 3 different timer intervals, and an inspirational quote generator. What it doesĬlock Tab is a minimalistic web app that simply displays the current time (centered in the window), with the purpose of increasing a user's productivity by unknowingly recognizing the passage of time.

After coming up with a list of over a dozen different ideas, we noticed everyone had a similar idea to make a productivity application, that's how we ended up going with the clock tab. We started by brainstorming around an overarching theme involving either mental health, health, and making the mundane fun.