Week 5 in IXD101 built our knowledge of typography and how it can be used for screen. We looked further into the anatomy of type and looking at characteristics such as x-height and serif, san serif and slab serif typefaces. We also looked at the finer details when it comes to punctuation such as the difference between apostrophes and prime marks, the use of hyphens, en dash and em dash, and using hanging quotation and ligatures.

The first task given to us was to take a piece of text from two different novels and use our previous knowledge of fonts, letter, and line spacing, alignment and colour and to then transform the piece of text into something much more readable and interesting. As you can see, I used Merriweather for my font on the Frankenstein piece as it is easy to enterpret on screen yet still quite traditional and I used a variation in weights to emphasise particular parts.

To further enhance this short paragraph, we were asked to take it into Figma and this time, use add an image and use a variation in colour to make it accessible for an iPhone screen. I chose to base my background colour off the colour in the image as it tied it all in together and also allowed me to use white font.

 

The second main task we were asked to do was similar to the first one only this time we were dealing with a much larger section of text, and we had to sort through it ourselves. I used the website Material Design to help me with the sizing of headings, subheadings, and body text for the Baskerville font and which weight to use. We also used a grid to help us align it and make spacing even between paragraphs for easier reading. I have shown what the text was like before alteration and my finished piece with and without the grid.