Advanced Typography | Task 3 : Type Exploration and Application
April 21,2025
ZHOU BOYING / 0369087
Typography / Bachelor of Design (Honours) in Creative Media / Taylor's University
LIST
1. Lectures
2. Instructions
3.Task 3 : Type Exploration and Application
4. Feedback
5. Reflections
6. Further Reading
Lectures
In our physical class this week, Mr. Vinod provided individual feedback on our Task 3 proposal presentations. We each used Google Slides to explain our ideas and showed some initial sketches of our typeface designs.
During the critique session, Mr. Vinod mentioned that my four ideas were all promising and conceptually interesting. However, he advised me to further refine the visual direction of each typeface and make the design language clearer. He also emphasized that every idea should be linked to a specific brand, theme, or usage context, so that the purpose and audience of the font would be more grounded and recognizable.
This feedback helped me better understand how to connect abstract design ideas to real-world applications, and reminded me to consider the commercial or communicative function of typography—not just its style.
Physical Class
In Week 12, I successfully imported my complete typeface into FontLab. This marked a significant step in the type design process, as I could now begin refining the technical details of the font in a professional environment.
Mr. Vinod reviewed my progress and responded positively. He commented that my overall typeface structure is well-developed and visually cohesive. He was particularly pleased with the consistency between the uppercase, lowercase, numerals, and punctuation. However, he also pointed out that some of the lowercase letters still have issues with spacing and size alignment, which I will continue to refine in the coming days.
His feedback gave me more confidence to proceed, and I now plan to focus on correcting the spacing inconsistencies and ensuring proportional harmony across all glyphs before moving on to kerning and font export.
Instructions
Task 3 : Type Exploration and Application
Proposal
Before we start to create the font, we need to come out three idea for our design to be approved.
Fig 1.1 Proposal slides, week 9
After receiving approval from Mr. Vinod, I decided to proceed with my second idea, which is to design a grid-based typeface using dot structures, developed from my earlier modular explorations.
Research
To develop my second idea — a grid-based typeface using dot structures — I researched several pixel and modular typefaces that use circular or square units as the foundation of their letterforms. These included classic 8-bit fonts, retro LED display fonts, and contemporary experimental grid systems.
Uppercase Digitalization 1
At the beginning, I really liked my Idea 4 and I believed that this design style would be highly suitable for logos in the e-sports system. Therefore, I decided to further explore Idea 4 by constructing an octagonal base structure and applying geometric slicing techniques.
Uppercase Digitalization 1
After researching various similar typefaces for reference, I proceeded with the digitalization process using Adobe Illustrator. I established a symmetrical grid, where each square contains a circle. The grid is structured in 7×7 rows and columns, and I conducted my design experiment based on this system.
1.Uppercase and Lowercase Letters
Throughout the process of digitizing the lowercase letters, I conducted three rounds of adjustments.
In the first attempt, I overlooked the importance of size differentiation and designed the lowercase letters at the same height and width as the uppercase letters. This resulted in a lack of visual hierarchy, making it difficult to distinguish between uppercase and lowercase characters, which is against fundamental typographic principles.
In the second attempt, I adjusted the height of the lowercase letters to be smaller. However, a new issue emerged—the lowercase letters appeared too wide. This made the overall typeface feel unbalanced and inconsistent, with poor letter spacing and significantly reduced legibility.
In the third attempt, I focused on refining the structure and proportions of the uppercase letters to ensure visual stability. I then carefully adjusted the width and height of the lowercase letters to follow proper typographic conventions, achieving a more harmonious balance between uppercase and lowercase forms. In the final version, the lowercase letters became more compact, well-proportioned, and highly legible, successfully creating a clear distinction between uppercase and lowercase while meeting practical design and layout requirements.
2.Numbers and Punctuation
After completing the uppercase and lowercase letter designs, I further developed numbers and punctuation that visually align with the style of this typeface.
2.1 Number Design
Special attention was given to differentiating the number "0" from the uppercase letter "O" through distinctive detailing, which helps avoid confusion in typography.
The number set was strictly designed based on the grid system. I carefully adjusted stroke thickness, rounded corners, and proportions to ensure complete stylistic consistency with the letterforms.
I explored three different number design styles:
The first set follows the basic grid construction, with consistent stroke width and rhythm that match the letterforms. However, this version appeared slightly thin and lacked visual weight.
The second set features improved proportions and increased stroke thickness. The visual weight is more balanced, but some numbers still required further refinement.
The third set presents a bolder, rounder style with thicker strokes and smoother shapes. This version is more suitable for headlines, posters, and large-size applications, achieving the best visual balance and consistency with the overall typeface.
2.2 Punctuation Design
The punctuation set includes essential symbols such as periods, commas, colons, semicolons, question marks, exclamation marks, brackets, and decorative symbols like floral and geometric shapes. All punctuation marks were constructed based on the grid system and maintain consistency with the typeface’s stroke style.
Specific symbols like hyphens, underscores, and equal signs were intentionally bolded to make them more prominent in layout compositions. Additionally, I created special decorative marks that can support future brand extension and graphic applications.
In Fig 1.13, my initial symbol set was created based purely on intuition. Without referencing the cap height, x-height, or baseline of my typeface, many glyphs lacked visual balance and structural consistency. The stroke weight and spacing were inconsistent, leading to a disjointed rhythm across the set.
In Fig 1.14, I attempted to improve proportion by loosely aligning symbols to uppercase and lowercase letterforms. However, due to the absence of a defined modular grid and typographic alignment system, the symbols still appeared disproportionate. Key elements such as brackets, slashes, and punctuation marks lacked alignment with the typographic rhythm of the typeface.
In Fig 1.15, I refined the symbols based on feedback from my instructor. I established a standardized grid, adjusted stroke weights to match the typeface, and refined spacing for better consistency. Functional glyphs like the asterisk, ampersand, quotation marks, and brackets were redesigned to integrate seamlessly with the type system. This final set achieves a more cohesive rhythm, visual alignment, and typographic clarity.
This iterative process deepened my understanding of how symbols should not stand alone, but rather be an integral part of the overall typographic system—aligned in proportion, rhythm, and visual logic.
FontLab
1. Importing Letterforms into FontLab from Illustrator
After finalizing all my glyph designs—including uppercase, lowercase, numerals, and punctuation—I began constructing my typeface using FontLab. Each character was manually assigned to its corresponding Unicode slot (e.g., A, B, comma, ampersand, etc.).
This direct import method—by copying and pasting from Adobe Illustrator—was efficient and flexible. It allowed me to skip unnecessary file exports and instead focus on adjusting stroke alignment and visual consistency right inside FontLab.
After importing all glyphs, I moved on to adjusting the sidebearings and kerning pairs to ensure typographic consistency and balance across the entire font. I referred to the measurement guide provided by Mr. Vinod, but also made optical adjustments where necessary.
Uppercase Letters
I maintained a consistent advance width (540 units) across all uppercase letters, with sidebearings generally set to 20 units. Certain characters like “I” received custom spacing due to their narrow form.
Lowercase Letters
Most lowercase glyphs were spaced around 430–440 units with 10-unit sidebearings. Characters like “i” and “l” were given additional spacing to avoid crowding.
Numerals
Numerals were generally set to around 420–421 units width, with uniform spacing to ensure clear vertical alignment in tables or data-heavy contexts.
Punctuation and Symbols
I paid special attention to characters like period, comma, quotation marks, and mathematical symbols. Some values (like for quote marks or asterisks) required individual fine-tuning due to their visual weight.
Font Presentation
I chose a high-contrast color palette—neon yellow, pure red, navy blue, and black—to enhance the bold and futuristic feel of my typeface. This combination creates strong visual tension and rhythm, highlighting the geometric and modular design of the font.
Throughout the development of this typeface, I carried out multiple rounds of refinement to enhance both structure and expression. After completing the initial grid-based construction, I repeatedly adjusted stroke weight, corner radius, and spacing to maintain consistency across all glyphs. I also tested the typeface in different contexts—including 3D distortion, logo lockups, and digital interfaces—to assess its visual adaptability. I revised the color schemes, layout rhythm, and modular alignment several times until they aligned with my overall tech-inspired concept. This iterative process allowed me to push the design beyond mere functionality and toward a more expressive, branded visual identity.
Finalized Font Presentation artworks
To visualize how my typeface could be applied in real-world contexts, I created five mockup applications using Adobe Photoshop. These include a mousepad, a sticker, a keychain, a CRT screen graphic, and a cassette tape packaging set. Each item was carefully designed to reflect the typeface’s pixel-based structure and retro aesthetic. I explored different layout positions, color contrast, and object proportions to highlight its visual impact. These mockups showcase the versatility and nostalgic tone of the typeface, while also demonstrating its storytelling potential across merchandise and digital-analog media.
(1).png)
Task 3 Final Outcome
Task 3 Final (10/07/2025) (Week 13)
Task 3 Final (08/07/2025) (Week 12)
Feedback
Week 9
Specific feedback:
Mr. Vinod provided specific feedback on my blog writing and emphasized that I should ensure my blog posts are well-structured, complete, and cover all key content. For my typeface presentation, he commented that my four design ideas were interesting but needed further refinement. He also suggested that each typeface should be connected to a particular brand or usage scenario to strengthen the design context and make the concept more recognizable.
General feedback:
Mr. Vinod reminded the class to maintain good writing structure in the blog and to avoid missing important points. He encouraged everyone to start thinking about the branding and application of their typeface ideas to develop stronger, more purposeful designs.
Week 10
Specific feedback:
Mr. Vinod reviewed my second typeface idea based on a dot-grid system. He commented that the letterform structures were visually consistent and showed clear progress. He believed that this idea had strong potential and encouraged me to develop it into a complete typeface. He also suggested that I should pay attention to the spacing and interaction between letters to improve the overall visual harmony.
General feedback:
Mr. Vinod emphasized the importance of refining the entire uppercase letter set and reminded everyone to start considering letter spacing and how characters interact within a word. He encouraged the class to keep improving their ideas and to stay focused on building a fully functional and usable font.
Week 11
Specific feedback:
Mr. Vinod confirmed that I have successfully completed all required letterforms, including uppercase, lowercase, numerals, and punctuation. He recommended that I move on to the font generation stage and suggested using FontLab7 available in MacLab D7.04, or alternatively, trying free font generation software like FontForge.
General feedback:
Mr. Vinod once again highlighted the importance of typography fundamentals and provided detailed instructions on the final deliverables. He reminded the class to ensure that all parts of the typeface are completed and to start preparing for the final font production using suitable software.
Week 12
Specific Feedback:
This week, I imported my complete typeface into FontLab. Mr. Vinod reviewed my work and commented that overall, the font looks well-constructed and consistent. He was satisfied with the visual harmony across uppercase, lowercase, numerals, and punctuation. However, he pointed out that some lowercase letters still had minor issues related to spacing and size alignment. I was advised to refine those specific characters to improve the uniformity of the typeface.
General Feedback:
Mr. Vinod’s comments gave me greater confidence in the direction of my work. I realized that even after the drawing phase is complete, the digital fine-tuning process in FontLab is crucial to ensure professional quality. Moving forward, I will focus on adjusting spacing problems in the lowercase letters and begin preparing for kerning and final export. This week helped me understand the importance of technical precision in the final stages of type design.
Reflections
Further Reading
Saltz, I. (2019). Typography Essentials Revised and Updated: 100 Design Principles for Working with Type
Further Reflection on “Typography Essentials Revised and Updated” by Ina Saltz (2019)
Reading Typography Essentials for a second time during this type design project gave me new insights that directly influenced my practical decisions. Because I was going through the full type creation process—from sketching to kerning to application—I could now better understand and apply the principles discussed in the book.
For example, the book’s emphasis on legibility, consistency, and spatial rhythm made me more careful when adjusting stroke weights, glyph spacing, and overall alignment. I also took inspiration from how the book explained typographic hierarchy, which helped me decide how to structure letter proportions and define a clear system within my typeface.
One of the most useful takeaways was the reminder that typography is not just about individual letters, but about building a cohesive system. This idea helped me make more informed decisions when dealing with symbol shapes, punctuation, and contextual alternates. The examples in the book also showed how layout and color can affect the perception of type, which I considered carefully when applying my font in mockups like posters, packaging, and screen-based compositions.
Overall, the second reading deepened my appreciation of typographic systems, and gave me both technical direction and creative encouragement throughout this project. It also reminded me that refinement is key—not just in theory, but in every detail of the design process.
Comments
Post a Comment