Typography - Exercises



29.08.2018- 03.10.2018 | Week 1 - Week 6
Kang Jiet Yee | 0336776
Typography
Exercise


LECTURES

Lecture 1 : Briefing & Introduction to Typography

29.08.18 | Week 1

Briefing for E-portfolio

The class was began with introduction of our assessment which is briefing for the e-portfolio that need to be done in blog format, Mr Vinod cleary listed out the expectations for us to fulfil our e-portfolio in the entire semester.

Introducing Typography

As mentioned in the lecture, typography has over five hundreds year in history, from calligraphy to lettering then typography. Typography are to enhance the intended meaning in letters, it is the art and technique of arranging type to make written language legible, readable, and appealing when displayed.

Based on wikipedia,typography was an important subject to explore and study which used by people in different work fields such as typesetters, compositors, typographers, graphic designers, manga artist also people who arranges words, letters, numbers, and symbols for publication, display, or distribution. Nowadays, which people have stepped into the digital ages, typography has involved to people life as a simple practices, every individuals are able to practice typography.


Terminologies
Font: Originates from French word "Foundry", which is the process of creation or designing the type face.
Typeface : Define as the weight of a family which having similar characteristics
Type Family : An individual typeface designs that differ from a basic style of alphabet.


Lecture 2 : Basic / Describing letterforms

05.09.2018 | Week 2

Typography have numbers of technical terms that mostly describe specific parts of the letterforms, by knowing the letterform's component part, it will become more easier to identify specific typeface.


These are a few terms that mentioned in the lecture where I found it important.

Baseline : The imaginary line in the visual base of the letterforms
Median : The imaginary line defining the x-heigt of letterforms
X-height : The height in any typeface of the lowercase 'x' 

Strokes : Line that defines the basic letterform

Ascender : The portion of stem of a lowercase letterforms that projects above medians 
Bowl : The rounded form that describes a counter. It may be either open or closed.
Cross Bar : The horizontal stroke in a letterform that join two stems together 
Cross Strokes : The horizontal stroke in a letterform that joins two stems together 

Uppercase : Capital letters, including certain accented vowels, the c cedilla and. tilde, and the a/e and o/e ligatures 

Lowercase : Lowercase letters include the same characteristics as uppercase

Small Capitals : Uppercase letterforms draw to the x-height of the typefaces. Small caps are primarily found in serif fonts as part of what is often called expert set.



Lecture 3 : Exercises 

12.09.2018 | Week 3

No lecture on this week, we are asked to proceed with our work on calligraphy and followed by the sketching of lettering design.



Lecture 4 : Development / Timeline

19.09.2018 | Week 4 

Early letterform development 
- Initially writing meant scratching into wet clay with sharpened stick or carving into stone with a chisel
- The Greeks changed the direction of writing. Phoenicians, like other Semitic peoples, wrote from right to left. The Greek developed a style of writing called ‘boustrophedon’ (how the ox ploughs), which meant that the lines of text read alternately from right to left and left to right. 

Handskript 
- Square capitals were the written version that can be found in Roman monuments. These letterforms have serifs added to the finish of the main strokes.
A compressed version of square capitals, rustic capitals allowed for twice as many words on a sheet of parchment and took far less time to write.
- Both square and rustic capitals were typically reserved for documents of some intended performance. Everyday transactions, however were typically written in cursive hand in which forms were simplified for speed

Blackletter
- With the dissolution of Charlemagne’s empire came regional variations upon Alcuin’s script. In northern Europe, a condense strongly vertical letterform know as Blackletteror texturagained popularity
Gutenberg’s skills included engineering, metalsmithing, and chemistry. He marshaled them all to build pages that accurately mimicked the work of the scribe’s hand – Blackletterof northern Europe

Text type classification
-Typeforms have developed in response to prevailing technology, commercial needs, and esthetic trends. Certain models have endured well past the cultures that spawned them.


Week 5 : Exercises 

26.09.2018 | Week 5

No lecture on this week, we continue our lettering and started to introduce the following exercise, which is type expression.



Week 6 : Exercise and Briefing for Project 1

03.10.2018 | Week 6

No lecture on this week, we proceed to the letter expression exercise and brief for project 1 and Adobe InDesign.



INSTRUCTIONS 



Calligraphy | Week 1 - Week 3

We are assigned to practice horizontal, vertical and circular stokers that enables us get familiar to the technique for using calligraphy pen which is to maintain the angle and thickness of our stokes before we move on to calligraphy writing.

Fig. 1.1 Horizontal Strokes
Fig. 1.2 Vertical Strokes


Figure 1.3 First Attempt for Circular Strokes
Fig. 1.4 Circular Stroke (After Feedback)


Fig 1.5 1st attempt with horizontal, vertical and circular strokes
Fig 1.6 2nd attempt with horizontal, vertical and circular strokes. (After Feedback)



After finishings the stroke exercises, we are asked to choose a hand and practice on the alphabets.

Fig 1.7 Practice for alphabet 
Fig 1.8 Practice of Alphabet A-O
Fig 1.9 Practice of Alphabet P-Z

As we complete our practice for all the alphabets, we need to choose a quotes to write on a pice of blank paper. 

Fig 1.0 Practice on Graph Paper
Fig 1.11 1st Composition and Placement on Graph Paper
Fig 1.12 2nd Composition and Placement on Graph Paper

Fig 1.13 Compared of different composition and placement on blank paper




Fig 1.14 Attempts for the decided composition
Fig 1.15 Final Outcome on blank paper

Lettering | Week 3 - Week 4

I came out with few types of lettering design that describe each of my different personality and characteristics. As I am the type of person that prefer things simple in life and always being straight to the point in my words, I choose to go with minimalist design with simple straight lines.

I named the design 'Broken', the lettering design illustrates that I was a broken person due to some reason in my past.

Fig 2.1 Sketching lettering of my name 


Fig 2.2 The chosen design of lettering 

After the feedback was given, I start to improve and add some elements to the design by putting more feeling in it based on Mr Shamsul's advice, I can show the broken by fall apart in my final outcome.


Fig 2.3 Selected design created on Adobe Illustrator



During the process to animated the lettering, Mr Vinod suggest me to add some crumbs while it breaks, adjustment of the placement, also decrease the movement in the animated GIF. The final outcome can clearly shows that the characteristic of broken when all the letter snaps the broken pieces are in between the broken part.

Fig 2.4 Screenshot of artboards used in illustrator 

Fig 2.5 Final Outcome : Lettering 



Type expression | Week 5 - Week 6

We are given 6 different words to work on, which are 'sparkle' , 'float' , 'blur', 'heavy' , 'tall' and 'rage'.
Only selected type family given can be used n this exercise.
After we finalise all the design, we need to printed it on a horizontal A4 page and hand in to our lecturer.


Fig 3.1 1st Attempt for Type Expression



After I getting feedback from Mr Vinod and Mr Shamsul, I changed and improve the design of 'sparkle', 'float' and 'blur' for a better outcome.


Fig 3.2 Final Outcome for Type Expression

I chose the word Heavy to do the animation. My first attempt for this animation was not good enough, Mr Shamsul was giving me feedback, he states that the 'h' can push the words below more which better illustrate the meaning of heavy.
Fig 3.3 Chosen word for animated Type expression 




Fig 3.4 1st Attempt for animated Type expression 


After getting feedback from Mr Shamsul, I add more art boards to create a suitable animation for my letter expression.


Fig 3.5 Art Boards in Illustrator for Type Expression 
Fig 3.6 Final Outcome of Animated Type Expression


FEEDBACK

Week 2
For my strokes exercises, Mr Vinod has pointed out my mistake with the circular stoke which I have done in a wrong way, it was in a smaller size which need to improve and practice in order to fit the size correctly.

Week 3

Mr Shamsul mentioned that my words are consistent for the practice, however for letter 's' and 'x' should be shapper, and the stroke in the midle of letter 'e' are too bold. For my quote, overall it is good, but the spacing need to be more consistent. Need to pratice for letter 'e','s' and 'x' also for the spacing. Besides, for the lettering design of our name, after Mr Shamsul take a look of few of different design of lettering, he prefer my second design that illustrates myself as 'broken' and allows me to work with it.

Week 4

For the final outcome of calligraphy, Mr Vinod commented that it is clean and nice, but still can be improve more. In terms of lettering design, Mr Vinod ask me to add more feeling of sadness in it to further express about the characteristics of broken. And finally came out a suitable design for lettering.

Week 5

I asked for both Mr Vinod and Mr Shamsul's advice for my animated lettering, they commented that the speed for breaking was too slow also the composition also add some crumbs while it breaks can further illustrate the meaning of broken.


Week 6
For the type expression exercise, Mr Vinod and Mr Shamsul mentioned that the words "sparkle", "float" and "blur" is not good enough and need to make some changes to improve it. After all my type expression outcome are approved, they asked me to choose a word to work on, I chose the word "heavy", Mr Shamsul commented that my first outcome for animation was not good enough, my letter H is heavy which can move the small letters way more downwards. After I done the changes, Mr Shamsul approved it and mentioned that he likes the speed where I put the pressure to move down all the letters.


REFELCTIONS

Experience

Week 1
I was surprised where we need to note down all the things we have learn and done in the semester in a blog, this was a fresh new experience and a chance for me to learn.

Week 2 

I spoiled two of my calligraphy pen while practice for the alphabets due to pushing too hard on the pen also for pages of practice on graph paper. The spacing between words was challenging to do maintain the consistency.

Week 3

Looking for a suitable quotes that I can feel myself was a great experience, then moving on to practice on graph paper and decide the placement and composition for the quote.

Week 4

Design of lettering was not easy, I was confusing in different design where I found my final outcome's inspiration by looking at different movie poster.

Week 5

We learnt how to use illustrator and photoshop to create an animated gif of the lettering, I was first confused during the process but getting well after the explanation from both lecturers. And we were assign to work on our next exercise, which is type expression.

Week 6 

I completed my first attempt for type expression and show it to Mr Vinod and Mr Shamsul, they gave me feedbacks on it to create a better outcome. I have a lot of attempt for the word 'saprkle', the process of doing it was not easy but it was getting better as I try to make changes and improvement on it. After completed the type expression exercise, Mr Vinod start the briefing for Adobe InDesign, and we have to start on our project 1.

Observations

Week 1
I need to be concentrate in class in order to have my e-portfolio complete and reliable. For the stokes exercise, it was tough in the beginning to draw a perfect stroke, I learned that we must practice and get used to our pen to come out with perfect strokes.

Week 2

It was not easy to control the force on pen for writing and maintain a consistent shape of alphabets, practice is needed to maintain the consistency of spacing.

Week 3

We need to observe for suitable placement and composition of the quotes in the paper to have a nice outcome. Before doing the quote on a blank paper, we must practice it on graph paper first to be proficient.

Week 4

Based on Mr Shamsul's suggestion, I have observe different lettering style from movie poster which fits the movie itself, the bold of the letters are also an important factors that determines the meaning.

Week 5

Then some of the inspiration pops out when I saw the words given for our exercises, I draw it out straight in my note book in order to keep the inspiration, I found it quite useful where I note down my ideas immediately which helps me a lot and improve the efficiency in my work.

Week 6

During the design process, I tried to work with only letters which not include any graphical elements, it was not easy but the outcome turns out really clean and I was satisfied with it.

Findings

Week 1
During the process of creating my blog, I found out that formatting for our blog is important which need to be consistent and neat to provide a clear vision for people who viewing my blog .Besides, I also observed that the texture of graph paper used are important to practice our calligraphy pen, which I try out paper and founded a suitable texture for writing. 

Week 2 

By practicing a lot on graph paper, the shape of my alphabets shows more consistent. The spacing between words also need to be consistent which follow the distance of n space.

Week 3

After trying out for different placement and composition, I finally produce an expected outcome for my quote, knowing that placement and composition can be an important factor in creating a professional working outcome.

Week 4

We must look at different reference to really describe our feelings in the lettering, the distance between words must be maintain and consistent to makes the lettering more clearly to read.

Week 5

I must always carry a notebook with me where I can jot down the idea and inspiration when it pops up in my mind unexpectedly which might be helpful for me in my future work as an ready made idea.

Week 6
Noting down the information from lecture and briefing do helps me a lot to memorise most of the details in our assessment, things that we unaware may be helpful sometimes.


FURTHER READINGS 

Week 1

Type Manners : Simple tips for everyday typography By Jim Williams 

Fig 4.1.1 Book Cover (Front)
Fig 4.1.2 Book Cover (Back)

Chapter : Setting headlines and display type (3.1 Selecting a typeface)

When I was browsing in the library, the descriptions at the back of this book catches my attention which it was related to the lecture. Jim William (2012) highlighted that typeface are like clothes for language, they come in thousands of different styles, and all say something different about the wearer. It is therefore important to select the most appropriate typeface for the message.


Fig 4.1.3 Improper Typeface Example
Fig 4.1.4 Proper Typeface Example

As stated in the picture above, a proper typeface will be more effective to carry out the message. A financial company will have to use a more formal look typeface for their headline to show their professionals to clients. In the other hand, while the targeted market are related to kids, It should have a fun and creative typeface that will catches children attention on it.

These can clearly shows that, by applying a good typeface will able to enhance the effect to provide information to people who are reading it. A suitable typeface for different purpose need to be choose wisely as it illustrate the meaning and purpose from the provider.



Week 2

The Fundamentals of Typography by Ambrose, Gavin Harris, Paul

Figure 4.2.1 Book Cover

This week lecture was talking about basic letter terms, which was interesting where a single letter can include so many terms in its different part. Then I wanted to know more about things beside of the x-height and terms in letter which I founded a book that talk about the basic terminology of typography


Chapter 2 : Basic Terminology


The terminology of typography is the fundamental of printing industry, the need fr accurate communication and majority of typographical terms are still in common usage despite the change of the technology.


Fig 4.2.2 Bounding Boxes
The Bounding Boxes is which I found it interesting, the bounding box provide space between characters to avoid them crashing together in a constant measurement.It results to give a textbook more  balanced feel by changing the space between letters.
Fig 4.2.3 Tracking / Letterspacing 

Tracking, or known as letterspacing are also important while we type, it adjust the amount of spacing between characters, but some combinations will need additional kerning if they are either colliding, or appearing too far apart.



Fig 4.2.4 Kerning 


Kerningsimply means that the addition and subtraction of space between letters to create a comfortable setting. Certain letter combinations will appear to have either too much, or too little space between them, the function of kerning is to create more comfortable looking typography. 

Week 3 

Tasty Story : Legendary Food brands and Their Typeface By Joke Gossé



Fig 4.3.1 Book Cover 

There was no lecturer on this week, we was assign to do lettering after complete the calligraphy task, I went to library searching for book that can relate to lettering design, then I found the book that catches my attention which it was talking about the famous food industry use of typography in their logos, advertising and packaging that change over time. This book contains numerous brand with their logos, posters,packages and illustration.
It was an excitement for me to find a such interesting. book in the same time which can provide me more information about how letters are able to brings out the meaning for the brand and products.


McDonald's - Since 1940 (United States)


McDonald's is the world famous fast food restaurant that goes around the world, with more than 33,000 restaurants in 118 countries serving more than 26 million customers a day that results McDonald's dominates the fast food industry.


Fig 4.3.2 McDonald's Logo


The evolution of McDonald's logo:
When people look in the first logo of McDonald's in 1940 (2) , they can't relate the design to McDonald's, one of the most recognisable icons in popular culture all around the world. They soon make changes on their logo in 1950s, inspired by one of the earliest versions of the McDonald's logo, which featured a Speedee cartoon figure with a hamburger-shaped face (3). However, they decide to upgrade the company's image in 1962 by coming out with a new logo, with clear source of inspiration which is the construction of the restaurant with two Golden Arches. The symbol was compromised two overlapping yellow bows with. diagonal line cutting across them to symbolised the sloped roof (4). 
Fig 4.3.3 McDonald's Letterform
Seven years later, their symbol was stylised into a more legible M, the design of the type of the McDonald's brand name is based on a Grotesque san serif typeface, aimed to create a neutral typeface that had great clarity and intrinsic meaning in its shape.
Today, the golden arched M is one of the most recognisable symbols for McDonald's, symbolising globalisation.

In conclusion, It clearly states that typeface and design used are important in brand a logo since it brings out the symbolise and also the message that deliver to the consumers.



Week 4

The Complete Typographer 2nd Edition by Will Hill 

The topic of this week is about the development and timeline of typography, we have get to know about the history of early letterform development.


Fig 4.4.1 Book Cover


Chapter 1 : The History Of Type - The Digital Age 

From 1970 onwards, type industry have involved of digital technology, the growth of type technology has profoundly affected people that works with type, such as designers, typographers, typesetters and manufacturers alike.


Fig 4.4.2 The Digital Age


People then start to computerise typography, they translate the traditional typeface into digital form

The digital type on screen is form from a grid of pixels, with all of the pixels that falls within the letterform appearing, also know as bitmapping. Which both the screen information and the eventual printed output are bitmapped. The requirements of the internet have create a major new area of typographic practice, where digital design initially focused on making screen information resemble the final printed output.

Digitalisation of letterform was a revolutionary change in typography, which people  can easily access to various type form in nowadays.

Comments

Popular Posts