Typography - Task 3: Type Design and Communication
Typography / Bachelor of Design (Honours) in Creative Media / Taylors University
Task 3 / Type Design and Communication
LIST / JUMPLINK
LECTURES
Typo_Task 3A – Typeface Construction: Geometric Foundations
-
Began by setting up a 1000pt x 1000pt workspace in Adobe Illustrator to serve as the canvas for constructing letterforms.
-
Drew a 500pt square to define the working area and establish a proportional x-height reference.
-
Selected a typeface with a compatible x-height and established core typographic guide lines: Ascender, Cap Height, x-Height (Median), Baseline, and Descender.
-
Utilized Illustrator’s [Ctrl+Y] shortcut to alternate between Outline and Preview modes for precision editing.
Began by setting up a 1000pt x 1000pt workspace in Adobe Illustrator to serve as the canvas for constructing letterforms.
Drew a 500pt square to define the working area and establish a proportional x-height reference.
Selected a typeface with a compatible x-height and established core typographic guide lines: Ascender, Cap Height, x-Height (Median), Baseline, and Descender.
Utilized Illustrator’s [Ctrl+Y] shortcut to alternate between Outline and Preview modes for precision editing.
Typo_Task 3A – Typeface Construction: Stroke & Brush Techniques
-
Explored techniques for shaping and refining letterforms using brushes and custom strokes.
-
Focused on the iterative process of developing a cohesive type system from initial sketches to detailed vector adjustments.
Explored techniques for shaping and refining letterforms using brushes and custom strokes.
Focused on the iterative process of developing a cohesive type system from initial sketches to detailed vector adjustments.
Typo_Task 3A – Illustrator to FontLab 5 Workflow
-
Practiced importing Illustrator-based type designs into FontLab 5 for professional-level font development.
-
Emphasized vector preparation and clean path structure for optimal transition into digital type tools.
Practiced importing Illustrator-based type designs into FontLab 5 for professional-level font development.
Emphasized vector preparation and clean path structure for optimal transition into digital type tools.
Typo_Task 3A – Transitioning to FontLab 7
-
Learned how to install and navigate FontLab 7, an advanced font editing software.
-
Gained insight into kerning, spacing, and optical balance between characters.
Learned how to install and navigate FontLab 7, an advanced font editing software.
Gained insight into kerning, spacing, and optical balance between characters.
Typo_Task 3A (Optional) – Typeface Preview on Blogger
INSTRUCTIONS
EXERCISES
-
To deepen my understanding of type structure beyond the lecture content, I conducted independent research on key typographic principles. This helped clarify several concepts that were initially unclear and guided my development process throughout the assignment.
To deepen my understanding of type structure beyond the lecture content, I conducted independent research on key typographic principles. This helped clarify several concepts that were initially unclear and guided my development process throughout the assignment.
RESEARCH
1. Fundamentals of Typography
-
I began by reviewing the core elements of typography, including anatomy, alignment, and classification. These foundational principles helped me better understand how individual letterforms are constructed and evaluated.
I began by reviewing the core elements of typography, including anatomy, alignment, and classification. These foundational principles helped me better understand how individual letterforms are constructed and evaluated.
2. Serif vs. Sans Serif
-
Next, I explored the differences between serif and sans serif typefaces, paying particular attention to their visual characteristics, usage contexts, and historical origins.
Next, I explored the differences between serif and sans serif typefaces, paying particular attention to their visual characteristics, usage contexts, and historical origins.
3. Letterform Structure & Proportion
-
To inform my typeface construction, I researched the internal proportions of letterforms—such as stroke weight contrast, counter space, and axis orientation—essential for consistent and readable designs.
To inform my typeface construction, I researched the internal proportions of letterforms—such as stroke weight contrast, counter space, and axis orientation—essential for consistent and readable designs.
LETTER DECONSTRUCTION
-
Using Adobe Illustrator, I analyzed the structural components of four selected characters—H, o, b, and g—from the font Adobe Caslon Pro - Regular, one of the ten typefaces assigned by Mr. Vinod. I focused on dissecting each letter’s anatomy, identifying elements such as the stem, bowl, counter, shoulder, and terminal.
-
–Deconstruction of Letters (PNG)
Using Adobe Illustrator, I analyzed the structural components of four selected characters—H, o, b, and g—from the font Adobe Caslon Pro - Regular, one of the ten typefaces assigned by Mr. Vinod. I focused on dissecting each letter’s anatomy, identifying elements such as the stem, bowl, counter, shoulder, and terminal.
-
–Deconstruction of Letters (PNG)
SKETCH DEVELOPMENT
1. Initial Hand-Drawn Exploration
-
I began by sketching various font styles using pens of different sizes and nib types—broad-edged, flexible pointed, and standard—on graph paper. This helped me experiment with contrast, rhythm, and spacing.
-
Initial Sketches on Grid Paper (JPEG)
I began by sketching various font styles using pens of different sizes and nib types—broad-edged, flexible pointed, and standard—on graph paper. This helped me experiment with contrast, rhythm, and spacing.
-
Initial Sketches on Grid Paper (JPEG)
2. Transition to Blackletter Style
-
Based on Max’s feedback, I shifted my focus toward developing a typeface inspired by Blackletter calligraphy. I studied historical and contemporary Blackletter references and began experimenting with strokes and letter structures through both traditional and digital sketching methods.
-
Typeface Concept Sketches (JPEG)
-
Typeface Concept Sketches (JPEG)
Process
1. Introduction to Digital Typeface Creation
-
This project marked my first experience using Adobe Illustrator to design and digitize a custom typeface. Starting from a hand-drawn sketch, I translated each glyph into digital outlines while gradually learning the balance between aesthetic style and structural consistency.
This project marked my first experience using Adobe Illustrator to design and digitize a custom typeface. Starting from a hand-drawn sketch, I translated each glyph into digital outlines while gradually learning the balance between aesthetic style and structural consistency.
2. Feedback & Iteration
-
After completing my initial version, I submitted the design to Max for critique. Based on his feedback, I made several refinements to ensure more uniform line thickness throughout the alphabet.
After completing my initial version, I submitted the design to Max for critique. Based on his feedback, I made several refinements to ensure more uniform line thickness throughout the alphabet.
3. Digitization with FontLab
Following a guided video tutorial, I imported the revised letterforms into FontLab 7 for further digitization. Inside the software, I:
Adjusted spacing and kerning to achieve balance between characters
Tuned individual glyph metrics to ensure even rhythm in word construction
Exported and installed the finalized font for real-world testing
This process helped me bridge the gap between concept and application, providing valuable insight into the technical dimensions of type design.
2. My initial sketch
3. Screengrab of Fontlab Process (side-bearings)
4. Final Type construction in AI JPEG & PDF
5. Final A4 black & white poster in JPEG & PDF
4. Final Type construction in AI JPEG & PDF
5. Weekly Feedback Log
-
Week 8
General:
Max introduced the foundational five reference lines in typography: ascender line, cap height, x-height, baseline, and descender line. He encouraged researching different type styles to inspire structural variety.
Specific:
Received early feedback on my initial sketch; several modifications were suggested.
Week 9
General:
Max re-explained Task 3's scope and provided critique on each student's typeface concept.
Specific:
My overall structure was sound, but some glyphs felt disconnected from the overall system.
Week 10
General:
The focus shifted to converting sketches into digital type using Adobe Illustrator. Emphasis was placed on documenting every stage.
Specific:
Max highlighted inconsistent stroke weights and guided me through the correction process.
Week 11
General:
We transitioned to FontLab 7, learning how to import and prepare our typefaces for digital output.
Specific:
I began adjusting spacing and kerning. Max stressed the importance of side bearings and optical balance in glyph spacing.
Week 12
General:
The class finalized their fonts in FontLab and installed them for testing.
Specific:
My design imported and exported smoothly. Max approved the result and noted it was well-executed.
Week 8
General:
Max introduced the foundational five reference lines in typography: ascender line, cap height, x-height, baseline, and descender line. He encouraged researching different type styles to inspire structural variety.
Specific:
Received early feedback on my initial sketch; several modifications were suggested.
Week 9
General:
Max re-explained Task 3's scope and provided critique on each student's typeface concept.
Specific:
My overall structure was sound, but some glyphs felt disconnected from the overall system.
Week 10
General:
The focus shifted to converting sketches into digital type using Adobe Illustrator. Emphasis was placed on documenting every stage.
Specific:
Max highlighted inconsistent stroke weights and guided me through the correction process.
Week 11
General:
We transitioned to FontLab 7, learning how to import and prepare our typefaces for digital output.
Specific:
I began adjusting spacing and kerning. Max stressed the importance of side bearings and optical balance in glyph spacing.
Week 12
General:
The class finalized their fonts in FontLab and installed them for testing.
Specific:
My design imported and exported smoothly. Max approved the result and noted it was well-executed.
6. Reflection
Experience
This project offered my first complete journey through digital type design—from sketch to vector, then into usable font format. Despite initial setbacks, I gained a strong sense of satisfaction as the font evolved from raw sketches into a usable design system. The process deepened my interest in typography and boosted my confidence in tackling future design challenges.
Observation
Font creation is not just artistic but highly technical. I discovered how crucial consistent height, stroke width, and spacing are to achieving a coherent system. Small proportional shifts, once overlooked, now stand out to me as essential for rhythm and legibility.
Findings
Designing a typeface demands both logic and artistry. Good fonts aren’t accidental—they’re the result of intentional decisions, precise geometry, and iterative refinement. This project laid the groundwork for my ongoing exploration of type design and affirmed my passion for typographic structure.
Further Readings
Grid Systems
Grid systems are essential to creating structure and clarity in design. Through my reading, I came to see grids not as creative limits but as foundations that support clean, organized layouts. This system improves readability while allowing consistent alignment across elements. The idea that one can creatively deviate from a grid, rather than strictly obey it, was an important shift in my thinking.
Figure: Visual representation of Grid Systems
Radial Systems
Radial systems introduced the concept of focal movement. Elements arranged around a central point naturally direct the viewer’s eye. This technique adds energy and can dramatically enhance layout flow. I found this especially relevant for projects that need impact at first glance, like event posters or brand storytelling.
Figure: Visual representation of Radial Systems
Modular Systems
Modular systems taught me the power of repetition with consistency. By segmenting the design space into repeatable blocks, it becomes easier to present diverse content within a cohesive framework. This is particularly useful for layouts like portfolios, product grids, or visual menus.
Figure: Visual representation of Modular Systems
Random Systems
Although chaotic at first glance, random systems still follow visual logic. They challenge the norms of balance and alignment, making the viewer explore the layout. The key is intentional disruption—making sure every displaced element still has purpose. I learned that with enough care, even randomness can feel harmonious.
Figure: Visual representation of Random Systems
Axial Systems
Axial systems rely on a central axis to organize content. Whether elements are mirrored or balanced asymmetrically, the axis creates a reference point that stabilizes the layout. This system reinforced for me the idea that even minimal structure can guide complex content effectively.
Figure: Visual representation of Axial Systems
评论
发表评论