Typography - Task 3: Type Design and Communication

10 June 2025 - 15 July 2025 ( Week 8  - Week 12 )

Hsu Myat Wati | 0381660 | Bachelor of Design (Hons) in Creative Media
Typography | Taylor's University

Table of contents


1. LECTURES

Tutorial Videos

Typo Task 3A Typeface Construction (Shapes)

Typo Task 3A Typeface Construction (Strokes + Brush)

Typo_Task 3A_Illustrator To Fontlab5 Demo (WATCH FIRST before FontLab 7 Video)

Typo_Task 3A FontLab7 Demo (Watch FontLab 5 Demo First)

Typo Task 3A (optional) – Preview & Type Your Font on Blogger by Lim Jia Sheng



2. INSTRUCTIONS

MIB:



3. TASK 3

Sketches

We began our process of sketching on graph paper using different sizes of markers starting from week 8. We explored several ways of creating various styles of fonts. I tried sketching in as many styles as possible by changing the way I held the marker or the pressure I applied when writing. 

Fig 3.1 - Sketch 1, Week 8 (10 June 2025)
Fig 3.2 - Sketch 2, Week 8 (10 June 2025)

Fig 3.3 - Sketch 3, Week 8 (10 June 2025)
Fig 3.4 - Sketch 4, Week 8 (10 June 2025)

Fig 3.5 - Sketch 5, Week 9 (17 June 2025)
Fig 3.6 - Sketch 6, Week 9 (17 June 2025)

Then, I got an idea of exploring the geometric shapes to generate further ideas. I liked the way they are systematic and have a consistent structure, as I create more. I followed our lecturer's suggestion to design A-Z and see if it would work for the following tasks. I explored the four geometric shapes: Circle, Triangle, Square, and Octagon.

My Chosen Design

Fig 3.7 - Chosen sketch, Week 9 (17 June 2025)

Out of all the shapes, I like the octagon the most since the structure looks smoother and more connected.

Progress 1 (Adobe Illustrator)

Starting from week 9 onward, we began to construct our type in Adobe Illustrator. 

Fig 3.8 - Foundation (AI), Week 10 (24 June 2025)
I started by creating the guidelines. I created it by separating the layers and drawing the structure of an Octagon as my guideline layer. 

Fig 3.9 - Constructing with basic shapes (AI), Week 10 (24 June 2025)
I identified the basic shapes that can create all the alphabet A-Z. Then, I combined the shapes to create one character after another.

Fig 3.10 - Lines only look, (AI), Week 10 (24 June 2025)
This is how it looked before I used the 'Compound Shape' tool. 

Fig 3.11 - Further refining, (AI), Week 10 (24 June 2025)
I continued designing the special characters and merged all the shapes after making the necessary adjustments.

Fig 3.12 - Compound Shape (AI),  Week 10 (24 June 2025)
After using the 'Compound Shape' tool, the lines look a lot cleaner and more connected.

Fig 3.13 - Final look (AI)Week 10 (24 June 2025)
This is the final look at all the alphabets and the special characters. 

Measurements (from baseline)

Capital height: 700 pt
Median: 500 pt

Progress 2 (FontLab7)

From week 11 onward, we began to test our font in FontLab 7.

Fig 3.14 - Measurement (AE), Week 11 (1 July 2025)
This is the phase of transferring the type from Adobe Illustrator to FontLab by copying and pasting. Then, I started to adjust the size of the font. Since my font has a basic structure, I just made the size 700x700. 

Fig 3.15 - Kerning (AE)Week 11 (1 July 2025)
This is the phase of kerning for all the characters. 

Fig 3.16 - DownloadedWeek 11 (1 July 2025)
This is how it looks after downloading and putting it into my Font Book.

Reference

Fig 3.17 - Folded paper referenceWeek 11 (1 July 2025)
This folded paper font style also inspired me to come up with the new geometric shape octagon, in addition to the basic ones.

Final Type Design

Download here - Link
Fig 3.18 - Final Construction (JPG)Week 12 (8 July 2025)

Fig 3.19 - Final Construction (JPG)Week 12 (8 July 2025)

Poster Progress

Fig 3.21 - Poster 1, Week 12 (8 July 2025)
Fig 3.20 - Poster 2, Week 12 (8 July 2025)
Fig 3.22 - Poster 4, Week 12 (8 July 2025)

Fig 3.23 - Poster 3, Week 12 (8 July 2025)

Final Poster


Fig 3.24 - 'OCTA' Typo Poster (JPG), Week 13 (15 Jul 2025)


Fig 3.25 - 'OCTA' Typo Poster (PDF), Week 13 (15 Jul 2025)

4. FEEDBACKS

Week 12: General Feedback: Should start doing the poster in Adobe Illustrator today.
Specific Feedback: Downloading the font, making the poster, and the blog should be done by next week's class.

Week 11: Absent.

Week 10: General Feedback: The weight and overall visual of the type look okay.
Specific Feedback: The 'D' and 'O look quite similar. Should add the external part for 'D', something like the 'Q' I created. 

Week 9: General Feedback: It's good to explore the geometric shape. 
Specific Feedback: Put all the sketches in the e-portfolio and choose one shape to digitise.

Week 8: General Feedback: Better try to write A to Z for task 3. Try as many varieties as we can with each marker. 
Specific Feedback: We can sketch for structure and shape, but cannot draw.


5. REFLECTIONS

This Task taught me how to make one step at a time and made me see the process of creating my own font clearly. Week after week, I can see my font progressing from systematic construction till it's ready to download. Before this module, I never knew how challenging it is to create a new font that we can sell online. I never knew about the baselines, ascenders, and descenders, and how they have specific measurements to form a perfect font design.

It was fascinating to sketch out all the ideas running through my mind on paper using the calligraphy pen. It was challenging since this is my first time using this kind of pen and graph paper. Everything feels new and interesting to me. Although I was struggling when I just started to do my first stroke, I got to go with the flow, and my hand moved more smoothly in every direction that I wanted. Also, having to create A-Z for every font style that I come up with was not an easy process. However, after getting feedback from my lecturer, I realized that some alphabets can be rotated or adjusted in positioning to form another one. Then, it becomes a lot easier for me to create till Z. 

After going through several research, one great idea just came into my mind while I was looking at the detailed guidelines of the graph paper. Then I decided to explore the basic geometric shapes, such as circle, square, triangle, etc. I tried my best to fit every character A-Z into the same shape. Overall, it was such a fun process transforming the alphabet into geometric shapes. 


6. FURTHER READINGS

Material Design - Version 2. (n.d.). Material Design. https://m2.material.io/design/typography/understanding-typography.html#type-properties 


What is Typography? (2024, December 6). The Interaction Design Foundation. https://www.interaction-design.org/literature/topics/typography?srsltid=AfmBOop87s8Kes2a9YO-49gSip-7sR7nD_uUgFdKE-zb8nPqhxxtIXBj


Getting Started in Type Design | OH no Type Company. (n.d.). OH No Type Company. https://ohnotype.co/blog/getting-started


Comments

Popular posts from this blog

Advanced Typography - Final Compilation & Reflection

Advanced Typography - Task 3: Type Exploration and Application

Advanced Typography - Task 2: Key Artwork & Collateral