In order to understand the layout a bit better and see whether I was missing anything obvious, I decided to create my first set of digital wireframes for my project.  I was aware they were going to be very basic and probably different from the final design, and that I needed to create a brand afterwards, so this was simply to see whether my spacing was right and if I needed to include any other details visually.

MY DIGITAL WIREFRAMES:

 

WHAT I’VE LEARNED:

• I will change the atom illustration to one that shows what the element looks like in raw rock form – this is because I feel every illustration will look the same and therefore not serve the intended purpose for the students.  (the intended purpose being to allow them to differentiate between them visually and remember their colour and appearance).
• I’ll change my periodic table to be a different shape/ have curvature.  Although my brand isn’t finished I feel as though it doesn’t fit with the overall style i’m going for with it.
• I need to rethink my font choice and thicken the weight of it for better legibility
• I need to change my background colour so the other information stands out better

 

DEVELOPMENT OF TABLE:

I tweaked my periodic table until it fit with the rest of the brand:

ITERATION 1:

I liked how this idea looked in my head but I found once it was integrated with the rest of my branding it looked out of place and much too blocky and sharp.

ITERATION 2:

I tried rounding the edges of the table, and I felt that this looked somewhat better however there was still something still jarring with the rest of the screen.

ITERATION 3:

This third iteration was a lot more fitting visually.  Overall I’m really satisfied with this screen – I may have to work on resizing once the text is added in but for now I’m happy with the appearance.