In todays class we looked looked at the skeleton of typography, looking at the small details such as hyphens, apostrophes, grid layouts and much more.


Classification

Humanist and Old Style are the first serif typefaces influenced by calligraphy.

Serif fonts have strokes at the tip of the letters, this type of style has emotion and feels personal yet traditional. There is a wide range of typefaces that are part of the serif family, below is a list of just a few different styles:

Old style

Old style is the most traditional typeface created in the 15th century by renaissance typographers. it consists of thick and thin strokes and has pointed ascenders. Old style can be often seen in books and older scripts.

Untitled

Modern

Modern typeface was created in the 18th century when printing to paper was massively improved. The style is known for having no slant on the letters, clear-cut transitions in the strokes and long horizontal serifs.

Untitled

Transitional

Transitional style is sharp and has straight serifs, it was first seen in the late 18th century. This style is a mix between modern and humanist.

Untitled

Geometric

Geometric typefaces were a big part of the 20th century. This typeface consists of shapes that form a letter for instance triangles, circles or rectangles.

Untitled

Humanist

This typeface was inspired by latin typography. This style is great for a large body of text. It has low contrast and different weights of strokes. Some humanist typefaces are sans serif while others are serif.

Untitled

Slab Serif

Slab serifs are heavy in weight and have a rectangular appearance. They are bold and catch attention so it isn't great to use this type of style in a large body of text.

Untitled

Glyph

The easiest way to describe what the term glyphs means is looking back in time to ancient Egypt. The Egyptians used hieroglyphics as a way to communicate. A glyph can represent a certain object. As you can see here is a great example of a glyphic typeface it uses triangular serif shapes at the end of each word.

Screenshot 2022-12-20 at 00.37.49.png

Untitled

typography sheep frantenstein.jpg

Heads & Bodies

In the third task we were given two texts on Frankenstein and Do androids dream of electric sheep. we had to add in punctuation and choose a typeface that was authentic and relatable to the two books. I chose a gothic typeface called Deutsch Gothic for Frankenstein as I wanted it to have a old traditional style. As for Do androids dream of electric sheep I wanted it to be a modern typeface so I chose a futuristic style called Modern Love.

We then went ahead and created a iPhone template on Figma, Using Unsplash photos we had to create material typography making sure the text fitted within the grid. The imagery and font had to match the books. Here are two finished designs showing the grid and the final result. Colour, contrast and weight can be added into a typeface to give it character. Headings are bold and should make a statement.

Screenshot 2022-12-19 at 00.33.10.png

Screenshot 2022-12-19 at 00.30.05.png

Going ahead from what we learned in the previous task we created a desktop layout using a 10px grid and 12 columns with a section from John Baskerville as the main body of work. Adding in a paragraph breaker to the beginning of the body of text helped separate the design and made it feel reformed. Adding a light grey background around the block quote makes it feel honest and understanding. We were assigned to create a grid layout on Figma making sure all the text was aligned correctly. I then went ahead and added in a box quite and italic typography to highlight certain important words.

Screenshot 2022-12-19 at 00.26.03.png

Screenshot 2022-12-19 at 00.26.48.png

WatchOS layout

In the final part of class we were assigned to create a Apple WatchOS layout. The aim of this task was to learn how to design on a very much smaller scale which can be difficult. Using a grid I created a template, I then had a look on google and made sure I got the appearance correct as i don’t own a apple watch and have no idea what the layout looks like as i wanted it to look as genuine as possible. I then explored the current Apple typeface SF Pro and downloaded it into Figma.

Screenshot 2022-12-19 at 00.40.11.png

Screenshot 2022-12-19 at 00.43.04.png

Thoughts

Overall I found this weeks tutorial okay, I didn’t enjoy it as much as there was a lot of information on the structure of typography which I don’t particularly find interesting. I did however enjoy the designing part creating the WatchOS layout.