Typography

24/09/2024 - 29/10/2024

Samantha Jizan Amrullah / 0375606

Typography / Bachelor of Design (Hons) in Creative Multimedia

___________________________________________________________________________________

LECTURES

Week 1

On the lecture, mr Vinod explained to us the basics of typography regarding its basic meaning and how it could assist us as a designer. It was explained how typography module would help us visualise and express how words look, as it normally is not something that one would describe to be visually appealing. As said by Paul Rand, “Typography is an art, and good typography is art. Therein lies the problem for both teacher and student” (Kane, 2002). Re: Rules, norms, right and wrong - no hard and fast rules.

It is also discussed the difference between fonts and typeface. Font refers to the individual fonts within a typeface (e.g Georgia Bold). While a typeface refers to the entire family of fonts (e.g Georgia, Arial). 

We were then also briefed on how we should be formatting our e-portfolio. Within the briefing there were a couple of keys to note, such as various coding method that we need to implement into the making of our e-portfolio. 

The book A Type Primer by Kane, J. (2002) was mentioned and suggested to be helpful during the course of our study and will be reference a couple of times.

Figure 1.1 Timeline of typography development

As we are highly affected by western media, all of the information being presented are written from the prespective of the western media, which is why we were reminded to keep an open mind in regards to the study and research of typography such as local contents to develop a better perspective. With that being said, we then proceed to learn on the history of typography and how it has existed for thousands of years, starting with carvings of lines and circles. It has been continuously developing from Phoenician to Roman. Typography kept on developing throughout the years and impacted with different region as different people have different method of writings, which then creates different writing styles across the world.

Week 2

In the lecture, we are starting to learn about tracking such as kerning and letterspacing. Kerning is the automatic adjustment of space between letters, and is different from letter spacing. While adjusting the spacing between all of the letters, essentially kerning the entire sentence in one go, is called tracking. It is important to only kern when necessary to adjust the spacing for better breathing space when a word is too crowded in for example in a header word.

Figure 1.2 example of kerning

Using the kerning method will make the presentation of a media easier to digest and more pleasing to the eye of the reader. 

It was then demoonstrated how it would look like on InDesign. It is also important to have proper margins and coloumns as a base for the text. During the demonstration, we are taught how to do the kerning method. Sometimes words have awkward spacing between them and with kerning, it is aimed to fix those odd and uncomfortable spaces by either adding more spaces or reducing the spaces. This is why when text titles are written in all capital words, more often than not theres a large gap between the letters as it looks more visually pleasing. While for lower cases, it is often more difficult to comprehend when it is more further apart. 

We then move on to text formatting, which is how the texts are alligned. It is the most natural to read texts that are alligned left. For example if it is a large text, doing it in a center alligned text will make it confusing to read as the start of the sentences are different on each line, so it is only good for smaller texts. It is also affected by text letting, which is the space between each line of text. While on the case of justified text, it is orderly however it creates too much gaps in between the words and sentences.

Different fonts will also affect the readability of texts as it creates a sense of different “textures”. Other things to consider include type size which needs to be large enough to be easily read, leading which affect the focus of the readers as too tightly set text can create strain, and finally line length which would affect the focus of the reader (55-65 characters is usually the perfect line length). 

Therefore, with this course we will develop a better sense of balance as different typefaces suits different messages. 

Week 3

On today’s lecture, we reviewed last week’s lecture to further our understanding on the material. We are now moving onto the next topic which is indicating paragraphs such as the usage of ‘pilcrow’, or line space (leading) between paragraphs which creates as easier read. Here we are also learning about how the balance between two coloumn would also affect readability. It is important to have the letting and paragraph sapce to have equal value to ensure cross allignment, which is when two coloumns of texts are alligning with one another.

Indicating paragraphs could also be done with the usage of indentation, which is typically the same size as the line spacing. However, indentation takes up more space, which is why creating coloumns is more effective for a large body of texts especially in printed papers. 

Mr Vinod then explained widow, which is a short line of text at the end of a coloumn, while orphan is a short line of text left alone at the start of a coloumn. 

Figure 1.3 Widow and Orphan

These are urged to be avoided as it created odd gaps. It is explained that the solution to avoid this is by adjusting the letter spacing, but not more than 3 clicks of tracking and or kerning to avoid awkward difference between the previous sentences. It is also explained the etiquette of highlighting texts, such as when changing the type family, its important to adjust the font size as well as it affects how the size looks even though they are the same size. Creating different indentations on highlighted texts could also be useful to improve readability.

week 4

On this lecture, we are starting on the basics of typography. As it turns out, there are various small details on the study of typography. 

Figure 1.4 description of letterforms

Em space is the space between two words, or indication of a long gap. While En is half the space of the letter Em. These two details on the basic of typography are just one out of the many other details that are often overlooked as a reader, yet turns out to be really considered in a detailed manner by designers, hence the importance of learning typography from the basics. Every stroke of a letter has its own parts and name, as if they are a skeleton with their own names of each part of every single detail.

It is then explained that it is important to choose a typefamily that has many different type faces as we could then adjust the texts accordingly with the various options. For example is the usage of small capitals that are often found in serif fonts. Even numerals also have an upercase and lowercase font that are used by designers to properly adjust the result and enhance readability of texts.

Week 5

On this week’s lecture, Mr Vinod explained to us about letter forms. In a letterform, there exist different strokes and even on a seemingly balance letter, even the letter “A” is not completely simetrical. The width of the left stroke is thinner than the right. Even slightly different strokes on a letter, it will really change the mood and emotion of the text. Small difference makes a huge difference as a whole.

Figure 1.5 small difference in stroke between two letters

Having the letters contained below the median line also creates the illusion that the font is smaller. This is done so by using the optical illusion of the outside blank area space. It is important to analyze distinct typeface before deconstructing them. Contrast is also a powerful method on creating different options of typefaces. 

Week 6

_____________________________________________________________________________________

INSTRUCTIONS

<iframe src="https://sdtaylorsedu.sharepoint.com/sites/Section_271556275179277088279661/_layouts/15/embed.aspx?UniqueId=2843b65f-a3b5-4065-870d-38bf9e983a92" width="640" height="360" frameborder="0" scrolling="no" allowfullscreen title="MI_GCD60104_TYPOGRAPHY_BDCM_2024"></iframe>

_____________________________________________________________________________________

EXERCISE

WEEK 1

24/09/2024

Task 1 Excersice 1: Type Expression

During class, we voted for the top 4 words that we are going to use as the subject for task 1. These 4 words were chosen to be expressed in typography:

• Spicy
• Bloom
• Smoke
• Fancy

traditional sketch

digitization

animation

WEEK 2

01/10/2024

Task 1 Exercise 1: Type Expression

With the ideas based on the four chosen words, below are the sketches made by week 2 

WEEK 3

08/10/2024

Task 1 Exercise 1: Type Expression

For today's class during the practical and tutorial from 11-2pm, we were reminded about our task on the four words that were chosen and drafted already as a sketch in the previous week. As I have received feedback on the drafts, I have decideed which design to go for and digitalize for this task. Unfortunately I was not finished with the digitization, but we were kindly given time in class to finalize out digiization for the assignment. For extra marks we were supposed to submit 6 different variation of the work, but due to itme constraint, we were told to focus on 4 instead.

At this stage, i was not yet finished with the final outcome of the designs. So far the finished design shown is  “bloom” and “smoke” just needed to add gradation on the opacity of each alphabet.

It progressed like so:

WEEK 4

15/10/2024

Task 1 Exercise 1: Digital Exploration of Static Design and Animation

During class, we were urged to finish our animation of the texts that we finalized last week in class. Unfortunately I have not finished mine as I still had a couple questions regarding the animation process.

Beforehand, we were also reminded about the rules and constraints of the text's fonts and shapes. It was stressed that creating images and adding colors were not allowed in order to keep it as simple as possible.

The word I decided to animate is "Bloom" because i feel the most satisfied with that one.

                                           

WEEK 5

22/10/2024

Task 1 Exercise 2: Text Formatting

WEEK 6

29/10/2024

On this week, we were given feedback on our kerning task and that helped me choose which result would be the most satisfactory. After compiling the results on one A4 paper size file, it is easier to determine and hhave an overall look on the designs and choose the best out of all 6.

Below is the final edited design I have decided on.

HEAD
Font/s: Bodoni Italic
Type Size/s: 49 pt
Leading: 58 pt
Paragraph spacing: 0

BODY
Font/s: Bodoni Book
Type Size/s: 13 pt
Leading: 14 pt
Paragraph spacing: 1 pt
Characters per-line: 45
Alignment: left justified

Margins: 123 mm top, 26 mm left + right + bottom
Columns: 2
Gutter: 10 mm

WEEK 7

For this task, we were provided with three sets of texts and asked to select one to format. I chose "The Role of Bauhaus Thought on Modern Culture." After reading through the selected text, I began gathering inspiration and sketching out my ideas.

HEAD
Font/s: Bodoni Italic
Type Size/s: 49 pt
Leading: 58 pt
Paragraph spacing: 0

BODY
Font/s: Bodoni Book
Type Size/s: 13 pt
Leading: 14 pt
Paragraph spacing: 1 pt
Characters per-line: 45
Alignment: left justified

Margins: 123 mm top, 26 mm left + right + bottom
Columns: 2
Gutter: 10 mm

WEEK 8

Independent learning week

WEEK 9

this week we continue our work on task 3

O l e d s n c h t i g , . ! #

__________________________________________________________________________________________

REFLECTION

Week 6:

On this week, we were given feedback on our kerning task and that helped me choose which result would be the most satisfactory. After compiling the results on one A4 paper size file, it is easier to determine and hhave an overall look on the designs and choose the best out of all 6.

Week 5:

As we are now on the week of the e-portfolio deadline, Ms. Vitiyaa reminded us to finish up the e-portfolio and asked us about our exercise 2 progress, which is the kerning task. We were told to print out the 6 result of the pages intp one A4 page for her to give feedback on. The feedback I received was very helpful as she told me there were odd gaps on my paragraph that I didnt realise I haven't kerned properly. Moreover, I was told that it is not good to insert too many pictures, because it will drown out the content of the texts. From those feedback, I was able to reflect better and fix up the mistakes I have made to give a better result. Week 4:

On this week, Ms. Vitiyaa gave us feedback for our animated digigtized task 1. We were also given time if we were not satisfied with the result of our design, so there were extra time during class that was given for us to work more on our designs. The feedback that I received from Ms. Vitiyaa was fairly positive, although there were some minor adjustments I needed to do to the animation, such as to increase the frames. Because my animation was lacking smoothness and needed more frames to be able to flow better. Week 3:

During this third week, we were given the time in class to finalize our sketch and digitize it on adobe illustrator. Moreover, we were given feedback on what we can do during the digitization process. Week 2:

on the second week we are finished with out sketches of task 1 by this point. We were then given feedback on each and every of our works on the typography designs. From this we discovered that simpler is mostly better for this task. I started off with a quite complicated design, but after an insightful feedback, I was inspired to improve mys ketches and turn them into a more simplified version.

Week 1: 

On the first week of class, Ms. Vitiyaa introduced us to the first task for the course. She explaind in detail on what is to come and what we should anticipate in the future for this class, such as the briefing of assignments and basic knowledge on how to navigate the student portal for Microsoft teams. There lies an abundance of information and links needed to complete all the tasks from week 1 througout week 14. It was made clear that out Eportfolio is a crucial part as a final result for our grade, as it is an accumulation of all the tasks we do throughout the semester. It was then explained the details of our first task, which is to create typography using the given fonts.