Having already looked briefly at a few different things that I wanted to include in my landing page, I jotted a few different sections down that I could potentially split my page into. I then typed out a few different things I could write in each section, such as a heading and smaller body text. Next, I mapped out the layout on paper, including images as boxes and X’s through them. I liked the zig-zag flow that a lot of other designers use. I think this is a great way for the images to not all stick together down one side of the page and helps to break up text. These drawings will give me a tough guide to follow when I draw up my design in Figma before taking it into Web Flow later.
I had a look at other popular banking brands’ landing pages such as Monzo and Revolut to see which imagery they used. I really liked Monzo’s first image that they used as it gives you a view of one of their app screens and also the bank cards that you will have in person when you have your own account.
I chose to recreate Monzo’s mockup of their screen and cards at the side using my own screens and cards that I’ve already created.
I also rearranged the cards around the phone screen to see if i preferred any other arrangements. These are the two I came up with:
I really liked all of the arrangements and believe any of them will look good on my landing page. I will decided which one I think looks best when I begin to create my design on Figma.
As I said before, I thought that the Apple Pay screen would look good if it was placed into a screen that someone is holding. I chose to do that in Figma and here was the outcome.
I really like how it turned out especially as there is no background colour to this, it has a lot of potential to be included in my landing page. I think this makes the app come to life a lot more as its placed into a real hand rather than just seeing what it could look like in a flat screenshot on its own.
To show off the different colours of cards that can be chosen. I decided to create a fan of cards. This was done just by rotating the cards to different angles. I really like the look of this as it shows off the colour palette well and I like that the Mastercard logo works well against all of the colours.
