Saturday 3 October 2015

Website Development

Today I have been working on developing my website concept into a more refined design. I have taken the mouth idea and merged it with my other concept I had originally come up with, which consisted of using arrows to move horizontally through different pages. I have included JPEG images of each page below:










Overall, I am really happy with how this is coming along. I have also been using the "Hover" effect in several areas. For example, the arrows pointing to the next page increase in size when hovered over, while the text on the tabs such as "Home", "About" etc. turn bold as you hover over them. The small rectangular shape saying "Learn More" also increases in size, as does the "Love Your Coast" logo. This is a way of indicating that they are clickable, rather than relying on the change of mouse cursor to indicate so. I have also been playing around with the "More info" pages, which appear once the learn more tab has been clicked. An example of this has been attached below. The screen increases in size (vertically) to accommodate for the increase in information, while the image in the background lowers opacity and fades into a grey shade, in order to increase the readability of the foreground text.






The link to trial this InVision file has been shared below:

https://invis.io/324F3WZ5V

By Monday, I will continue to work on developing this so that it is nice and ready for our interim presentation. Next week, once I begin refining the website, I will then replace the Lorem Ipsum with proper text. I really feel like our suite of different media, such as the website, flyer, poster and optional piece is coming along really nicely. The aesthetic style seems to flow across all of them nicely and they definitely help with the User Experience.

No comments:

Post a Comment