The next page I started working on was Home Page. The first challenge that I encountered was how to make lights out effect. In essence, this effect makes the image lighten up when a user navigates a mouse on it. The point is that it requires some CSS coding that I haven’t done before. After I spent some time, researching on the Internet, I found how to make it due to Rollover Widget. Although it took some time to make it work I did it in the end. Initially, this effect just let me change the colour of the image. However, while playing with it I realised that I could manipulate the size. To be more precise, when the page is opened the image with font is dark but when a user navigates on it, it increases in size as well as lightens up. I asked my group mates how it worked better for them as for the users and they advised me to leave the second version. I agree with them because I feel the second version makes viewers feel that some knowledge is becoming closer when the size is increasing. This effect is exactly what I need.
Then, I worked on an animation that is located on the background. Basically, I have just created a fading effect in Edge that makes a timeline to appear smoothly, leading the viewers.
But after I combined the images on the foreground and background I encountered some problems with the coding that changed the location of the images to the right side. So as to solve it, I watched some Youtube videos that helped me to change the code and make all elements work as I would like it to be. Overall, I have done all the effects that I planned, learning new information about Muse’s capabilities and some coding part of it.