TYPOGRAPHY EXERCISES

28/08/19-25/09/19 (Week 1-Week 4)

 Alfie Koh Chen Fong (0340310) 

Typography

Exercises

---

LECTURE

Week 1(28/08/19):Introduction of Typography

At the beginning, our lecturer Mr Vinod and Mr Shamsul taught us how to create a blog which is a platform to post our work and takes notes every classes' feedback, reflection and anything given by lecturers. We made our first post with severa labels such as Typography, Digital Photography and etc. Lecturers also asked us to join a Facebook's group which is Typography(TDS) and post our blog's link on the comments. After that, Mr Vinod asked everyone to introduce themselves. Through the introductions I know that my classmates' hometown and I am the only one from Muar which is in Johor.
From today's first class we know that the differences between 3 Typography terminologies such as font, typeface, and type family.

Terminologies:
1.Font:Design process of a typeface.

2.Typeface:Individual face within the type family.

3.Type family:The overall family of the typeface with different weights.


Week 2(04/09/19):Development of Typography

At the second week, Mr Vinod introduced about the development and the development timelineo of Typography.It is interesting that Greek change the direction of the writing from right to left and this called "Boustrophedon"(IMG 2.01)

IMG 2.01 Boustrophedon

Also, we know that there are two written version which are called "Square Capital"(IMG 2.02) and "Rustic Capital"(IMG 2.03)We can see that the evolution of typography had a big contact with the tools between each generations.

IMG 2.02 Square Capital

IMG 2.03 Rustic Capital

Week 3(11/09/19):Text/Tracking: Kerning and Letterspacing

At the third week our lecturers started explain about kerning and letterspacing.

Kerning:The automatic adjustment of space between letters.(IMG 3.01)

Letterspacing:The addition of space between the letters.

Tracking:The addition and removal of space in a word or a sentence.Tracking classify as normal tracking, loose tracking and tight tracking.(IMG 3.02-3.03)

Flush left:Each line start at the same point but ends wherever the last word on the line ends. Spaces between words are consistent throughout the text, allowing the type to create an even gray value.

Centered:This format imposes symmetry upon the text, assigning equal value and weight to both ends of any line. It transform fields of text into shapes, thereby adding a pictorial quality to material that is non-pictorial by nature.

Flush right:This format places emphasis on the end of a line as opposed to its start.

Justified:Like centering, this format imposes a symmetrical shape on the text. It is achieved by expanding or reducing spaces between words and, sometimes between letters.

IMG 3.01 The difference between kerning and without kerning

IMG 3.02 The different types of tracking

IMG 3.03 Tracking paragraph

---

INSTRUCTION

 Exercise 1

(Week 1-Week 3):Animated Lettering

For our first exercise, we need to create 5 types of font according to one of our personalities.I can say that unstable is the best personality to describe myself.So i choose it for my first exercise.

The first font i created was inspired by wave.(IMG1.01)We know that wave always moving unstably.So I use this kind of line to create a font for my name.(IMG 1.02)

IMG 1.01 Wave

IMG 1.02

After creating my first font, I accidentally remember one of the font that usually appears in horror movies.(IMG 1.03-1.04)

IMG 1.03

IMG 1.04 The most favourite font I created

For third font, I tried to use tornado to create a font because tornado also known as a very unstable speed of wind.(IMG 1.05-1.06)

IMG 1.05 Tornado

IMG 1.06 Third font I created

After finished my tornado font, I created another font by using lines.It looks similar to code.
(IMG 1.06-1.07)

IMG 1.06 

IMF 1.07 Fourth font look like code

Last font I was inspired by Tetris which is my favourite childhood game.(IMG 1.08-1.09)

IMG 1.08 I use 'N' for the example 

IMG 1.09 Final work

After designing the font, I showed my design to Mr Vinod.He asked me to digitize this font by Illustrator.(IMG1.04)I moved the lines every frame to make sure the moving will looks unstable.(IMG 1.10-1.13)

IMG 1.10

IMG 1.11 I move the lines a little bit 

IMG 1.12 I also adjust the length of some lines

IMG 1.13

This is the animation I made to express "unstable".(IMG 1.14)

IMG 1.14 My first animation "unstable"

Exercise 2 At week 3, lecturers told us to digitize 6 words which are CLEAN, GIGANTIC, EXPLODE, EMERGE, SNEEZE, and PARTY.I showed my draft and concept to lecturers and they said the words GIGANTIC and EMERGE need to be designed better.(IMG 1.15)

IMG 1.15 The draft of 6 words

After that, I started digitize my words with Illustrator and this is the completed work.(IMG 1.16)

IMG 1.16

Mr Vinod asked us to choose 1 of the digitized words and animate it to express the feeling of the word.I choose EXPLODE because I think that is funny to make an explosion by using the word EXPLODE.I used about 20 frame to create my animation.(IMG 1.17)

IMG 1.17 The process of animation

This is the completed animation.(IMG 1.18)

IMG 1.18 My second animation "explode"

---

FEEDBACK 

Week 1(28/08/19):
No feedback is given since I didn't show my work to the lecturers yet.

Week 2(04/09/19):

Specific Feedback:
I show my fonts to the lecturers and they said they prefer this design
(IMG 2.1)than this design(IMG 2.2) which are inspired by tornado.They asked me to start digitize this font by Illustrator.

IMG 2.1

IMG 2.2

General Feedback:
I must try to design more and more different pattern so that I can improve myself in font designing.

Week 3(11/09/19):

Specific Feedback:
Mr Vinod said my animation can increase some wild animals to make it more unstable. He also wan me to put my GIF on my blog.

General Feedback:
We should not use capital letter for the title "exercise" which is under the instruction.Also, we need to put description under every images so lecturers can understand clearly which images I am talking about.

Week 4(18/09/19):

Specific Feedback:
Mr Vinod and Mr Shamsul said my animation looks not enough for explosion.They said the shape of explosion need to be improved and make the scale of explosion bigger.Also I need to make some shaking for the bomb because it will make it looks reality.

General Feedback:
Lecturers said the processes of my animation which are emerged in my blog should be JPEG and don't take the photo by phone.They also asked us to install 9 types of family which Mr Vinod posted in TDS group.

---

REFLECTION 

Experience:

Week 1(28/08/19):
Mandarin is my first language,so it is quite hard to join an English environment. Every time lecturers are talking, I need to be very focus so that I can understand what lecturers said. But it is interesting to learn typography and I will try hard to improve my ability.

Week 2(04/09/19):
This is the first time to use Adobe Illustrator, I found a lot of ways to download free Adobe software cause it's too expensive for me to buy the original version.Lecturers teached us how to use the Illustrator but it's quite hard for me to control very well.

Week 3(11/09/19):
This week's lecture section is quite hard for me to understand clearly because of the vocabulary.I need to improve my listening skill.

Week 4(18/09/19):
Even though I take a lot of notes for this week.I still can't use InDesign very well when doing my project 1.I felt struggle and upset.

Observation:

Week 1(28/08/19):

I looked around and there is several people don't understand how to make a blog same as me.Thanks to our lecturers giving us example of blog so that I am able to make a blog easily.

Week 2(04/09/19):

I am grateful that my classmates and lecturers are kind to teach me anything about the assignment.Even though I can't really understand so well what they were explaining about.

Week 3(11/09/19):

I found that my classmates have a lot of troubles in animation.I will try to help them as I can.

Week 4(18/09/19):

My classmates also struggling in InDesign same as me. Also, we are not really understand how to do project 1 correctly.

Finding:

Week 1(28/08/19):

It is difficult to follow the class because there is a lot of information given by our lecturers at the beginning.A habit of taking notes is important for me now.

Week 2(04/09/19):

I am interesting in animation a lot and animation is the only section that I can follow my classmates.I will try to do my best in animation

Week 3(11/09/19):

This week I can control Illustrator easier and make animation faster. So glad that I am following the footstep of my classmates now.

Week 4(18/09/19):

We walked around and look at other people's animation.There is a lot of fantastic work appealing me.

Hope I can as well as they are in animation.

---

FURTHER READING

Week 1(28/08/19)-Week 2((04/09/19)
Book title:Smashing Logo Design:The art of creating visual identities (IMG 1.01)
Author:Gareth Hardy

First book for further reading(IMG 1.0)1)

For my further reading, I went to library and lended a book called "Smashing Logo Design:The art of creating visual identities".I read first chapter for my first week further reading, the title is "The Logo".

 I learned about:

1.What logos are?
-A logo is either a series of words or an image that attempt to represent an instituition or an individual in a way that is symbolic in some cases or parallels the person's identity.

2.Who uses logos?
-Business, products, individuals, campaigns, and non-profit organizations and charities.

3.Where logos are used?
-Print, television and movies, the internet and signage.

For the second chapter, the title is "The types of logos"
I learned about:

1.Pictorial Marks
-Everything from simple line drawings to detailed illustrations that use a form of literal imagery as the identifier.(IMG 2.1)

2.Abstract and Symbolic Marks
-A logo consist of a nonliteral interpretation of a concept, idea or belief held by identifier.(IMG 2.2)

3.Enblems
-An amalgamation of a surrounding shape and the name of identifier.(IMG 2.3)

4.Characters
-A characters represent the identifier.(IMG 2.4)

5.Typographic
-Use words and letters to translate a message and convey a sense of style in the same way that pictures can.(IMG 2.5)

IMG 2.1 The famous logo which is "APPLE"

IMG 2.2 The famous logo which is "NIKE"

IMG 2.3

IMG 2.4

IMG 2.5

Week 3(11/09/19)-Week 4 (18/09/19)
Book Title:Typographic systems(IMG3.1)
Author:Kimberly Elam

IMG 3.1 Typographic systems

By the intoduction of this book, it said typographic are akin to what architects term shape grammars.Through shape grammar, styles are identified via rule-based compositional systems.
These shape grammars are employed for both historic analysis of style and for design.

From this book, I learned about :

1. Initially, radial components occupy a considerable amount of compositional space because each line is seen as an individual element.(IMG 3.2)

2. Once the designer is comfortable with the radial system, experimentation begins with curved lines, grouping line, grouping amd right angle arrangement, and corner focal point placement.(IMG 3.3)

IMG 3.2 Initial phase

IMG 3.3 Intermediate phase

3.Emphasis strategies: The composition is the same in all three works on this page, with text seperated into groups and then rotated to seperate the groups with space. Change in color and tone and different versions of the circle bring variety. The color red is used sparingly as an emphasis accent.(IMG 3.4)

IMG 3.4 Emphasis strategies