Lab 15 Reflection

     Lab 15 was about creating an HTML soundboard and clock. After setting up the HTML document, the first thing I did was create the soundboard by setting up a <div> for each key. Within each key div were other divs and spans, mainly to display and stylize the letter and sound of each key. After setting up the keys, I set up several <audio> tags with the src set to one of the numerous audio files I downloaded and created a function in my JS that would play a sound when a certain key was pressed. To create the clock, I set up a div for the face and 3 hands of the clock. In the CSS, I set the border-radius of the clock to 50% so that it appeared circular like a normal clock. I also used the transform: translate() properties of the hands to make sure all the hands emanated from the center of the clock. I set the position of the hands to match the current time by using a JS function that implemented other functions such as .getMinutes() and getHours() already in the JS library.
     These skills are important to a web designer because they can be used to make a webpage more fun or convenient to use. Implementing JS functions that do things such as play sounds when certain keys are pressed can enhance the user experience by adding a level of stimulus to the interaction. Additionally, using pre-existing functions in the JS library, like getHours() to help display time can be used to retrieve and display data to the user, something that could make things convenient for them. If the user makes a transaction on your website, you can use time retrieving functions to record the time at which the purchase was made. Overall, these are great additions to the user experience.