Typography - Task 3: Type Design & Communication
11/11/2024 - 22/12/2024 (Week 8 - Week 14)
Chang Wing / 0367807
Typography / Bachelors of Design (Honours) in Creative Media / Taylor's University
Task 3: Type Design & Communication
TABLE OF CONTENTS
1. Lectures
1. Lectures
INSTRUCTIONS
Type Design
Create a typeface that has the hallmarks
of a good typeface; subtlety or character, presence, legibility and
readability. Design the following characters: "o, l, e, d, s, n, c, h, t, i, g, , . ! #". Upon completion of a basic A4 size poster will be created to display the font.
PROCESS WORK
Task 3: Type Design & Communication
Typeface Used: Univers LT Std 67 Bold Condensed
- Counters within "o," "g," and "b" has slight vary in shape
- Overshoot of the lower bowls of "o" and "b" is consistent
- Overshoot of the lower bowls of "o" and "b" is consistent
- Letter "h" is aligned with the baseline
- Stem heights of "h" and "b" are same
- Stem above the bowl of "b" is thicker than the stem below the bowl
- Bowl of "g" sits slightly above the baseline
- Stem heights of "h" and "b" are same
- Stem above the bowl of "b" is thicker than the stem below the bowl
- Bowl of "g" sits slightly above the baseline
- Left stem of "g" is thicker than its right stem
Reference
Figure 1.2 Pinterest Images (28/10/24)
Sketches
I sketched in different writing styles using 3 types of marker pen: Faster 500 Whiteboard Marker, Unicorn Dual Brush Pen and Artline Calligraphy Pen 4.0.
I selected this sketch as the foundation for my font digitisation in Adobe Illustrator because I wanted to explore bold, curvy and graffiti-like forms in my typeface design.
Figure 1.4 Chosen Sketch (28/10/24)
Form Development
My intention was to create a typeface that looks like the surface of ocean tides.
Figure 1.7 Ocean tide (03/11/24)
Figure 1.8 Form of "g" and "d" (First version) (11/11/24)
Then I tried making alternative letterforms for "g" and "d" using the same structure as the rest of the letters. This version achieves greater cohesion with the rest of the typeface and also offers a smoother and more natural transition between the characters so I chose to continue with this version.
Figure 1.9 Form of "g" and "d" (Second version) (18/11/24)
Figure 1.11 Form development for some other letters (25/11/24)
Figure 1.12 Final typeface design (25/11/24)
I named my typeface "Tide" because it resembles the forms of the ocean tides. Its wiggly forms suggest a sense of liquidity, tying it to the ocean. The organic form shows a bit of my playful personality and my love for challenges and freedom. I wanted people to feel a sense of freedom when they see this typeface, just like surfing on the ocean.
Process in Font Lab 7
Next, I imported my typeface designs from Adobe Illustrator into Font Lab 7. I adjusted the side-bearings of each letter based on the lowercase side-bearings table provided by Mr. Vinod. Following that, I fine-tuned problematic letter pairs through kerning. This process significantly improved the overall balance and harmony of my typeface.
Figure 1.13 Kerning Tab in Font Lab 7 (02/12/24)
Figure 1.14 Side-bearings Table (02/12/24)
Poster Design
Once I exported and installed my font, I started to create the A4 poster in Adobe Illustrator.
I decided on this as the final design because I like how the sentence "design the endless ocean tidesssssssss..." aligns with its meaning. The ellipsis at the end, along with the repeating "s"s, represents the endless nature of the ocean. I chose black for the background to give the sense of exploring deeper into the ocean, where it gets darker the further you go, never truly ending.
Figure 1.16 Final Poster (16/12/24)
Figure 1.17 Screen Grab (side-bearings) (16/12/24)
Figure 1.18 Final Type Construction (JPEG) (16/12/24)
Figure 1.19 Final Type Construction (PDF) (16/12/24)
Figure 1.21 Final Poster (PDF) (16/12/24)
Font Tester
Try out the font by typing some words below (t h e d s i g n c o l a , . ! #)
FEEDBACK
Task 3: Type Design & Communication
Week 9 (18/11/2024)
General Feedback: Maintain consistency across letterforms, punctuation marks shouldn't look flamboyant. letter S smaller on the top and bigger at the bottom and its top leans to the left side.
Specific Feedback: Looks fine, but try use back "o" to develop "g", to maintain consistency.
Specific Feedback: Looks fine, but try use back "o" to develop "g", to maintain consistency.
Week 10 (25/11/2024)
General Feedback: Try not to give a very decorative look to punctuation marks.
Specific Feedback: Everything's good. Proceed with Fontlab 7.
Specific Feedback: Everything's good. Proceed with Fontlab 7.
Week 11 (02/12/2024)
General Feedback: Consider the counterform, maintain consistency.
Specific Feedback: Proceed to Fontlab.
Specific Feedback: Proceed to Fontlab.
General Feedback: Sentence doesn't have to make sense, can repeat the sentence. Font Name, Name and Year must be 8pt and univers roman, poster must be grayscale.
Specific Feedback: My fonts in fontlab had too many kernings, should adjust the side bearings first.
Week 13 (16/12/2024)
General Feedback: Final E-portfolio must have all 3 tasks' final outcomes, upload hyperlink to each task's e-portfolio. Task 3 E-portfolio: Post in sequence following teams' instruction.
Specific Feedback: Good, proceed to submission.
REFLECTION
Experience
Creating my own font felt like such a special process because I now understand how many different aspects need to be considered. From proportions to overall consistency, it’s all so important. Designing my own typeface was definitely something fresh and fun, and it inspired me to finish the rest of the letters. I hope to use this font in my future work and see it come to life in new ways.
Observation
While working on a typeface with organic letterforms, I noticed that introducing variation between individual letters is significantly more challenging than designing letters with a uniform structure. Each variation affects the counterforms, which in turn impacts the balance and harmony of the entire typeface. Finding ways to compromise and harmonize the spaces between and within letters is essential to achieve a cohesive design.
Findings
I've found that type design is about more than just creating individual letters, it’s about how they work together. Some letter pairs may look fine on their own, but when combined with others, the differences in their counterforms can cause visual imbalances. Using a consistent structure across the typeface is crucial for maintaining even counterforms and ensuring smooth transitions between letter pairs. This taught me how important it is to maintain a unified approach in the overall design process.
1. A Type Primer by Kane J., 2002
Figure 2.1 A Type Primer by Kane J., 2002. [Front Cover]
Grid Systems (pg177-pg212)
This chapter delves into the significance of the grid system, a powerful tool for organising and enhancing the clarity of text. When applied effectively, it can also amplify the meaning of the texts.
It explained how organising the elements according to rows can establish consistent vertical rhythms, bringing a cohesive order to the design. Additionally, it emphasises the importance of letting the grid adapt to the specific needs of the content to ensure a more tailored and effective layout.
Figure 2.2 Grids at large scale
Figure 2.3 demonstrates how a grid not only organises the composition but also establishes a clear hierarchy. The title, representing a higher level of hierarchy, occupies a larger number of grid boxes, while elements of lower importance occupy smaller spaces. This approach keeps the abundance of information neatly aligned, creating a design that is visually structured, highly legible, and notably tidy.
Figure 2.4 Images within grid system
Understanding the concept of the grid system has been really useful to me. The grid system doesn’t just serve as a tool for alignment to improve tidiness and legibility, it also acts as a basic framework that helps designers jumpstart their layout designs. One of the things I really like about the grid system is how it reveals the scale and ratio of the spacing measurements (can't be easily measured by the naked eye), it will definitely aid me in creating more balanced and precise layouts with greater efficiency.



.png)
















.png)

Comments
Post a Comment