Hi-fi mockups

Within this blog I am aiming to include my hi-fi mockup that I have created using Figma. When creating my hi-fi mockup I aim to begin including potential image work, areas of data inputed and start incorporating my colour scheme. The images below showcase my process and idealisation of moving forward and closer to creating my prototype .  (Updates included)


Home page –

For my hi-fi mockup I have included my images and layout of navigation on the first page that my user will be welcome onto when on my site. On the bottom left hand side corner demonstrates my idea of a navigation system for this page.

*UPDATE* 24/02/2022

I got to speak to Kyle today in a 1 to 1 and try to give him an insight into my homepage because I wasn’t too sure that I was working and was looking some advice. From looking at my sketches straight off Kyle was able to tell me that this page had too much going and I needed to take it back a step. I was giving the user so much content that areas were getting blinded. Kyle mentioned also that if I was to go forward with a concept around my first design that bringing that design on web flow would be hard to complete and because of this I redesigned my home page fully to help break down my the content. Kyle suggested with focusing on how actual newspaper bring stories to life on their front page so I created the following concepts below.

 

Apollo 11 page –

Creating this page on Figma has been the most enjoyable paged to play around with so far as I got to begin picturing getting to design an article style page. With this hi-fi mockup I included my brand, Nav, image usages and how I would present my title for this page. 

 

Cast and Crew page –

For this page I want it to link off to information based around each astronaut and this will be represent by a hover image of each that will take the user to another section that will include an article style design.

Data –

Within this page the content will be split in two colours with an image in the middle to separate both.

 

Video –

When I was creating this hi-fi mock up design I got to think that this concept would work solely on one page so I am think of incorporating it either into the Apollo page or the data page.

Gallery –

Within my gallery page I want to have a button that once clicked with scroll the user down towards the hanging picture frames of the images.


To conclude this blog include the process I have taken so far with my hi-fi mock-us. These designs are set to change and are only to give me a more structural layout of where to place my content for each of my pages

Leave a Reply

Your email address will not be published. Required fields are marked *