Typography Task 1 / Exercise


3/4/2023-8/5/2023 Week 1- Week 6
Ng Jia Ern 0363033
Bachelor of Design (Honours) in Creative Media
Task 1 /Exercises







LECTURES

Week 1: Typo_0_Introduction

Introduction to Typography
In this lecture, Mr Vinod explained what typography is, and told the difference between font and typography. 

Typography
-The creation of typefaces/type families.
-Can comes in animation form e.g. beginning of movie titles.
-Use in:
    -website          -app design (interface)        -sign design (help navigate to different spaces)
    -book cover              -poster             -logotypes

*Mr. Vinod advise us to READ MORE & PRACTICE MORE (through online/library)

Calligraphy (write)  --> Lettering (draw) --> Typography (art)

*Mr. Vinod said: Art is hard to teach, but he teaches the process to make art.

    "NO HARD AND FAST RULES"
     --takes time, trial and error

-Bad typography will bring negative impacts on learning. (if the text arrange messily)

Terminology
Fig 1.1 Difference between font and typeface



Week 2: Typo_1_Development

-It is important to do research on local content or content that is come from small community.
-Mr. Vinod said that when we pick  a topic for research methodology --- "GIVE VOICE TO VOICELESS." 

History of typography

Early letterform development: Phoenician to Roman
-In the past, people wrote with simple tools and materials like wet clay and stone carving, so their letterforms were characterized by simple combinations of straight lines and circles.
-The type of writing that is produced is significantly influenced by the tool that we are using.

Fig. 2.1 Evolution from the Phoenician letter


Phoenicians (People in the Middle East-Jews/Christians/Muslims...)
-Wrote from right to left.

The Greeks
-Change the direction of writing.
-The lines of text read alternately from right to left and left to right. (boustrophedon-how the ox plows)
-Did not use letter space or punctuation.

Fig. 2.2 The direction of writing for the Greeks (boustrophedon)


Etruscan (and then Roman)
-Carvers would paint the letterforms onto the marble before inscribing them. (Because marble is expensive)
-This caused them to develop strokes based on which tool they used. (like the Serif/Roman font we see today)

Fig. 2.3 Evolution from Phoenician to Roman


Hand script from 3rd - 10th century C. E.
Fig. 2.4 Hand script from 3rd - 10th century C. E.
Square Capitals 
-The written version that can be found in Roman monuments.
-These letterforms have serifs added to the finish of the main strokes.
-The variety of stroke width was achieved by the read pen held at an angle of approximately 60 degrees off the perpendicular.
-They started to use a pen that is slanted, resulting in thick and thin strokes that have developed.

Rustic Capitals
-A compressed version of square capitals.
-Took less time to write.
-The pen or brush was held at an angle of approximately 30 degrees off the perpendicular.
-Although they were faster and easier to write, they were slightly harder to read.

Roman Cursive
-Everyday transactions were often written in cursive hand, with forms simplified for speed.
-The development of the lowercase letter form was the result of writing fast. (Writing uppercase letter forms quickly)

Uncials
-Incorporated some aspects of the Roman cursive hand, especially in the shape of the A, D, E, H, M, U, and Q. 
-Uncials are simply small letters.
-The broad forms of uncials are more readable at small sizes compared to Rustic Capitals.

Half Uncials
-A further formalization of the cursive hand.
-Replate with ascenders and descenders to mark the formal beginning of lowercase letterforms.

Caloline Miniscule
-In 789, Charlemagne (Europe's first unifier since the Romans) issued an order standardizing all ecclesiastical texts. 
-He delegated this responsibility to Alcuin of York, Abbot of St Martin of Tours. 
-The monks rewrote the text in majuscules (uppercase), minuscules, capitalization, and punctuation, establishing the standard for calligraphy for a century.
 

Blackletter to Gutenberg's type
Blackletter / Textura 
Is a condensed and strongly vertical letterform, popular in northern Europe.
Rotunda
Is a rounder and more open-handed letterform, popular in southern Europe.

Fig. 2.5 c. 1300 Blackletter (Textura)


Gutenberg
-Gutenberg marshaled engineering, metalsmithing, and chemistry to build pages that accurately -mimicked the work of the scribe's hand - Blackletter of northern Europe. 
-His type mold required a different brass matrix, or negative impression, for each letterform
-He has developed a mechanism where printing can be done much more quickly rather than documenting information to more books than a scribe could
-This is the turning point in Western civilization with regard to publishing large amounts of texts

Fig. 2.6 c.: 42 line bible, Johann Gutenberg, Mainz


Text Type Classification
Fig. 2.7 Text Type Classification (25/4/2023)
1450 Blackletter
-The earliest printing type, its forms were based on the hand-copying styles used in books in northern Europe.
1475 Oldstyle
-Based on the lowercase forms used by Italian humanist scholars for book copying and the uppercase letterforms found inscribed on Roman ruins.
1500 Italic
-Condensed and close-set, allowing more words per page.
-Since the 16 century, all text typefaces have been designed with accompanying italic forms, so now not considered as a separate typeface, 
1550 Script
-Attempt to replicate engraved calligraphic forms.
-Should not use them for large amounts of text. (difficult to read)
1750 Transitional
-A refinement of oldstyle forms, this style was achieved in part because of advances in casting and printing.
-Thick and thin relationships were exaggerated, and brackets were lightened.
1775 Modern
-Serifs were unbracketed, and the contrast between thick and thin strokes are extreme.
1825 Square Serif / Slab Serif
-Heavily bracketed serif.
-Little variation between thick and thin strokes.
-Developed to use in commercial printing.
1900 Sans Serif
-Eliminated serifs altogether.
-Strokes were flared to suggest the calligraphic origins.
1990 Serif / Sans Serif
-Includes both serif and sans serif alphabets.

It is important to know some history because:
"If you don't know history, then you don't know anything. You are a leaf that doesn't know it is part of a tree." --- Michael Crichton

Week 3: Typo_3_Text_P1

1. Tracking: Kerning and Letterspacing

Kerning 
-The automatic adjustment of space between letters
Letterspacing 
-To add space between letters.

Fig 3.1 Kerning
Tracking  
-The addition and removal of space in a word or sentence.

Fig 3.2 Normal tracking, tight tracking and loose tracking

-People tend to recognize the counter form of the space between the stokes when reading

Fig 3.3 The counter form between letters 

Fig 3.4 Normal tracking vs Loose tracking vs Tight tracking

-Loose tracking and tight tracking reduce the readability and recognizability of the pattern that formed the words.
-From Fig 3.4, we can see that the left paragraph is easier to read than the other two.


2. Formatting Text

Flush left
-Closely mirrors the asymmetrical experience of handwriting.
-Each line starts at the same point but ends wherever the last word ends.
-The spaces between words are consistent, creating an even grey value in the type.
-However, flush left has jagged shape formed by each end line on the right.
-It is important to make the ragging on the right smooth when using this format.

Fig 3.5 Flush left text

Centered
-Creates symmetry by giving equal value and weight to both ends of a line of text, and transforms fields of text into shapes.
-It's important to adjust the line breaks to prevent the text from looking jagged.
-Mr. Vinod did not advise us to use centered format text when come to a large amount of text, because the starting point is irregular that hard to read. 
-This format should be used sparingly for small amounts of text.

Fig 3.6 Centered text


Flush right 
-Emphasizes the end of a line
-Making it suitable for situations where a strong orientation to the right is needed to clarify the relationship between text and image, such as in captions. 
-It is important to use flush right formatting appropriately to enhance the visual presentation of the text.

Fig 3.7 Flush right Text

Justified
-Creates a symmetrical shape in the text similar to centering
-Achieved by adjusting spaces between words and letters. 
-Sometimes create vertical gaps called 'rivers' of white space within the text. 
-To avoid this issue, careful attention to line breaks and hyphenation is necessary.

Fig 3.8 Justified Text 


-Designers tend to set type one way or another based on several factors, personal preference, prevailing culture, and the need to express play important roles. 
-However, when setting the field of type, keep in mind the typographer's first job---clear, appropriate presentation of the author's message.
-Type that draws the reader's attention away from the actual words is simply interference and should be avoided. 
-Simply said, if you see the type before the words, change the type.


3. Texture

Fig 3.9 Anatomy of A Typeface

-Choosing the right typeface is important as it can affect the message conveyed. A skilled typographer must understand which typeface is best suited for a particular message.
Fig 3.10 Different typefaces example

-Text with larger x-height or thicker strokes creates a darker mass on the page compared to text with smaller x-height or lighter strokes. Recognizing these variations in colour is essential for creating effective layouts.

Fig 3.11 Different typefaces show the different grey values

- Fig. 3.11 shows how different typefaces have different grey values, some lighter, some darker. The best choice would be to choose the middle grey value.

4. Leading and Line Length

Type Size 
-To ensure readability, the typeface size should be appropriate to be read from a distance.
-Text type should be read easily at arms length.

Leading 
-The space between lines
-If the text is too tight reader can easily lose his or her place.
-If the text is too loose also will distract the reader from the material at hand.
Fig 3.12 Tight leading and loose leading

Line Length 
-The number of characters in a line 
-Recommended to keep the line length between 55-65 characters


5. Type Specimen Book
-Displays examples of different typefaces in various sizes. 
-It is used as an accurate reference for the outcomes of a typeface in terms of type size, leading, line length, etc, which helps in choosing the appropriate typeface.

Fig 3.13 Sample type specimen sheet

Week 4: Typo_4_Text_Part 2


Compositional requirement
-Text should create a field that can occupy a page or a screen.
-An ideal text should have a middle grey value (on the left of Fig. 3.14),  not a series of stripes(on the right of Fig. 3.14)
Fig 4.1 Different Grey value example


-Enlarge the type to 400% on the screen to get a clear sense of the relationship between descenders on one line and ascenders on the line below. 

Fig 4.2 Difference between one point leading

-Fig. 4.2 shows the difference between one point leading that is unrecognizable at 100% on most monitors.
-If the outcome is on a printed page, it is best to print out an actual page to look closely at the details. 
-If its outcome is on screen, then the judging type on screen is accurate.


Mr Vinod ends this lecture with a quotation:
THE DEVIL IS IN THE DETAILS.----Jane Jacobs
-Typography is all about details. The more detail orientated you are the better you get and the better your sensitivity.

6. Indicating Paragraphs
Pilcrow ¶ 
-Is used to indicate paragraph space, a holdover from medieval manuscripts seldom use today.

Line space (leading)
-Paragraph space value should be the same as the leading space to ensure cross-alignment across columns of text.

Line Space vs Leading
-Line space is the space from the baseline of a sentence to the descender of the next sentence. 
-Leading is the space between two sentences.
*In typography, we use the term leading.
Fig 4.3 Leading and Line spacing
Indentation 
Standard indentation
-The indentation of the first line in a paragraph, the ident is the same size of the line spacing or the same point size of the text.
*When using indentation, we should never have ragging on the right, so is best used when the text is justified

Extended paragraphs
-Creates unusually wide columns of text.
-Usually used in academia.

Fig. 4.4 Left: Standard indentation, Right: Extended paragraphs

7. Widows and Orphans
-We must take great care to avoid widows and orphans especially dealing with large amounts of text.

Widow
-Is a short line of the type left alone at the end of a column of text. 
-The solution to widow is to rebreak our line, use a force line break

Orphan 
-Is a short line of the type left alone at the start of a new column. 
-It could be avoided by reducing the column height on one side or reducing the line length of comlumn.
Fig. 4.5 Example of Widow and Orphan

8. Highlighting Text


Fig. 4.6 Highlighting text example

Ways of Highlighting Text:
-Italic
-Bold
-Change the typeface + Bold (San-serifs look larger than serifs, so might need to reduce the size of san-serifs text by 0.5)
-Change the colour (only use black, cyan, and magenta)
Fig. 4.7 sans serifs vs serifs

*When formatting a large amount of text, Mr Vinod recommends reducing the point size of number by 0.5, to ensure visual cohesion of the text.

-Add a field colour at the back of the text (with indentation or no)
Fig. 4.8 field colour background example
-Place typographic elements (such as bullet points)

Fig. 4.9 Example of adding bullet points


-Use quotation marks
   -Note that prime is not a quote. 
   -The prime is an abbreviation for inches and feet. 
Fig. 4.10 Prime and quote

9. Headline within Text
A head 
-Indicates a clear break between the topics within a section.
-set larger than the text, in small caps and bold.
Fig. 4.11 A head examples


B heads 
-Subordinate to A heads.
-Indicate a new supporting argument or example for the topic at hand.
Fig. 4.12 B head examples


C head 
-Highlights specific facets of material within B head text. 
-C heads in this configuration are followed by at least an em space (two space bars) for visual separation.
Fig. 4.13 C head examples

Fig. 4.14 A head, B head, C head




5. Cross Alignment
Cross-aligning headlines and captions with text type reinforce the architectural sense of the page—the structure—while articulating the complimentary vertical rhythms.

In some cases, cross-align can be maintained by doubling the leading space of the text type to be used as the leading of the headline type.
Fig. 4.15 Cross Alignment



Week 5: Typo_2_Basic


1. Describing letterforms

 

Baseline

Visual base (imaginary) of the letterforms.

Median

(Imaginary) line defining the x-height of letterforms.

X-height

The height of the lowercase ‘x’.

Stroke

Any line that defines the basic letterform.

Apex/Vertex

Point created by joining two diagonal stems.



Arm

Short strokes off the stem of the letterform.




Ascender

 

The portion of the stem of a lowercase letterform that projects above the median


Barb

The half-serif finish on some curved stroke


Beak

The half-serif finish on the same horizontal arms


Bowl

The rounded form that describes a counter


Bracket

 

 

 

The transition between the serif and the stem


Cross Bar

The horizontal stroke in a letterform that joins two stems together




Cross Stroke

The horizontal stroke in a letterform that joins two stems together


Crotch

The interior space where two strokes meet


Descender

The portion of the stem of a lowercase letterform that projects below the baseline


Ear

The store extending out from the main stem or body of the letterform


 

Em/en

Originally referring to the width of an uppercase M, and em is now the distance equal to the size of the typeface; an en is half the size of an em


Finial

The rounded non-serif terminal to a stroke


Leg

Short stroke off the stem of the letterform (at the bottom: L; inclined downward: K, R)


Ligature

The character formed by the combination of two or more letterforms


Link

The stroke that connects the bowl and the loop of a lowercase g

Loop

The bowl created in the descender of the lowercase G (in some typefaces)


Serif

The right-angled or oblique foot at the end of the stroke


Shoulder

The curved stroke that is not part of a bowl


Spine

The curved stem of the S


Spur

The extension that articulated the junction of the curved and rectilinear stroke


Stem

 

The significant vertical or oblique stroke


Stress

The orientation of the letterform, indicated by the thin stroke in round forms


Swash

The flourish that extends the stroke of the letterform


Tail

The curved diagonal stroke at the finish of certain letterforms


Terminal

The self-contained finish of a store without a serif, it may be flat, flared, acute, grave, concave, convex or rounded as a ball or a teardrop (see finial)


 2. The font

  • Uppercase (Capital letters)
  • Lowercase
  • Small Capitals 
    • Uppercase letterforms draw to the x-height of the typeface 
    • usually use on acronyms
    • If the type family don't have small caps, don't force it to be small caps
Fig 5.1 Small Capitals 

  • Uppercase Numerals (lining figures)
    • Same height as uppercase letters and are all set to the same kerning width
    • They are most used with tabular material and uppercase letters.
  • Lowercase Numerals (old style figures or text figures)
    • Set to x-height with ascenders and descenders
    • InDesign>type>glyphs
Fig 5.2 Uppercase Numerals and Lowercase Numerals
  • Italic
    • Italics refer back to 15th-century Italian cursive handwriting. 
    • Oblique is typically based on the Roman form of the typeface.
  • Punctuation, miscellaneous characters
    • Can change from typeface to typeface.
    • It is important to ensure that all the characters are available in a typeface before choosing the appropriate type for a particular job.
Fig 5.3 Punctuation, miscellaneous characters
  • Ornaments
    • Used as flourishes in invitations and certificates
    • Only a few traditional or classical typefaces contain ornamental fonts, eg. Adobe Calson Pro
3. Describing typefaces
  • Roman
    • The uppercase forms are derived from inscriptions of Roman monuments.
    • Book
      • A slightly lighter stroke in roman
    • eg.

  • Italic
    • Based on the fifteenth-century Italian handwriting 
    • Oblique
      • Based on a roman form of a typeface
    • eg.
  • Boldface
    • Thicker stroke than a roman form 
    • Also be called: Semibold, Medium, Poster, Black
    • eg.

  • Light
    • Lighter stroke than the roman form
    • Thin:
      • Even lighter strokes
    • eg.

  • Condense
    • A condensed version of the roman form
    • Compressed:
      • Extremely condensed styles
        eg.
  • Extended
    • Extended variation of a roman form
    • eg.

4. Comparing typefaces
The 10 typefaces below that we are going to use throughout this module represent 500 years of type design. Each typeface gives different feelings, it is important for us to understand these typefaces well and choose the right typeface for conveying messages in a particular work.
Fig 5.4 10 typefaces


Typo_5_Understanding

1. Understanding letterforms
The uppercase letterforms below suggest symmetry, but in fact, it is not symmetrical. The asymmetrical letterforms below are both internally harmonious and individually expressive.

Baskerville stroke form: two different stroke weights can be easily seen
Univers stroke form: a close examination shows that the width of the left slope is thinner than the right stroke
Fig 6.1 left-Baskerville; right - Univers 

The complexity of each individual letterform is neatly demonstrated by examining the lowercase ‘a’ of two seemingly similar sans-serif typefaces—Helvetica and Univers. A comparison of how the stems of the letterforms finish and how the bowls meet the stems quickly reveals the palpable difference in character between the two.

Fig 6.2 left: Helvetica 'a'; right: Univers 'a'


2. Maintaining x-height
X-height generally describes the size of the lowercase letterforms. Curved strokes, such as in ‘s’, must rise above the median (or sink below the baseline) in order to appear to be the same size as the vertical and horizontal strokes they adjoin.

Fig 6.3 Lowercase maintaining x-height

3. Form and Counterform (Counter)
The space describes, and often contained, by the strokes of the form. When letters are joined to form words, the counterform includes the spaces between them. Counterform has the same importance as the letterforms as it helps to recognize the shape of the letters and assure the readability of the words. 
Fig 6.4 Form and counterform

We could examine the counterform of letters by enlarging each letter and analysing them. It could give us a glimpse into the process of letter-making.
Fig 6.5 Enlarging letters



4. Contrast
The design principle of Contrast is also applied in typography. The simple contrasts produce numerous variations: small+organic / large+machines; small+dark / large+light, etc.

Fig 6.6 Contrast in typography




INSTRUCTIONS




Task 1: Exercises - Type Expression

1. Sketches

We are required to choose and sketch a minimum of 4 word expressions consisting of 3 ideas each from the 7 words of voting, which are speed, shatter, melt, blur, dance, throw, and kill.

At first, I do some research on others work on Pinterest:
Fig 7.1 Visual research on type expression

Source of inspiration for each word:

Speed
Fig 7.2 Inspiration of the word 'speed'

Blur
Fig 7.3 Inspiration of the word 'blur'
Throw

Fig 7.4 Inspiration of the word 'throw'
Kill


Fig 7.5 Inspiration of the word 'kill'


Sketches for each word:


Fig. 7.6 Type expression sketches (8/4/2023)



I choose speed, blur, throw and kill these 4 words to express it. I used pencil to sketch my ideas on paper.


2. Digitisation

This week, we are required to digitise the final 4 word expression using the TypeExp.ai file Mr Vinod provided to place your final work on.
Fig. 8.1 Digitalized Type Expression (16/4/2023)

  • The process of digitalizing "speed"
Fig. 8.2 Choosing typefaces for the word "speed"

For the word "speed", I choose design #1 which can clearly express the meaning of speed. Speed can be slow or fast, so I let "s" be the slowest and "peed" are fast until bumped together. 
Then I came to choose typefaces for this word. The Futura Std and Gill Sans Std are the most similar to my sketches without serifs. I ended up choosing Gill Sans Std because I like the design of Gill Sans Std's bowl better.
  • The process of digitalizing "blur"

Fig. 8.3 Adding Gaussian Blur effect to small characters


I first came out with the left design which is a normal eye chart style. Then I think that adding the Gaussian blur effect to the bottom three-row which the characters are smaller, will be better because it looks like someone with short-sightedness seeing this eye chart.    
  • The process of digitalizing "throw"
Fig. 8.4 First attempt at digitalizing "throw" (16/4/2023)

After week 3 in-class feedback, I realize that my design for throw does not sit well on the artboard. 
Mr. Vinod suggests I utilize the artboard more, not just put the design in the center of the artboard. 

Fig. 8.5 Adjusted design of "throw" after feedback (16/4/2023)

I adjusted the design to let "thr w" sit on the bottom left of the artboard and throw the ball(o) higher and add a little squash to the ball. 

  • The process of digitalizing "kill"
Fig. 8.6 Kill word concept (16/4/2023)


I cut a little bit of the circle of i to let the one who was killed lay down fit the ground better. For the typeface, I used Gill Sans Std Bold to let this design more minimalist. 



Final Type Expression
Fig. 8.7 Final Type Expression (24/4/2023)



Fig. 8.8 Final Type Expression (24/4/2023)


3. Type Expression Animation

We need to choose one of the four final digitized type expressions to animate it.

I choose the "throw" word to animate it. First, I start drawing a sketch for the ball track.
Fig. 9.1 Sketch of Animation (24/4/2023)

The ball should be slower when reaches the top, so I add more frames to adjust it. And when the ball hits the ground also need to add some squash. Then I digitalize it in Adobe Illustrator.

 
Fig. 9.2 Guideline for the path of ball throwing and rebounce (24/4/2023)

Fig. 9.3 First attempt of 19 frames in total (24/4/2023)

Fig. 9.4 Hide the guideline and be ready to export (24/4/2023)

I came out with my first attempt at the "throw" word. 

Fig. 9.5 First try to export gif

From this first version, I realize that the ball is not bouncy enough, and the pause for the beginning and end are missing. 

Fig. 9.6 Add squash to the ball to express speed (24/4/2023)

Fig. 9.7 Add anticipation to optimize the starting movement (24/4/2023)

Fig.9.8 Animation for the word "throw"-GIF, Week 4 (25/4/2023)

For this second version of the animation, I got feedback from Mr. Vinod. He said the stretch at the beginning is not necessary because it will let the ball become bounce up not throw up. 

Fig. 9.9 Edited Animation for the word "throw" after Mr. Vinod Feedback-GIF, Week 4 (30/4/2023)

So I edited the beginning of this animation to remove the bouncy feeling with deleted 2 frames that squash the "o" flat. 

Final Type Expression Animation

Fig 9.10, Final Animated Type Expression, (30/4/2023)



Task 2: Formatting Text

Kerning and Tracking
I used my name as this practice of using 10 typefaces to kern and track.
Fig 10.1 Without kerning and tracking (1/5/2023)

Fig 10.2 With kerning and tracking(1/5/2023)

Layouts

I also start with resarch on layout from pinterest before I start
Fig 10.3 Visual research on layout


Then, following the tutorials and text provided by Mr Vinod, I started working on InDesign.

This is my first attempt at the layout:

Fig 10.4 First attempt

After Week 5 feedback from Mr Vinod, I realize that my layout has many problems. The alignment of image and text not aligned neatly and the cross alignment between two column also not aligned.
Fig. 10.5 Problems of my works on layout


So, I fixed those problems, and I also change the photo that I choose because I think it is a little too dark. Then I came out with my second design:

Fig 10.6 Second attempt

I tried different designs too, with one column on the right.

Fig 10.7 Third attempt


Fig 10.8 Process

Fig 10.9 All the layouts I explored

Throughout all the designs, I choose the second one as my final result because I think it is simple and neat, the balance is also even, headline and body text are clearly readable.
 
FINAL Text Formatting Layout

HEAD
Font/s: Univers LT Std 75 Black
Type Size/s: 40 pt
Leading: 44 pt
Paragraph spacing: 0

BODY
Font/s: Univers LT Std 45 Light
Type Size/s: 9 pt
Leading: 11 pt
Paragraph spacing: 11 pt
Characters per-line: 57
Alignment: left justified

Margins: 120 mm top, 100 mm bottom, 50 mm left & right
Columns: 2
Gutter: 12 mm

Fig 9.5, Final Text Formatting Layout, (8/5/2023)



Fig 9.6, Final Text Formatting Layout (PDF), (8/5/2023)


Fig 9.7, Final Text Formatting Layout - Grids, (8/5/2023)


Fig 9.8, Final Text Formatting Layout - Grids (PDF),  (8/5/2023)




FEEDBACK

Week 2
Specific Feedback 
Mr Vinod said he liked design #1 of the word Blur. He also likes designs #1 and #3 of the word Kill. Design #1 of Kill is simple and he suggested that the "i" can try designed it hanging or leaning in a different direction like frontward. Moreover, the first design of the word speed is also well used in contrast.

General Feedback
Clear sketch

Week 3
Specific Feedback
All the words' expressions match the meaning of the words. The "throw" word can try to put it lower and the o put higher to make the design more impactful.
General Feedback
The space in the artboard can be better utilized.

Week 4
Specific Feedback
The animation is excellent, but the stretch of the beginning is not necessary because it makes the ball looks like bouncing off, not throwing. 
General Feedback
Pause is important to emphasize the beginning and the end of the animation in the loop.

Week 5
Specific Feedback
All text is bold effect the readability of the text, and my cross-alignment of text didn't align well. 
General Feedback
Mr Vinod recommends us the size of the font should not be smaller than 8 and before we track, should adjust the default tracking to 0. When using justified and text number is less, use hyphenation to solve unevenness. 

REFLECTIONS


Experience
Overall, I found Task 1 exercises to be quite interesting. I enjoyed the process of brainstorming to create unique designs, and the feeling of satisfaction upon completing them was immense. Receiving positive feedback from Mr. Vinod further added to my sense of accomplishment. However, during the weekly classes, I often experienced anxiety as I was uncertain about the correctness of my work. Fortunately, each time I met with Mr. Vinod, my worries were alleviated. He skillfully guided and supported me by identifying my weaknesses. Moreover, when he provided feedback on other people's work, it served as a great source of inspiration for me. I was able to learn from their mistakes and further enhance my own skills.

Observation
I observe that typefaces are important in our life that I didn't notice before I take this module. Typefaces bring a big impact on visual communication. I notice that I learn better when I actively take notes during class, it allows me to better absorb and internalize the information being presented. In addition, I have observed that I struggle with effectively layouting large amounts of body text.  I find it challenging to organize the text in a visually appealing and reader-friendly manner.

Findings
I found that I took a long time to complete every week's assignments. I must manage my time well to avoid last-minute work to get better results. Furthermore, I recognized the importance of diligently documenting my progress to maintain a comprehensive record of my design process and avoid potential point deductions. 


FURTHER READING

Fig ? TYPE MATTERS! by Jim Williams

This book provided many simple tips for everyday typography, which I find useful to me.


Selecting a typeface is important in business appearance. This book shows a sample of financial advisers and children's entertainers who need to choose what typeface to let customers trust them by only seeing their company name card.



When comes to displaying large-size typefaces, we need to be careful because the letter i and j dots may be too high when directly type out. 


I found these ink traps interesting because when considering printing out text, we need to consider adding ink traps when printing small letters to allow ink to bleed into the paper to keep a clean edge for small text sizes.


Mastering TYPE by Denise Bosler

This book talk about typography for print and web design

I read the chapter 3, 4 and 5 of the book that talks about word, sentence and paragraph—I figure it will help me in one way or another, since I’m doing text formatting layout.

Fig 14 is a poor kerning examples and Fig 15 has a good kerning. Fig 17 shows a light font type needs a tighter tracking and bold font type needs alooser tracking.

We should kern text become like Fig 8


Large text requires finessing punctuation so that it looks natural and unobutrusive. The punctation does not need to be dramatically smaller, a reduction of few points will do. The kerning between the last letter and the punctuation mark may also need to be adjusted.




Comments