Typography-Practical Tasks:Exercises

GCD62704-Exercise

20/04/2026 - 31/05/2026 | Week 1-Week 6

WANG ZIJIA /0393824

Typography/Bachelor of Design in Creative Media/Taylor's University

Table of Contents:

1.Lectures

2.Instruction

3.Exercise

4.Feedback

5.Reflections

1.Lectures

Week 1:

In this week ,we had a short introduction to the module and to typography - how we arrange and design text to share ideas . We will learn by doing tasks, getting feedback, and improving our work. We also looked at how letter shapes changed over about 500 years because of different tools and cultures, which helps designers make better choices. We were told the module tasks and deadlines: finish an e-portfolio by the start of week two using the video tutorials and face-to-face lecture, and we began our first task of designing 4 of the 6 chosen words.

From the lecture video by Mr.Vinod.I know that early writing involved scratching clay or carving stone,and these methods influenced uppercase letters for nearly 2000 years,with forms evolving from Phoenician to Roman Latin.

Then,the video explains how the Greeks transformed early writing systems.Unlike the Phoenicians,who wrote right-to-left,the Greeks first developed a style called "boustrophedon"---meaning "as the ox ploughs"---where text alternated between right-to-left and left-to right lines,even flipping the orientation of letters to match the reading direction.Later, they shifted to a consistent left-to-right direction,and also abandoned practices like using letter spaces or punctuation.

I think it is fascinating to see how writing direction wasn't always fixed and how something as fundamental as which way we read evolved over time.It also makes me wonder how much of modern typography is shaped by these small.historical shifts in cultures and conventions.

Then the video moves on to how Roman (and earlier Etruscan) marble carvers shaped the iconic Roman letterforms. Before carving into stone, they would paint the letters first. This painting process directly influenced key features of the strokes: a change in weight from vertical to horizontal, and the flaring, broadened terminals at the start and end of each stroke. These details are clearly visible in the surviving Augustan-era inscriptions from the Roman Forum.

I love how this connects the final look of Roman capitals to the actual process of making them. The thickened serifs and stroke contrast aren’t just stylistic choices—they come from how the carvers painted and then chiseled the stone. It makes me think about how even today, digital fonts still carry these echoes of ancient tools and materials.

Moving on to hand scripts from the 3rd–10th century C.E., the video introduces Square Capitals, the written version of the monumental Roman letterforms. These letters feature serifs on the strokes, and their distinct stroke contrast was created by holding a reed pen at roughly 60 degrees to the page. The surviving 4th/5th-century manuscripts show how these carved stone forms were adapted for writing with ink and pen.It’s really interesting to see how the same Roman capital style evolved from stone carving to reed-pen writing. The serifs and stroke contrast that began as stone-carving details were recreated by simply changing the pen angle, which shows how tools directly shape typographic forms. This also makes me realize how every font we use today carries the influence of these ancient writing tools.

Next, the video introduces Rustic Capitals, a compressed version of Square Capitals used from the late 3rd to mid-4th century. These condensed letterforms allowed scribes to fit twice as many words on a sheet of parchment and write much faster. The pen or brush was held at a steeper 30° angle to the page, which created the compact style. While more efficient, their compressed shapes made them slightly harder to read than Square Capitals.

 

Next,the video explains that both Square and Rustic Capitals were reserved for formal documents. Everyday transactions, however, used a simplified, fast cursive hand — Roman cursive — which is the direct origin of what we now call lowercase letterforms.

Uncials (4th–5th century), a script that blended features from Roman cursive, especially in letters like A, D, E, H, M, U, and Q. The name “uncia” (Latin for “one-twelfth”) may refer to the letter’s height (about one inch), though it’s more accurately described as early small letters. Their broad forms were more readable at small sizes than rustic capitals.

Half-uncials (c. 500 C.E.), a further formalization of cursive writing that marks the official beginning of lowercase letterforms. These scripts included distinct ascenders and descenders, a key feature of modern lowercase, appearing roughly 2000 years after the origin of the Phoenician alphabet.

Caroline Minuscule (c. 925 C.E.), developed under Charlemagne’s order to standardize religious texts in 789. Alcuin of York led the project, and monks rewrote texts using both majuscules (uppercase) and minuscules (lowercase), plus consistent capitalization and punctuation. This set the standard for European calligraphy for a century.

After the fall of Charlemagne’s empire, regional variations of Alcuin’s script emerged. In Northern Europe, the condensed, vertical Blackletter (or Textura) became popular. In the South, a rounder, more open style called “Rotunda” developed, while Italian humanistic scripts also derived from the original Caroline minuscule.

Gutenberg’s type (c. 1455), the first movable type in Europe. Johann Gutenberg combined skills in engineering, metalworking, and chemistry to create type that accurately mimicked the Blackletter script of northern European scribes. Each letterform required its own brass matrix (negative impression) in his type mold, which he used to print the famous 42-line Bible.

Then it introduces a type classification system based on Alexander Lawson’s work, noting that typeforms evolve in response to technology, commercial needs, and aesthetic trends. 

Blackletter (c. 1450), the earliest printing type, modeled directly after the handwritten book scripts of Northern Europe. Examples include Cloister Black and Goudy Text. 

Oldstyle typefaces (c. 1475). Based on the lowercase forms used by Italian humanist scholars (which themselves derived from 9th-century Caroline Minuscule) and uppercase letters from Roman ruins, these fonts evolved over 200 years as they spread from Italy to England, moving away from their calligraphic origins. Examples include Bembo, Caslon, Garamond, and Palatino. 

Italic typefaces (c. 1500), which were inspired by contemporary Italian handwriting. Early italics were condensed and tightly spaced, allowing more words per page. Though initially seen as a separate type class, they soon became standard companions to roman typefaces. Since the 16th century, nearly all text typefaces have included matching italic styles. 

Script typefaces (c. 1550), which originated as attempts to replicate engraved calligraphic forms. While not ideal for long text, they are widely used in shorter applications. Scripts range from formal and traditional to casual and contemporary, with examples including Kuenstler Script, Mistral, and Snell Roundhand. 

Transitional typefaces (c. 1750), a refinement of Oldstyle forms made possible by advances in casting and printing. These fonts exaggerated the contrast between thick and thin strokes, and lightened the brackets connecting serifs to stems. Examples include Baskerville, Bulmer, Century, and Times New Roman. 

Modern typefaces (c. 1775), a further refinement of Oldstyle letterforms. These fonts feature unbracketed serifs and extreme contrast between thick and thin strokes. English versions, like Bell, are also known as Scotch Romans and bear a closer resemblance to Transitional forms. Examples include Bell, Bodoni, Caledonia, Didot, and Walbaum. 

Square Serif / Slab Serif typefaces (c. 1825), which emerged to meet the demand for bold, eye-catching type in commercial advertising. Originally featuring heavily bracketed serifs with little stroke contrast, these fonts later evolved to drop the brackets entirely. Examples include Clarendon, Memphis, Rockwell, and Serifa. 

Sans Serif typefaces (c. 1900), which eliminated serifs entirely. Though first introduced by William Caslon IV in 1816, they became widespread in the early 20th century. They vary from humanist forms (like Gill Sans) to rigidly geometric ones (like Futura), and are sometimes called “grotesque” or “gothic.” Examples include Akzidenz Grotesk, Helvetica, Optima, and Univers. 

Serif/Sans Serif hybrid typefaces (c. 1990), a modern development that expands the concept of a “type family” to include both serif and sans-serif variants, often with intermediate styles in between. Examples include Rotis, Scala, and Stone.

                        Blackletter (c. 1450)                        Oldstyle typefaces (c. 1475)          Italic typefaces (c. 1500)

                                  Script typefaces (c. 1550)       Transitional typefaces (c. 1750)      Modern typefaces (c. 1775)

Square Serif/Slab Serif typefaces (c. 1825)       Sans Serif typefaces (c. 1900)          Serif/Sans Serif hybrid typefaces (c. 1990)

Week 2:

In this week,we completed all 80 sketches,and received the feedback about the 80 sketches.From the feedback,I knew the disadvantages of my own works and improved them on this week.

Kerning : The individual,automatic adjustment of space between specific pairs of letters (e.g. the awkward gap between Y and e, or i and f).

Letterspacing : The uniform addition of space between all letters in a word or text.

Tracking : The overall process of adjusting letter spacing (adding or removing space ) across an entire word,line or paragraph.

The visual comparison (Ye and ift with or without kerning) makes it clear: kerning fixes the "holes" between certain characters, making text look intentional and polished.

Three core tracking styles,using the word "step" set in the font Univers 55:

Normal Tracking:

The default spacing between letters, as the font designer intended. The letters are neither too close nor too far apart, ensuring readability.

Tight Tracking:

Letters are moved closer together. This gives the text a compact, condensed look. It’s often used for headlines or logos to save space and create a bold, cohesive feel.

Loose Tracking:

Extra space is added between letters. This gives the text an open, airy, and elegant appearance. It’s commonly used for all-caps headlines or short titles to add sophistication.

The visual comparison makes it clear how adjusting tracking can completely change the mood and function of text.

The slide explains a key typographic rule: Uppercase letters are designed to be letterspaced (tracked) when used in titles or headings. They are drawn to stand independently, so adding space between them improves readability and elegance.

Lowercase letters are generally not letterspaced in body text. They rely on the "counterform" (the negative space between letters) to maintain a smooth reading rhythm. Spacing them out breaks this flow and makes the text harder to read.

Typography Notes: Text Formatting and Texture Text Alignment Styles The video introduces four primary text alignment styles, each with distinct characteristics and use cases: Flush Left / Ragged Right 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. Best for: Most body text in books and articles, as it offers the most natural reading flow.

Centered This format imposes symmetry upon the text, assigning equal value and weight to both ends of a 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, it is important to amend line breaks so that the text does not appear too jagged. Best for: Headings, invitations, poetry, or short passages that require a formal or elegant tone.

Flush Right / Ragged Left 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. Best for: Image captions, pull quotes, or layouts where a right-aligned visual anchor is needed.

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. Best for: Newspapers, magazines, and books where a neat rectangular text block is required.

Core Typographic Principle: Type Serves the Message

The video emphasizes a fundamental rule:

"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."

A typographer’s first job is to present the author’s message clearly and appropriately, not to let the typeface itself become a distraction.

Understanding Text Texture

Beyond the historical background and unique traits of each typeface, it is important to understand how different typefaces feel as text. Different typefaces suit different messages. A good typographer must know which typeface best suits the message at hand.

Also consider the different textures of these typefaces:

Type with a relatively generous x-height or heavy stroke width produces a darker mass on the page.

Type with a smaller x-height or lighter stroke appears lighter.

Sensitivity to these differences in visual weight and "color" is fundamental for creating

successful layouts.

Leading and Line Length

The primary goal of setting text is to create conditions for easy, prolonged reading, while ensuring the text block occupies the page effectively.

Type Size

Body text must be large enough to read comfortably at arm’s length. A good benchmark is the experience of reading a book held in your lap — the text should feel clear without straining your eyes.

Leading (Line Spacing)

Too tight: Causes the reader’s eye to move vertically, making it easy to lose one’s place.

Too loose: Creates distracting horizontal “stripes” of text and space, pulling attention away from the content.

Line Length

Appropriate leading depends as much on line length as on type size:

Shorter lines require less leading.

Longer lines require more leading.

The recommended rule of thumb is to keep line length between 55–65 characters. Both excessively long and short lines hurt readability.

Type Specimen Books and Final Checks

Type Specimen Books

A type specimen book shows examples of typefaces in various sizes.

Without printed pages showing samples at different sizes, it’s impossible to make a reasonable choice of type. Even on screen, you can only judge a font accurately if the final output is also on screen.

The purpose of a type specimen book (or its digital equivalent) is to provide a reliable reference for:

Font choice

Type size

Leading

Line length

Compositional Requirement: Gray Value

Text should form a smooth, even “field” that occupies the page or screen.

The ideal text block has a consistent middle gray value, not a distracting series of alternating light and dark stripes. This means spacing, leading, and word breaks must be balanced.

Practical Tips for Finalizing Your Layout

Zoom in to check leading: Magnifying the text to 400% helps you see how descenders from one line interact with ascenders on the next.

Even small changes matter: A single point difference in leading can change the feel of the text dramatically — a difference often invisible at 100% on most monitors.

Nothing replaces a printout: Unless your design is for digital only, a printed proof is the only way to judge how your type will truly look and read.

Week 3:

Indicating Paragraphs

There are several ways to visually indicate the start of a new paragraph.

Pilcrow (¶)

The symbol shown here is a holdover from medieval manuscripts. It was once used to mark paragraph breaks, but it is rarely used in modern typography today. The example in the slide shows how the pilcrow was inserted inline to signal a new paragraph without indenting.

Paragraph Spacing and Alignment When using line space (leading) to indicate paragraphs, the paragraph space (the gap between paragraphs) should match the line space. For example: If the line space (leading) is 12pt, the paragraph space is also set to 12pt. This rule ensures cross-alignment across columns of text, so the vertical rhythm stays consistent even when text flows into multiple columns.

Leading vs. Line Spacing

It uses a “sandwich analogy” to clarify the difference between these two terms:

Leading: Like the “jelly” between two slices of bread. It is the space between lines of text.

Originated from traditional letterpress, where strips of lead were inserted between lines.

Line spacing: Equal to one layer of jelly plus one slice of bread.

It is the total distance from the baseline of one line to the baseline of the next.

The formula:

Line spacing = type size + leading

Example from the slide:

If you have 48 pt text with 12 pt leading:

Line spacing = 48 + 12 = 60 pt

A key note: Most design software incorrectly uses the word “leading” to refer to what is actually “line spacing.” Always check the value in your software carefully.

Standard Paragraph Indentation

It shows the most common method of indicating paragraphs: indentation.

The rule of thumb is:

The indent size should match either the line spacing (leading) or the point size of the text.

This creates a subtle but clear visual break between paragraphs without disrupting the text flow.

Extended Paragraph Formatting

It shows a layout with unusually wide text columns, where paragraphs are indicated only by line breaks with no indentation or extra spacing.

While this format can hurt readability, it may be chosen for strong compositional or functional reasons:

To fill a specific design space or maintain a certain visual rhythm.

To create a minimalist, modern look with no visible paragraph markers.

When using this method, extra care must be taken to ensure the reader can still follow the text flow.

Widows and Orphans

In professional typography, widows and orphans are considered serious errors that must be avoided. They disrupt the visual flow of text and look unpolished.

Widow: A short, single line of text left alone at the end of a column.

Orphan: A short, single line of text left alone at the start of a new column.

Designers working with large amounts of text (in books, magazines, newspapers, or websites) must carefully adjust line breaks to eliminate these.

The rules for widows and orphans vary slightly depending on the text alignment:

In justified text, both widows and orphans are considered serious errors.

In flush right/ragged left text, widows are slightly more forgivable, but orphans remain unacceptable.

How to fix them:

Widows: Adjust line breaks throughout the paragraph so the last line is not noticeably short.

Orphans: Careful typographers ensure no new column starts with the last line of the previous paragraph.

Highlighting Text & Matching Font Sizes

It demonstrates how to balance different typefaces in a layout by matching their x-height (the height of lowercase letters like "x").

The example compares Univers (sans-serif) and Times (serif):

8-point Univers is visually too large next to 8-point Times, because its x-height is bigger.

To make them appear the same size, the Univers is reduced to 7.5pt, so its x-height matches the 8-point Times.

This is a key technique for highlighting or mixing fonts: adjusting the point size isn’t enough — you must match their visual weight and x-height for a cohesive look.

Highlighting Text with Quotation Marks

The video shows how quotation marks can visually set text apart, just like bullets:

They create a clear indent, breaking the left reading axis. The example compares an indented quote (with quotation marks) to an extended quote without them.

It also clarifies a common confusion: the prime symbol (′) is not a quotation mark. Originally used for units like inches and feet, it was often substituted for quotation marks on old typewriters. True quotation marks are the curled “smart quotes” we use today.

Headlines Within Text

This slide introduces the concept of visual hierarchy in text:

Within a chapter, text is often divided into multiple levels of headings (labeled A, B, C in the lecture) based on their importance.

A typographer’s task is to make these headings clearly communicate their relative importance to the reader, and define the relationship between different levels.

This ensures the reader can easily follow the structure of the text.

Level A headings (the highest level within a section) are used to mark clear breaks between topics.

Common formatting options for these headlines include:

Set larger than the body text

In bold

In small caps

"Extended" or pulled to the left, breaking the text column

All these styles make the headline stand out and clearly signal a new section to the reader.

Level B headings, which are subordinate to Level A headings.

Purpose: They introduce supporting arguments, examples, or subtopics for the main topic established by the A head.

Visual weight: They should be less prominent than A headings, so they don’t disrupt the text flow as strongly.

Common styles: The slide shows them in small caps, italic, bold serif, and bold sans-serif. All these styles make them stand out slightly, while still clearly indicating their lower level in the hierarchy.

Level C  headings, the lowest tier in the text hierarchy.

Purpose: They highlight specific details or subpoints within a B-heading section, without interrupting the flow of reading.

Visual style: Like B headings, they are shown in small caps, italics, serif bold, and sans-serif bold. They are followed by at least an em space for clear visual separation from the text.

Usage note: They are less common than A and B headings, used only for highly detailed subdivisions.

A sequence of subheads (A, B, C levels) working together creates a clear visual hierarchy in a text.

There is no single “correct” way to express hierarchy — the possibilities are virtually limitless.

The examples show different arrangements of bold, small caps, and italic headings, all of which clearly communicate the relative importance of each section.

Cross Alignment

Cross alignment is a technique that aligns headlines, captions, and other text elements with the main body text’s leading rhythm. It reinforces the page’s structure and creates a cohesive vertical rhythm.

How it works

Example 1: Four lines of caption text (set at 9pt with leading) are cross-aligned with three lines of body text (set at 13.5pt with leading).

Example 2: One line of headline text aligns with two lines of body text. Another case shows four lines of headline text aligning with five lines of body text.

This method ensures that different text elements on the page “talk to each other” visually, even when they are different sizes.

Week 4:

Letterform Terminology

Baseline The imaginary line forming the visual base of letterforms.

Median The imaginary line defining the x-height of letterforms.

X-height The height of the lowercase "x" in any typeface.

Ascender height The portion of a lowercase letter's stem that projects above the median (e.g., in b, d, h).

Descender height The portion of a lowercase letter's stem that projects below the baseline (e.g., in g, p, q).

Stroke Any line that defines the basic shape of a letterform.

Apex / Vertex

The point created by joining two diagonal stems (apex at the top, vertex at the bottom).

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

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

Barb The half-serif finish on some curved strokes.

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

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.

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

Em / En Originally referring to the width of an uppercase M. An em is now the distance equal to the size of the typeface. An en is half the size of an em. Most often used to describe em/en spaces and em/en dashes.

Ligature The character formed by the combination of two or more letterforms.

Serif

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

Link

The stroke that connects the bowl and the loop of a lowercase G.

Spine

The curved stem of the S.

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

Swash The flourish that extends the stroke of the letterform.

Terminal The self-contained finish of a stroke without a serif. This is something of a catch-all term. Terminals may be flat, flared, acute, grave, concave, convex, or rounded as a ball or a teardrop.

Font Components & Variants

Full Font

A complete typeface includes far more than just the basic 26 letters, numerals, and a few punctuation marks. Professional use requires working with a full font family and understanding its complete character set.

Uppercase Capital letters, including accented vowels, cedillas (ç), tildes (ñ), and ligatures like æ and œ.

Lowercase The lowercase letter set, which mirrors the character range of the uppercase version.

Small Capitals Uppercase letterforms scaled to the x-height of the typeface. These are a part of "expert sets" in many serif fonts. Note: Real small caps are not the same as those generated by software, which are often artificially shrunk uppercase letters.

Uppercase Numerals (Lining Figures) Numerals with the same height as uppercase letters, with uniform kerning widths. Ideal for tabular data or formal text alongside uppercase letters.

Lowercase Numerals (Old-Style / Text Figures) Numerals set to the x-height, with some featuring ascenders and descenders. Designed to blend with mixed-case text. They are more common in serif than sans-serif typefaces. Italic A style derived from 15th-century Italian cursive handwriting. Most fonts include a matching italic version. Note: Small caps are rarely produced in italic. The related "Oblique" style is simply a slanted version of the roman form.

Italic vs. Roman A comparison showing the structural difference: the italic a typically has a single-story form, while the roman a is two-story.

Punctuation & Miscellaneous Characters Standard punctuation marks, plus special characters that vary by typeface (e.g., currency symbols, fractions, arrows, etc.). Knowing these is essential for selecting the right font for a job.

Ornaments Decorative flourishes used in formal documents like invitations or certificates. These are often part of larger font families (e.g., Adobe Caslon Pro).

Typeface Classification & Comparison

Core Typeface Styles

Roman: Derived from ancient Roman monument inscriptions. The standard upright form; a slightly lighter variant is called "Book".

Italic: Based on 15th-century Italian cursive handwriting, with distinct letterforms.

Oblique: A mechanically slanted version of the Roman form (not a true italic).

Weight Variations

Boldface: Characterized by thicker strokes than the Roman form. Variations include Semibold, Medium, Black, and Extra Bold. In some typefaces (e.g., Bodoni), the heaviest weight is called "Poster".

Light: Features thinner strokes than the Roman form; the lightest variants are called "Thin".

Width Variations

Condense: A narrower version of the Roman form; extremely narrow styles are called "Compressed".

Extended: A wider version of the Roman form.

Summary Table of Typeface Variants

Comparing Typefaces

Historical Context: The classic typefaces you study represent 500 years of design history, balancing readability and contemporary aesthetics. Many have remained in use for decades or centuries. Key Differences: When comparing typefaces, focus on their unique choices in x-height, stroke weight, contrast, and overall "feeling". These choices give each typeface its distinct personality (e.g., whimsical, stately, calligraphic, or mechanical). Personal Palette: Many professional designers rely on a small, carefully chosen set of typefaces throughout their careers. Studying classic typefaces helps you develop a critical eye for making informed type choices.

2.Instruction

3.Exercise

Practice Task： Exercise 1 -- Type Expressions

In this week,we selected 6 words from 14 words related to mental health.Then I chose 4 words from the 6 words : Smile , Bloom , Hope , Free.We were asked to created 20 sketches for each words.

1.1 . Smile

    "Smile" is a very familiar word for us . When we hear this word, the first thing that comes to mind is to be in a good mood.It is the action of a person raising the corners of their mouth. Therefore I mainly designed the following 20 kinds by using the action of raising the corners of the mouth and smooth lines.

Week 1:

             Fig.1.1.1 : 20 sketches of  " Smile " 

Week 2 (improved):

                  Fig.1.1.2: 20 sketches of  " Smile " (improved)

1.2 . Bloom

    "Bloom" is a word that instantly evokes images of flowers opening and things growing into their fullest form. When we hear this word, the first thing that comes to mind is the soft petals unfurling, and the gentle feeling of growth and warmth. It is the action of something coming into full beauty, thriving and spreading life. Therefore, I mainly designed the following 20 styles by using the shapes of flowers, buds, and organic curves to reflect the essence of blooming and growth.

Week 1:

                  Fig.1.2.1 : 20 sketches of "Bloom"

Week 2(improved):

                 Fig.1.2.2 : 20 sketches of "Bloom"(improved)

1.3 . Hope

    "Hope" is a very warm and powerful word for us. When we hear this word, the first thing that comes to mind is light, optimism, and the feeling of looking forward to something better. It is the belief that things can get better, and the gentle strength that keeps us going. Therefore, I mainly designed the following 20 kinds by using shapes of light, stars, hearts, and soft curves to reflect the warmth and power of hope.

Week 1:

                Fig.1.3.1 : 20 sketches of "Hope"

Week 2(improved):

                Fig.1.3.2 : 20 sketches of "Hope"(improved)

1.4 . Free

    "Free" is a word that carries a light, open feeling for us. When we hear this word, the first thing that comes to mind is wind, wide spaces, and the sense of being unbound. It is the feeling of moving without limits, and being able to be fully ourselves. Therefore, I mainly designed the following styles by using flowing lines, open shapes, and light strokes to reflect the lightness and openness of freedom.

Week 1:

                Fig.1.4 .1: 20 sketches of "Free"

Week 2(improved)：

               Fig.1.4.2 : 20 sketches of "Free"(improved)

Final Type Expression

               Fig 2.0 : Sketches of the final type expression

Fig 2.1 : PDF of the final type expression

Final Type Expression animation

Fig 3.0 :  Animation of the final type expression

Practice Task： Exercise 2 -- Text Formatting

Fig 4.0 : Typography Font Comparison for the Final Type Expression

For the exercise,I had two different ideas,following:

Fig 1:

Fig 4.1 the first idea for text formatting without grids

Fig 4.2 the first idea for text formatting without grids

PDF:

HEAD

* Font/s: Bodoni Std Bold Condensed, Bodoni Std Bold

* Type Size/s: 30 pt, 24 pt

* Leading: 34 pt, 28 pt

* Paragraph spacing: 0

BODY

* Font/s: Garamond Regular

* Type Size/s: 9 pt

* Leading: 14 pt

* Paragraph spacing: 0

* Characters per-line: 45–50

* Alignment: Left-aligned

Page Margins

* top + left + right + bottom: 15 mm, 15 mm, 15 mm, 15 mm

* Columns: 2 columns

* Gutter: 5 mm

Fig 2:

Fig 4.3 the second idea for text formatting without grids

Fig 4. 4 the first idea for text formatting with grids

PDF：

HEAD

* Font/s: Bodoni Std Poster Compressed, Bodoni Std Poster

* Type Size/s: 30 pt, 19 pt

* Leading: 36 pt, 55 pt

* Paragraph spacing: 0

BODY

* Font/s: Garamond Regular

* Type Size/s: 9 pt

* Leading: 14 pt

* Paragraph spacing: 0

* Characters per-line: 45–50

* Alignment: Left-aligned

Page Margins

* top + left + right + bottom: 15 mm, 15 mm, 15 mm, 15 mm

* Columns: 2 columns

* Gutter: 5 mm

4.Feedback

Week 1:

General feedback:

Today we choose 6 different words from 14 words, which are related to mental health. Then I choose 4 words from the 6 words and create 20 ideas for each word.

Specific feedback:

Week 2:

General feedback : This week , we finished all 80 different ideas of the 4 words . We showed the 80 sketches to Ms.Vitiyaa .I also knew my own disadvantages of my works , which was very important for my subsequent improvements. 

Week 3:

General feedback :This week, I also got the feedback about my new design for the 80 sketches. I knew more skills to design ,for instance , when designing “free”,there needs to be a large gap to reflect it. The most important thing is we use Adobe Illustrator to design 4 sketches in the document.

Week 4:

General feedback : This week ,we finished 4 final type expression and got the animation of the sketch--"smile" by Photoshop . After that,we learnt about how to use Adobe InDesign. 

Week 5 :

ABSENT

5.Reflections

Experience

In this project, I learned how to create type expressions and page layouts using Adobe Illustrator and InDesign. At first, I found it difficult to arrange typography and align text with grids, especially when using baseline grids and columns. However, after practicing different font styles, spacing, and layout structures, I became more familiar with the tools and workflow. I also experimented with different type expressions such as “Smile,” “Free,” “Bloom,” and “Hope” to explore how typography can visually express emotions and meanings.

I learned how to create a typography layout and organize text using Adobe InDesign. I practiced setting up margins, columns, and baseline grids to improve the structure of the page. At first, I was confused about how grids and text alignment worked, especially when arranging the body text and headings. After experimenting with different settings, I became more confident in using grids, typography tools, and image placement. I also learned how to export layouts with and without visible grids for submission.

Observations

I observed that typography is not only about choosing fonts, but also about balance, readability, and visual communication. Different fonts create different feelings and moods. For example, bold and stretched letters can create strong visual impact, while serif fonts give a more elegant and classic feeling. I also noticed that grid systems are important because they help organize text and images neatly. Proper spacing, alignment, and hierarchy can make a page look more professional and easier to read.

I observed that typography layout requires careful attention to spacing, alignment, and hierarchy. Using grids helped make the design look cleaner and more organized. I also noticed that titles, subtitles, body text, and images all need different formatting styles to create visual balance. Fonts such as Bodoni and Garamond created a more professional and editorial appearance. In addition, I realized that even small adjustments in leading, margins, and spacing can greatly affect readability and the overall design quality.

Findings

From this project, I found that typography and layout design require both creativity and technical skills. Small adjustments such as leading, margins, alignment, and spacing can greatly affect the final result. I also learned how important it is to plan a layout before adding text and images. Through this process, I improved my understanding of type expression, composition, and page structure. Overall, this project helped me gain more confidence in using design software and creating visually effective layouts.

I found that layout design is not only about aesthetics but also about communication and readability. A good grid system helps guide the viewer’s eyes through the page naturally. I also learned the importance of consistency in typography, especially when combining headings, body text, and images together. Through this exercise, I improved my technical skills in InDesign and gained a better understanding of editorial layout and typography principles.