What is a style tile?
A style tile is a collection of elements from other interfaces including colour, typography, buttons, etc. It is a representation of what you want a project to look like visually. They are like mood boards that provide you with inspiration, but these are more specific and have more detail.
My style tile
This is the style tile that I created. I had never done one of these before, so it was an interesting process. I started by looking at blueprints as my initial idea is to design something in this style. The rocket blueprint is labeled nicely in a very structured way, and I could use this layout for the text in my project. The illustration on the blueprint is a possible style I will use so it resembles it as much as possible.
I then added some typography inspiration. These are from blueprints and NASA documents. Most use a San serif font which I will most likely use for headings as they are clean and easy to read. I want my final font choice to match the tone of voice and look like they belong on a blueprint. I experimented with the heading sizes compared to the body copy to see how they would look together. I will probably have my heading 1 in bold and in a different colour so it stands out. The heading 2 is then semi-bold and the body copy is regular. This is why it is important for me to choose a variable font.
I designed some buttons using different colours to see what worked best. These will of course change depending on the background colour I choose. Overall, I made them clean and eye-catching.
For the colour pallet, I stuck to 4 colours so it’s simple and not overwhelming. Black and white can be used for text. The blue will of course be used for the blueprint effect and possibly on some headings to make them stand out. The yellow can also be used for headings and if I want to create the effect of a NASA document as these are often yellow.
Overall, I found this task useful as it gives me an idea of the style and direction I want to go in.