High-Fidelity Prototypes

From the low-fidelity prototypes, we are able to design our mini-site and landing page with a clear idea as to what it should have and look like. InVision has helped us put together the pages and our ideas of how the mini-site and landing pages work together.

Landing Page:

Desktop version

Mobile version

As an option is chosen, the next page slides up to reveal the information. The use of InVision has helped us execute this idea into reality, to see if it works before using it in the actual final product. As the effect became real and having looked at the way it looks, and comparing it to how we had imagined has helped us decide that we will use this transition effect.

The rest button (on the landing page) has been placed on the top left-hand corner instead of in the centre as the centre is a little crowded. By placing it at the left-hand corner, it is a more recognisable spot for a back button which in this case acts like one. Giving users an option to reset the page will allow them to click on the option they had not chosen before, enabling them to learn the difference between the two wines.

Mini-site Page effect:

Desktop version

Mobile version

As mentioned previously in blog posts, the mini-site (desktop) is going to be a single-scroller page. InVision has once again, helped us put our thoughts into a quick and real example of our page. The only thing with our mini-site with InVision is that each section does not fill up the screen as we intent it to, due to it being an image. However, seeing as it still works allows us to further imagine how well our mini site could look with it taking the full screen of the webpage.

Every icon on the page leads back to the home page.

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s