Typography / Task 1: Exercise

August 26, 2021

Typography / Task 1: Exercise

27/08/2021 - 24/09/2021 (Week 1 - Week 5)

Alicia Teng Yi Ling (0345159) BDCM

Typography

Task 1 / Exercise

LECTURES

Week 01 - 27/08/2021

For the first lesson, we started off with a quick introduction to our lecturer Mr Vinod, with Dr. Charles assisting him. Then, he introduced us to the platforms we will be using for communication and showing work, mainly the typography Facebook group page and a google feedback sheet (a sample of how feedback should be documented on the sheet).

Each week, we must write and update our feedback from lecturers, after class and categorise them under general and specific feedback.

Then, we were given the links of previous student e-portfolios to gain an understanding on what is expected of ours and general information about what to include in our pages:

Weekly reflections
Design Process
Feedback
Final works
Each module works

Lecture 0 - Introduction to Typography

What is typography?

A fundamental aspect in any design studies discipline
Typography is the process and technique of organising and planning type to make written words readable and aesthetically pleasing when presented
The arrangement of type involves: selecting typefaces, point sizes, line lengths, line-spacing, and letter-spacing, and adjusting the space between pairs of letters.

Terminology

Font: refers to the individual font or weight within a typeface
Typeface: refers to the various families that do not share characteristics

Fig 1.1 Fonts (03/09/2021)

Fig 1.2 Variety of Typefaces (03/09/2021)

Lecture 1 - Development

Typography: Development/Timeline

Early Letterform Development: Phoenician to Roman

Initial writing comprised of scratching into wet clay with a sharp stick or carving into a stone with a chisel
Forms of uppercase letterforms are seen to have evolved out of these tools & materials
Fundamentally, uppercase forms are combinations of straight lines and pieces of circles

Fig 2.1.1 Depicts a four-line inscription to Tanit and Baal Hammon - 4th Century B.C.E (03/09/2021)

Fig 2.1.2 Evolution from Phoenician Letter (03/09/2021)

The Greeks changed the direction of writing
Phoenicians wrote from right to left
As the direction of reading was changed, so was the orientation of letterforms

Fig 2.1.3 Change in Direction of Writing (03/09/2021)

Etruscan (& then Roman) carvers painted the letterforms before carving them
Certain parts of their strokes carried over into the inscribed letterforms

Fig 2.1.4 Early Letterform Development: Phoenician to Roman (03/09/2021)

Hand Script from 3rd to 10th Century C.E.

Square capitals - written version found in Roman monuments
Letterforms have serifs added to the finish of the main strokes
Variety of the width of strokes were achieved by a reed pen held at an approximate angle of 60° off the perpendicular

Fig 2.1.5 4th or 5th Century: Square Capitals (03/09/2021)

Rustic capitals are a compressed version of square capitals
This allowed for twice as many words on a sheet of parchment & took less time to write
The pen/brush was held at an approximate angle of 30° off of the perpendicular
Although faster and easier to write, they were harder to read due to their compressed nature

Fig 2.1.6 Late 3rd - 4th Century: Rustic Capitals (03/09/2021)

Typically, both square and rustic capitals were reserved for documents of some intended performance
Everyday transactions were typically written in cursive hand (forms were simplified for speed)
The beginning of what we call lowercase letterforms

Fig 2.1.7 4th Century - Roman Cursive (03/09/2021)

Uncials incorporated some aspects of Roman cursive hand

Especially in the shape of 'A, D, E, H, M, U & Q'

Uncials are small letters
The broad form of uncials are more readable at small sizes than rustic capitals

Fig 2.1.8 4th - 5th Century - Uncials (03/09/2021)

Further formalization of the cursive hand - half-uncials - mark the formal beginning of lowercase letterforms
Replete with ascenders and desceners, 2000 years after the origin of the Phoenician alphabet

Fig 2.1.9 C. 500 Half-Uncials (03/09/2021)

Charlemagne issued an edict in 789 to standardize all ecclesiastical texts
Monks rewrote the texts using both majuscules (uppercase), miniscule, capitalization and punctuation which set the standard for calligraphy for a century.

Fig 2.1.10 C. 295 Caloline Miniscule (03/09/2021)

Blackletter to Gutenberg's Type

The dissolution of Charlemagne’s empire created regional variations in Alcuin’s script
In northern Europe, a condense strongly vertical letterform know as Blackletter or textura gained popularity

Fig 2.1.11 C. 1300 Blackletter - Textura (03/09/2021)

Gutenberg created 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

Fig 2.1.12 C. 1455: 42 line bible, Johann Gutenberg, Mainz (03/09/2021)

Development Timeline

Humanist Script to Roman Type

c. 1460: Lucius Lactantius, Venice
1472: Cardinal Jonannes Bessarion, Conrad Sweynheym and Arnold Pannartz, Subiaco press, Rome
1471: Quintillian, Nicholas Jenson, Venice

Venetian Type from 1500

1499: Colona, type by Farncesco Griffo
1515: Lucretius, type by Francesco Grifo

The Golden Age of French Printing

1531: Illustrissimae Galliaru reginae Helianorae, printed by Robert Estianne, Paris. Type-cast by Claude Garamond

Dutch Printing, c. 1600

1572: Polygot Bible (Preface). Printed by Christophe Plantin, Antwerp

English Type from the 18th Century

1734: William Caslon. Type specimen sheet, London

Baskerville's Innovations

1761: William Congreve, typeset and printed by John Baskerville, Birmingham
1818: Giambatista Bodoni, Manuale Tipografico, Parma

Lecture 2 - Basics

Typography: Describing Letterforms

As with any craft that has evolved over 500 years, typography employs a number of technical terms. These mostly describe specific parts of the letterforms. It is a good idea to familiarize yourself with the lexicon.

Knowing a letterform’s component parts make it much easier to identify specific typefaces.

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

Fig 2.2.1 Baseline, Median & X-Height

Stroke: Any line that defines the basic letterform

Fig 2.2.2 Stroke

Apex / Vertex: The point created by joining two diagonal stems (apex above and vertex below)

Fig 2.2.3 Apex / Vertex

Arm: Short strokes off the stem of the letterform, either horizontal (E, F, L) or inclined upward (K, Y)

Fig 2.2.4 Arm

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

Fig 2.2.5 Ascender

Barb: The half-serif finish on some curved stroke.

Fig 2.2.6 Barb

Beak: The half-serif finish on some horizontal arms

Fig 2.2.7 Beak

Bowl: The rounded form that describes a counter. The bowl may be either open or closed

Fig 2.2.8 Bowl

Bracket: The transition between the serif and the stem

Fig 2.2.9 Bracket

Cross Bar: The horizontal stroke in a letterform that joins two stems together

Fig 2.2.10 Cross Bar

Cross Stroke: The horizontal stroke in a letterform that joins two stems together

Fig 2.2.11 Cross Stroke

Crotch: The interior space where two strokes meet

Fig 2.2.12 Crotch

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

Fig 2.2.13 Descender

Ear: The stroke extending out from the main stem or body of the letterform

Fig 2.2.14 Ear

Em/en: Originally refering to the width of an uppercase M, and em is now the distance equal to the size of the typeface (an em in 48 points, for example). An en is half the size of an em. Most often used to describe em/en spaces and em/en dashes

Fig 2.2.15 Em/en

Finial: The rounded non-serif terminal to a stroke.
Leg Short: stroke off the stem of the letterform, either at the bottom of the stroke (L) or 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: In some typefaces, the bowl created in the descender of the lowercase G.
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 the articulates 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 stroke without a serif. This is something of a catch-all term. Terminals may be flat (‘T’ above), flared, acute, (‘t’ above), grave, concave, convex, or rounded as a ball or a teardrop (see finial).

The full font of a typeface contains much more than 26 letters, to numerals, and a few punctuation marks.

To work successfully with type, you should make sure that you are working with a full font and you should know how to use it.

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

Fig 2.2.16 Uppercase Letters

Lowercase Lowercase letters include the same characters as uppercase.

Fig 2.2.17 Lowercase letters

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

Most type software includes a style command that generates a small cap based on uppercase forms. Do not confuse real small caps with those artificially generated

Fig 2.2.18 Small Capitals

Uppercase Numerals: Also called lining figures, these numerals are the same height as uppercase letters and are all set to the same kerning width. They are most successfully used with tabular material or in any situation that calls for uppercase letters

Fig 2.2.19 Uppercase Numerals

Lowercase Numerals: Also known as old style figures or text figures, these numerals are set to x-height with ascenders and descenders. They are best used when ever you would use upper and lowercase letterforms. Lowercase numerals are far less common in sans serif type-faces than in serif.

Fig 2.2.20 Lowercase Numerals

Italic: Most fonts today are produced with a matching italic. Small caps, however, are almost always only roman. The forms in a italic refer back to fifteenth century Italian cursive handwriting. Oblique are typically based on the roman form of the typeface.

Fig 2.2.21 Italics

Italic vs Roman

Fig 2.2.22 Italic versus Roman

Punctuation, miscellaneous characters Although all fonts contain standard punctuation marks, miscellaneous characters can change from typeface to typeface. It’s important to be acquainted with all the characters available in a typeface before you choose the appropriate type for a particular job

Fig 2.2.23 Punctuation

Ornaments Used as flourishes in invitations or certificates. They usually are provided as a font in a larger typeface family. Only a few traditional or classical typefaces contain ornamental fonts as part of the entire typeface family (Adobe Caslon Pro)

Fig 2.2.24 Ornaments

Describing Typefaces:

Once you can recognize the parts of a letterform, you can apply what you know to identify different type-faces. Keep in mind that some, all, or combinations of these styles may be found within one type family.
Roman: The letterform is so called because the uppercase forms are derived from inscriptions of Roman monuments. A slightly lighter stroke in roman is known as ‘Book’.
Italic: Named for fifteenth century Italian handwriting on which the forms are based. Oblique: conversely are based on roman form of typeface
Boldface: Characterized by a thicker stroke than a roman form. Depending upon the relative stroke widths within the typeface, it can also be called ‘semibold’, ‘medium’, ‘black’, ‘extra bold’, or super. In some typefaces (notably Bodoni), the boldest rendition of the typeface is referred to as ‘Poster’.
Light: A lighter stroke than the roman form. Even lighter strokes are called ‘thin’.
Condense: A version of the roman form, and extremely condense styles are often called ‘compressed’.
Extended: extended variation of a roman font.

Fig 2.2.25 Describing Typefaces

Lecture 3 - Text / Part 1

Typography: Text / Tracking: Kerning and Letterspacing

The term ‘kerning’ refers to the automatic adjustment of space between letters. It is often mistakenly referred to as ‘letterspacing. In fact, letterspacing means to add space between the letters. The addition and removal of space in a word or sentence is referred to as ‘tracking’.

Fig 2.3.1 Kerning

Letterspacing: Addition of space between the letters
Tracking: The addition & removal of space in a word / sentence. Has normal, loose & tight tracking

Fig 2.3.2 Tracking

Designers always letterspace uppercase letters, but there has long been strong resistance within the type community to letterspace lowercase letters within text.

Uppercase letterforms are drawn to be able to stand on their own, whereas lowercase letterforms require the counterform created between letters to maintain the line of reading.

Fig 2.3.3 Letterspacing

Text Formatting:

Flush left: This format most closely mirrors the asymmetrical experience of handwriting. Each line starts 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 transforms fields of text into shapes, thereby adding a pictorial quality to material that is non-pictorial by nature. Because centered type creates such a strong shape on the page, its important to amend line breaks so that the text does not appear too jagged.
Flush right: This format places emphasis on the end of a line as opposed to its start. It can be useful in situations (like captions) where the relationship between text and image might be ambiguous without a strong orientation to the right.
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. The resulting openness of lines can occasionally produce ‘rivers’ of white space running vertically through the text. Careful attention to line breaks and hyphenation is required to amend this problem whenever possible.
Designers tend to set type one way or another depending upon 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 calls attention to itself before the reader can get to the actual words is simply interference, and should be avoided. Quite simply if you see the type before you see the words, change the type.

Fig 2.3.4 Justified Type Formatting

Fig 2.3.5 Typeface to Avoid

Beyond learning about the unique characteristics of each typeface—and understanding its place in history, it is important to understand how different typefaces feel as text. Different typefaces suit different messages. A good typographer has to know which typeface best suits the message at hand.

Consider, too, the different textures of these typefaces. Type with a relatively generous x-height or relatively heavy stroke width produces a darker mass on the page than type with a relatively smaller x-height or lighter stroke. Sensitivity to these differences in colour is fundamental for creating successful layouts.

Fig 2.3.6 Texture

InDesign Notes:

Facing pages = Typically for books
Ctrl+Shift+Bigger than or Ctrl+Shift+Alt = Increases the size of word
Ctrl+ = Turn off margin & columns
Alt+< / Edit>Preferences = Kerning
Alt+> = Increase spacing

The goal in setting text type is to allow for easy, prolonged reading. At the same time a field of type should occupy the page as much as photograph does.

Type size: Text type should be large enough to be read easily at arms length—imagine yourself holding a book in your lap.
Leading: Text that is set too tightly encourages vertical eye movement; a reader can easily loose his or her place. Type that is set too loosely creates striped patterns that distract the reader from the material at hand.
Line Length: Appropriate leading for text is as much a function of the line length as it is a question of type size and leading. Shorter lines require less leading; longer lines more. A good rule of thumb is to keep line length between 55-65 characters. Extremely long or short lines lengths impairs reading.
A type specimen book shows samples of typefaces in various different sizes. Without printed pages showing samples of typefaces at different sizes, no one can make a reasonable choice of type. You only determine choice on screen when its final version is to read on screen.
A type specimen book (or eBook for screen) is to provide an accurate reference for type, type size, type leading, type line length etc.

Fig 2.3.7 Leading and Line Length II

Fig 2.3.8 Leading and Line Length I

Lecture 5 - Understanding

Typography: Understanding Letterforms

The uppercase letter forms below suggest symmetry, but in fact it is not symmetrical. It is easy to see the two different stroke weights of the Baskerville stroke form (below); more noteworthy is the fact that each bracket connecting the serif to the stem has a unique arc

Fig 2.4.1 Letter A Baskerville

The uppercase letter forms may appear symmetrical, but a close examination shows that the width of the left slope is thinner than the right stroke. Both Baskerville (previous) and Univers (below) demonstrate the meticulous care a type designer takes to create letterforms that are both internally harmonious and individually expressive

Fig 2.4.2 Letter A 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 2.4.3 Letter a: Helvetica & Univers

The x-height generally describe the size of the lowercase letterforms. However, you should keep in mind that 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 2.4.4 X-Height

Just as important as recognizing specific letterforms is developing a sensitivity to the counterform (or 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.

The latter is particularly and important concept when working with letterforms like lowercase ‘r’ that have no counters per se. How well you handle the counters when you set type determines how well words hang together—in other words, how easily we can read what’s been set.

Fig 2.4.5 Counterform

One of the most rewarding way to understand the form and counter of a letter is to examine them in close detail. The examinations also provide a good feel for how the balance between form and counter is achieved and a palpable sense of letterform’s unique characteristics. It also gives you a glimpse into the process of letter-making

Fig 2.4.6 Helvetica & Baskerville s & g

Its worth noting here that the sense of the ‘S’ holds at each stage of enlargement, while the ‘g’ tends to loose its identity, as individual elements are examined without the context of the entire letterform

The basic principles of Graphic Design apply directly to typography. The following are some examples of contrast—the most poweful dynamic in design—as applied to type, based on a format devised by Rudi Ruegg.

The simple contrasts produces numerous variations: small + organic /large + machined; small + dark/ large light

Fig 2.4.8 Contrast

INSTRUCTIONS

TASK 1: Exercise 1 Type Expression

1) Four Chosen Words:

Terror
Water
Moon
Space

2) My Sketches

Fig 3.1 Sketches of Three Chosen Words (31/08/2021)

3) Digitization of Words I

Fig 3.2 Practicing Digitization of my 'Terror' Ideas/Sketches (05/09/2021)

For 'Terror', I wanted to express a feeling of being slashed and falling apart or being pulled apart. I decided to segment pieces of each letter and place them apart to achieve this effect.

Fig 3.3 Practicing Digitization of my 'Water' Ideas/Sketches (05/09/2021)

For 'Water', I decided to go with some sort of wave effect so I tried a ripple or wave distortion to the word.

Fig 3.4 Practicing Digitization of my 'Moon' Ideas/Sketches (05/09/2021)

For 'Moon', I wanted to include the moon (in crescent or full form) and manipulate it to replace the second O letter as I felt that this would express this word well.

Fig 3.5 Practicing Digitization of my 'Space' Ideas/Sketches (05/09/2021)

For 'Space', I tested out a few concepts

Inverting black and white spaces
Hiding the sections in the letters to create 'space'
The actual space between the letters and orientation

4) Digitization of Words II

Fig 3.6 Final Digitizations of 'Terror' and 'Water' Ideas(06/09/2021)

Fig 3.7 Final Digitization of 'Moon' and 'Space' Ideas(06/09/2021)

5) Updated Words after feedback

Terror

Seems/looks very demure (Try to make it scarier or bolder)

Fig 3.8 Updated Terror Word (08/09/2021)

Water

It’s fine but there is no need for italics (change it to regular font)

Fig 3.9 Updated Water Word (08/09/2021)

Moon

For Idea #3, choose either the crescent or the ‘o’ (it will look better that way)
Ideas #1 and #2 are very nice, chose one of those instead

6) GIF Attempt

Fig 3.10 First GIF Attempt (09/09/2021)

I like the movement of Terror being slashed and pulled apart but during feedback, I was told that the blackout (inverted piece) at the end was perhaps unnecessary and to add a drop of blood instead.

Updated GIF Frame Animation after feedback

Fig 3.11 Second GIF Attempt

Fig 3.12 Second GIF Animation Frames

I prefer the second one as it looks more like the expression and meaning of the word 'Terror', the blood stain was a little tricky to make, as my drawing tablet broke at the last minute but I still like the way it turned out.

7) FINAL TYPE EXPRESSION

Fig 3.13 Final Submission: Type Expression (23/09/2021)

Fig 3.14 Final Submission: Type Expression PDF (23/09/2021)

Figure 3.15 Final Submission: Animated Type Expression, 23/09/2021

Exercise 02: Text Formatting

Progression

Fig 4.1 Kerning and Tracking (23/09/2021)

Fig 4.2 First Layout (23/09/2021)

Fig 4.3 Second Layout (23/09/2021)

Fig 4.4 Third Layout (23/09/2021)

Fig 4.5 Fourth Layout (23/09/2021)

Out of all the layouts, I prefer the fourth one as it looks clean, simple and easy to read which is my goal.

Fig 4.6 Cross-alignment Testing (23/09/2021)

Fig 4.7 Cross-alignment and hidden characters in layout 4 (23/09/2021)

Fig 4.8 Close up of Cross-alignment (23/09/2021)

Fig 4.9 Close of of cross-alignment and hidden characters (23/09/2021)

FINAL TASK 2 OUTCOME

Fig 4.10 Final Text Formatting Exercise (23/09/2021)

Fig 4.11 Final Text Formatting Exercise PDF(23/09/2021)

FEEDBACK

Week 02: Type Expression - 03/09/2021

General Feedback

The layout of this exercise is a square format so do the work in that size
Create ideas/sketches that are doable with the prerequisite typefaces provided.

Specific Feedback

Do more exploration of the words to meet the requirements
The second designs of my words are preferred however I prefer the first ones personally so I will try to alter the design to be more appealing
The clarity and simplicity of the designs bring the words at well
Attempt to digitize them by next week.

Week 03 - 10/09/2021

General Feedback

Do not use any colours
No excessive warping of typefaces
The four artworks should be centered well to make it look nicer for the audience to view (presentation has a heavy impact on first impressions of the work)

Specific Feedback

Write down the names of the typefaces used below the words (e.g., Futura light)
Terror:

Seems/looks very demure (Try to make it scarier or bolder)

Water:

It is fine but there is no need for italics (change it to regular font)

Moon:

For Idea #3, choose either the crescent or the ‘o’ (it will look better that way)
Ideas #1 and #2 are very nice, chose one of those instead

Space:

Good, no changes needed

Week 04 - 17/09/2021

General Feedback

Questions to reflect on while animating

Is animation suitable?"
"Does animation reflect/enhance meaning of word?"
"Does animation reflect form being expressed?"
"Does animation create a smile in mind?"
"How can it be improved?

Specific Feedback (For GIF)

Add a drop of blood (running down) after being slashed to give that feeling of terror more
Gradually darken into black for a scarier feeling

REFLECTION

Experience:

Type expression was very interesting for me as it forced me to analyse and think about the words and how to create expressive works that present their actual meanings. Additionally, I enjoyed learning how to make the GIF as it was new to me and I never understood how they were made but now I do. Formatting was one of my favourite parts as I like to keep the appearances of texts neat and normally I just use justify but now I know how to do it myself. Personally, although this topic was difficult for me to grasp, I tried my best to learn and complete the work as I want to specialise in UI/UX Design in the future and I understand the importance of typography in that field.

Observation

There is a lot more to typefaces and typography in general than I thought. As seen in my notes above, there are factors such as texture, line length, leading, kerning, uppercasing, lowercasing, and many more.
Each typeface has varying traits and characteristics whether it is subtle or different and these make each one suitable for different areas.

Findings

There are many 'rules' that must be followed in typography otherwise it is considered incorrect, which I learnt recently. There are also elements such as hierarchy in headings, subheadings and text as well as ragging. All of these things are new to me so I consider them findings.

Fig 5.1.1 Cover of the Book: I.D.E.A.S Computer Typography Basics

I decided to start reading up on font styles and families as this is particularly interesting to me.

Font Styles:
Many display, script & text fonts only come in the "plain" version, even if they appear bold or italic after the style has been applied
Newer programs, such as: InDesign, Illustrator and Photoshop, only allow the styles that are currently installed in the computer. Therefore, if a bold version of a font is not currently installed (whether it exists or not), it will not be available for use as a font style selection.

Fig 5.1.2 Font Styles

Font Families:
The term "font families" refers to the fonts of the same design, but with a difference in weight from one font to another. As previously stated, many fonts only come in one weight - plain. However, many body-copy fonts are available in:
Plain (or Roman)
Italic (Normally a Serif font) or oblique (Usually a Sans Serif Font)
Bold
Bold Italic or Bold Oblique
A number of these fonts have additional weights to provide the user an even greater choice
Popular fonts may even have matching condensed and extended versions as well
Weights from the lightest to heaviest-
Extra Light, Ultra Light or Extra Thin
Thin or Light
Roman or Book
Medium or Regular
Demi-Bold or Semi-Bold
Bold
Heavy, Extra Bold, Black, or Super Bold

Fig 5.1.3 Examples of Font Families

Text Scaling:
Many programs allow the user to create a pseudo-condensed or pseudo-extended font by horizontally squeezing or stretching a font. This distorts the original design of the font. If possible, the user should select the true condensed or extended font or alter the design so it does not require the fake font.

Fig 5.1.4 Examples of condensed, horizontally expanded fonts and scaled fonts
Fonts can also be vertically stretched. The only good thing about this method, is that rather than resizing the type, it would be to keep the type technically the same size

Fig 5.1.5 Example of vertically scaled type

Outline and Shadow:
Perhaps the most abused styles in older desktop publishing programs are Outline and Shadow - they are overused to the point of being cliched - avoid them if possible. Newer programs do not offer the traditional outline or shadow settings at all, but instead have more advanced settings.

Fig 5.1.6 Examples of advanced Outline and Shadow Formatting from InDesign

Paragraph Indents:

The most common indent is the small indent at the beginning of each paragraph, but indents have many more uses, including adding an element of design to the page.
First-line paragraphs should only be used if there is no paragraph spacing because the indents and the paragraph space exist to inform the reader when a paragraph stops and a new one beings. Using both the indent and paragraph space is excessive. The standard amount of indent is equal to the type size.
Paragraph indent settings also include indents for the entire left and right side of the paragraph(s). Indenting on a single side is mostly used for design effect.

Fig 5.1.7 Example of Paragraph Indents

My second further reading is "A Type Primer: Second Edition" by John Cane.

Fig 5.2.1 Cover of "A Type Primer: Second Edition"

I started off with reading about comparing typefaces as I find it interesting to see the subtle or distinct differences between them.

Comparing Typefaces:

The ten typefaces, Bembo, Garamond, Janson, Caslon, Baskerville, Bodoni, Serifa, Futura, Gill Sans, and Univers represent 500 years of type design. They were rendered with the intentions to make them easily readable and to have an appropriate expression of contemporary esthetics. These are the ten faces that beginning typographers should study well as they are basics.

Fig 5.2.2 Comparing Typefaces

Display Typefaces:

Type presented at 18 pt., and above, for headlines and call-outs, are referred to as display type.
Typefaces that were designed exclusively for use in display easily account for the majority of fonts produced today
The very characteristics that make display typefaces attractive at large scale - extreme compression or extension of form, unusually large or small counterforms, complex details, strong pictorial references - make them unsuitable at text sizes.
Display typefaces are meant to be 'seen' more than 'read'

Fig 5.2.3 Examples of Display Typefaces

Text Typeface Classification:

Certain models have endured well past the cultures that created them. Recognizing the need to identify the stages of type-form development, typographers have come up with a number of systems to classify the typefaces, of them confusing in their specificity

Fig 5.2.4 Text Typeface Classification

REFERENCES

Fig 1.1: https://blog.prototypr.io/what-you-can-do-with-different-font-weights-1b464caaf0d4

Fig 1.2: https://www.vippng.com/preview/hmJoxhx_free-microsoft-word-fonts-aesthetic-fonts-on-word/

Search This Blog

Alicia Teng Yi Ling (0345159)