Typography - Task 2 : Typographic Exploration and Communication
27.10.2025 - 14.11.2025 (Week 6 - Week 8)
Lim Jia Yu 0357873
Bachelor of Business (Hons) in Digital Marketing l Creative Media Design (Minor)
GCD60104 Typography (sec 02)
Task 2 (Typographic Exploration & Communication)
TABLE OF CONTENTS
1. Lectures
2. Instructions
3. Feedbacks
4. Reflections
Lectures
W5 Lecture (20.10.2025)
Title - Understanding
Lecture Video 1: Typo_5_Understanding
Understanding letterforms
1. Uppercase
- it suggest symmetry, but in fact it is not symmetrical
2. Lowercase
- both are sans-serif typefaces
- but when look closely at their shapes, curves, proportions
- differences reveal each typeface's unique personality and design philosophy
Maintaining x-height
- x-height = the size of the lowercase letterforms
- curved strokes (exp: "s") must rise above the median or sink below the baseline
- to appear to be same size as the vertical and horizontal strokes they adjoin
Form vs Counterform
Form :
- positive space (actual shape / stroke of a letter)
- the black area that defines the structure of each character
- determines the style, thickness, appearance of the typeface
Counterform :
- negative space (the empty / white space inside and around a letter
- includes both enclosed spaces and open areas between letters
- affects readability, balance, and how letters connect visually
Contrast
- key design principle
- refers to visual difference between two or more elements
- help create interest, hierarchy, clarity in design
- simple contrast can create many variations
W6 Lecture (27.10.2025)
Title - Screen & Print
Lecture Video 2: Typo_6_Screen&Print
The Past vs Today
The Past :
- typography only came to life when it was printed on paper
- once printed, nothing could be changed (permanent)
- skilled designers made sure the text looked neat and easy to read
- design always looked the same on every printed copy
Today :
- typography now appears on all kinds of screens
- exp: phones, tablets, computers
- text is displayed in real time by the browser or app you're using
- the reading experience can look different for everyone
Typography in different medium
Hyperactive link
- a clickable word, phrase, image
- it takes you to another webpage or a different section of the same page
- usually appears blue and underlined by default
- when you move the cursor over it, it changes to a hand icon
- commonly used on websites to help users naviagate easily
Font size for screen
- screens on PCs, tablets, phones, TVs come in different sizes
- text size looks different because each device has different pixel sizes
- exp: 100 pixels on a laptop is not the same as 100 pixels on a 60" TV
- even devices of the same type can show text at different proportions
Static vs Motion
Instructions
<iframe src="https://drive.google.com/file/d/1cLDKQn6hY0SLxbcTtn5xY2bMshOHa45P/preview" width="640" height="480" allow="autoplay"></iframe>
Task 2 - Typographic Exploration & Communication
A) Research
Step 1
select one topic from the three given topics
Step 2
layout reference (Pinterest)
B) Ideation
Step 1
requirements
- font size (8-12)
- line length (55-65 / 50-60 characters)
- text leading (2, 2.5, 3 points larger than font size)
- paragraph spacing (follows the leading)
- ragging (left alignment) / rivers (left justification)
- cross alignment
- no widows / orphans
Step 2
sketches for layout
Step 3
digitised explorations (Adobe InDesign)
Step 4
layout design approved by Ms. Vitiyaa
C) Final Typographic Exploration & Communication
Requirements
- JPEG, 300ppi, grayscale (with grid visible and without)
- PDF (with grid visible and without)
Head
Font/s : Universe LT Std (Bold), Universe LT Std (Black)
Type size/s : 105 pt & 31 pt & 15 pt & 14 pt & , 110 pt
Leading : 108 pt & 33 pt & 18 pt & 17 pt, 113 pt
Paragraph spacing : 0 mm
Body
Font/s : Univers LT Std (Roman)
Type size/s : 10 pt
Leading : 12 pt
Paragraph spacing : 12 pt (4.233 mm)
Characters per-line : 55-65
Alignment : Justify with last line aligned left
Page Margins
Top (10 mm) + Left (10 mm) + Right (10 mm) + Bottom (10 mm)
Columns : 2
Gutter : 5 mm
Feedbacks
Week 6
General Feedback :
No class.
Specific Feedback :
Ms. Vitiyaa is on leave.
Week 7
General Feedback :
My work lacks balance in some layouts and does not fully follow the grid or meet the given requirements.
Specific Feedback :
Some layouts are unbalanced and misaligned with the grid. I need to adjust to improve structure and meet the criteria and show it again in Week 8 for feedback.
Week 8
Specific Feedback :
The layout for each design turned out really well. It is now looks clean, balanced, and clearly shows the idea through the use of typography.
General Feedback :
The font choices and spacing work nicely together, making everything easy to read and well-structured. The final tweaks really helped improve the overall flow and presentation. All the layouts was approved by Ms. Vitiyaa and she chose the first layout as my final submission work.
Reflections
1) Experiences
To start off Task 2 - Typographic Exploration & Communication, I selected the topic "Designing Change: How Designers Shape the World We Live In" from the three given articles. I began by creating seven sketches to experiment with different layout ideas before moving on to seven digitised explorations. At first, transferring my ideas from sketch to digital form felt a bit awkward. What looked playful and free in my sketches became much more rigid once I applied the required grid, the two-column layout with a 5 mm gutter, and the justified body text. However, as I refined each layout (adjusting leading, grid alignment and font sizes), I started to feel more confident. When my work was finally approved by Ms. Vitiyaa, it was rewarding to see how those design rules helped bring my concept to life in a structured, meaningful way rather than restricting it.
The entire workflow (research, ideation, sketching, digitising, approval) felt like a typographic journey. Also, I learned how to communicate meaning purely through type arrangement instead of relying on decorative elements. Applying the instruction sheet’s criteria (50-60/55-65 characters per line, font size 8-12 pt for body text, line-length and specific paragraph spacing) made me realise how much these “small details” affect readability and the overall visual tone. I particularly enjoyed seeing my final layout, both with and without visible grid were clean, purposeful and expressive of the “Designing Change” theme without needing any images. Turning a rough idea into a disciplined, well-balanced layout gave me a real sense of satisfaction.
2) Observations
I observed that following detailed instructions made me more aware of how every typographic decision contributes to communication. For example, when I adjusted the leading by just 10 pt or changed the margin slightly, the overall readability improved noticeably. I also noticed that working in grayscale forced me to focus more on visual rhythm and hierarchy rather than relying on colour to guide the eye. It made me realise how important spacing and proportion are in creating contrast and emphasis.
From the progress, I also observed how the grid serves as an invisible structure that guides the entire layout. The alignment and spacing it creates make the design feel coherent. The difference between my early sketches and final output showed me that structure and clarity always outperform decoration. Seeing other classmates' work during feedback also opened my eyes to how simple adjustments like consistent column alignment or even margins can make a layout look more professional and balanced.
3) Findings
Overall, I found that typography is a blend of creative thinking and technical precision. Following the instructions step by step helped me see how rules such as proper leading, justified alignment, and grid structure actually enhance design rather than restrict it. My Final layout proved that when the text hierarchy and alignment are clear, the message becomes easier to read and more impactful. I learned that even without using images or colours, typography itself can communicate visually if designed thoughtfully.
Besides, I found that documenting each stage of my progress from sketching to digital refinement made me more conscious of my own design decisions. Each feedback session taught me how to evaluate my layout critically and make small but meaningful adjustments. This task strengthened my ability to see typography not just as text arrangement, but as a tool for communication and clarity. Moving forward, I will continue to apply these principles of structure, rhythm, and balance in my future designs.
Further Readings
Book title :
The Elements of Typographic Style
Author :
Robert Bringhurst
Abstract :
This book is often described as the "Bible of Typography". Robert Bringhurst explores both the technical and poetic sides of type like how letters, words, and layouts work together to create meaning. He explains everything from type anatomy and spacing to page balance and visual rhythm. What makes this book stand out is how it connects design rules with design philosophy. It doesn't just tell you how to design, but also why certain typographic decisions help the message read more clearly and beautifully.
How it relates to my work :
This book relates closely to my Task 2 - Typographic Exploration & Communication, where I chose the topic "Design Change: How Designers Shape the World We Life In". Throughout this project, I experimented with structure and layout while applying grids, alignment, and spacing rules. Bringhurst's ideas about clarity, rhythm, and structure echo what I experienced while refining my layout in InDesign. For example, when I adjusted leading, margins, or the number of characters per line, I could see how those small technical details affected the overall readability and tone. His emphasis on "letting the words breathe" through careful pacing matches exactly what I tried to achieve in my final composition.
Key takeaways :
- good typography isn't about decoration, it's about communication and structure
- every small adjustment such as leading, alignment, gutter size can change how the reader feels when reading the text
- a strong layout depends on invisible systems (grids, rhythm, spacing), not just visual style
- simplicity takes discipline; following typographic rules can actually make your work more expressive
- typography is a language on its own, the way we arrange type can express meaning even without images




























%20copy_page-0001.jpg)
%20copy_page-0001.jpg)

Comments
Post a Comment