Before beginning to take my brand further and create a landing page, I wanted to make sure I had the majority of the content created so I made a checklist. I ended up working down this list before even thinking of putting together a landing page. This list will also help me when creating my brand guidelines document.
Before beginning my icons, I quickly wrote out which icons I would need for each section of my app screens. I already had an idea of what my icons would look like more most of these, especially as some of them are self explanatory such as phone, settings etc. For others, I experimented while creating them and got inspiration from The Noun Project and Dribbble.
I used Figma to create all of my icons, maintain a 2px stroke for all of them. I thought that an outline effect would be great for this app as I already had quite a varied colour palette and I didn’t want to overcomplicate things. I created one icon set in black and then transferred it into all white as well as I found these stood out well against coloured backgrounds.
This is my final icon set for my app mock ups:
Before beginning my app mockups digitally, I drew them out on paper and wrote down what I wanted to include on each screen. Although there is a high chance that I won’t use all of my screen mockups on my landing page, I think it is still good practice to create more than just the minimum therefore I wanted to create a screen for each section of my app.
Even those these were very rough sketches, they still helped me a lot when creating my screens in Figma as it gave me something to look back at and reference to make sure I didn’t repeat any information and to ensure I included everything I wanted to.