Advanced Typography - Task 3: Type Exploration and Application

17.11.2025 - 16.12.2025（Week 9 - Week 12)
Lee Xiang Ling / 0384095
Advanced Typography / Bachelor of Design (Honours) in Creative Media / Taylors University
Task 3 / Type Exploration and Application

LIST / JUMPLINK

Final Outcome

LECTURES

All lectures have been completed. — Click Here (Lecture 1 - 4) & Click Here (Lecture 5)

INSTRUCTIONS

EXERCISES

In this task, we are required to integrate and apply the typographic knowledge and practical skills acquired from previous assignments to develop a complete typeface, including selected punctuation marks.

The typeface can be created using one of the following approaches:

Designing a typeface intended to address a specific problem or support an area of personal interest, such as graphic design, animation, new media, or entertainment design. The final outcome will be a fully generated font file with applications.
Analysing an existing letterform by examining its structure and usage, identifying areas for improvement, and proposing enhancements that add value to the original design, resulting in a newly generated font.
Conducting experimental typographic exploration that is original and unique, potentially involving three-dimensional forms, digital augmentation, or cross-media approaches. The final outcome is defined by the student.

At the initial stage of the design process, we established the overall design direction and concept, followed by sketch development and mood board creation. All ideas, visual references, and sketches are compiled and presented in the following slides.

This is my slides:

Task 03 Type Exploration and Application_Canva Slide, Week 09 (18/11/2025)

After receiving feedback from Mr. Vinod, I further reflected on my design direction and ultimately decided to develop a typeface inspired by city silhouettes as the main concept for Task 3.

My Research

To better develop this typeface, I began by researching a wide range of typefaces related to pixel, bitmap, and modular design as visual and structural references, in order to establish the fundamental letterform of the typeface.

Fig. 1.1. - The Typefaces sample that I researched_JPEG, Week 09 (20/11/2025)

In addition, I collected and analysed various city silhouette visual references to inform the composition and outline of the letterforms, strengthening the visual connection between the typeface and urban imagery.

Fig. 1.2. - The City silhouette sample that I researched_JPEG, Week 09 (20/11/2025)

My Process

After systematically researching and analysing the relevant references, I began developing the basic letterforms of the typeface. During the design process, I utilised Illustrator’s grid system as the primary construction method, using square modules as the fundamental building units to establish a clear and consistent structural framework.

I first defined the core skeleton of each character, such as the main vertical strokes, horizontal structures, and key turning points, before gradually adjusting the number and arrangement of modules to create layered forms and contours inspired by city silhouettes.

Fig. 1.3. - Basic Font_JPEG, Week 09 (22/11/2025)

During the development process, multiple iterations were explored for selected letters, numerals, and punctuation marks. The characters highlighted in red represent early experimental versions that were later discarded for the following reasons:

B - In the red version, the bowl proportion was too large, creating a heavy appearance. The top module followed the enclosed structure of the red “O”, which was later revised to a single-sided module for consistency.

Fig. 1.4. - Adjustment of letter B_JPEG, Week 09 (22/11/2025)

O - In the red version, the top initially used a centered module, which appeared inconsistent with the rest of the typeface. It was later revised to a single-sided modular structure for overall consistency.

Fig. 1.5. - Adjustment of letter O_JPEG, Week 09 (22/11/2025)

Z & z - During the design of this letter, representing diagonal strokes within a modular system was a key challenge. As a result, three variations of Z were explored, and the version that achieved the best balance between structural stability and visual harmony was selected.

Fig. 1.6. - Adjustment of letter Z_JPEG, Week 09 (22/11/2025)

a - Two forms were explored for the lowercase a, including a print-style version (red) and a handwritten-style version (black). As the print-style version showed slight imbalance in visual weight, the handwritten-style version was selected.

Fig. 1.7. - Adjustment of letter a_JPEG, Week 09 (22/11/2025)

Number - For the number design, two versions were explored, with and without corner breaks. After comparison and consideration, the version with corner breaks was selected as it better aligns with the modular structure and overall visual style of the typeface.

Fig. 1.8. - Adjustment of number_JPEG, Week 09 (22/11/2025)

! / ? - The exclamation mark and question mark were initially designed based on the size of the period. However, proportional imbalance was observed in use, so their height was reduced by half to achieve better visual balance.

Fig. 1.9. - Adjustment of the exclamation mark and question mark_JPEG, Week 09 (22/11/2025)

After completing the basic type design, I proceeded to the city silhouette development stage. For this section, I explored and organised several window silhouette variations that could be applied to the type system.

Following feedback from Mr. Vinod, adjustments were made to standardise the width of all window silhouettes, enhancing visual consistency and structural coherence across the design (red indicates the initial version, black indicates the revised version).

Fig. 1.10. - Adjustment of the window silhouettes_JPEG, Week 10 (28/11/2025)

I then gradually integrated the window silhouettes into the developed letterforms, refining the type through merging and extension.

To further emphasise the architectural quality of the typeface, additional elements such as rooftops and lightning rods were introduced at the top of selected characters, enhancing the resemblance to urban building silhouettes.

Fig. 1.11. - The font after additional elements_JPEG, Week 11 (1/12/2025)

Fig. 1.12. - My Final Font Design_JPEG, Week 11 (5/12/2025)

To ensure smooth import into FontLab and maintain consistent glyph size and proportions, grids and guidelines were used to align and standardise all glyphs prior to import, in accordance with font production standards.

Fig. 1.13. - The process before imported into Fontlab_JPEG, Week 11 (7/12/2025)

Next, all completed glyphs were imported into FontLab, where initial spacing adjustments were made according to the kerning guidelines provided by the lecturer.

Fig. 1.14. - Kerning Format_JPEG, Week 12 (10/12/2025)

Following this, further refinements were carried out through continuous observation and comparison of different letter combinations to improve overall balance and legibility.

Fig. 1.15. - Process in FontLab_JPEG, Week 13 (15/12/2025)

As the typeface is inspired by city silhouettes, it is named Nightscape City Font. This is a display typeface built around the concept of urban nightscapes, aiming to express the layered structure, rhythm, and atmosphere of a city at night through its letterforms.

For the font presentation, this concept served as the starting point. The letters were arranged side by side and layered using varying levels of opacity to create a sense of depth, resembling a city skyline. Colours inspired by city lights were added as accents to further enhance the visual impression of a nighttime urban environment.

Fig. 1.16. - Process of Font Presentation, Week 13 (16/12/2025)

Fig. 1.17. - Font Presentation's colour board, Week 13 (16/12/2025)

Fig. 1.18. - My Font Presentation, Week 13 (16/12/2025)

For the Application, as Nightscape City Font is conceptually rooted in urban culture and nighttime cityscapes, its usage is primarily focused on city-related visual design contexts. Initially, the typeface was envisioned for applications such as posters, books, and exhibition banners, where strong visual impact is essential.

During the development of this project, I happened to be in a design-oriented bookstore and began observing the visual language of the products displayed. Inspired by this environment, I refined the application direction and selected the following five outcomes:

Coffee cups
Small souvenir gift boxes
Billboards
Book covers
3D memo pads

These applications are closely connected to everyday urban experiences, allowing the typeface to function not only as a display font but also as a visual element embedded within city life and cultural spaces.

For the colour palette, I first considered the overall atmosphere of the typeface. Blue and purple—commonly used in night-time illustrations—were selected as the primary colours, complemented by black, yellow, and white from the font presentation to maintain visual consistency.

Fig. 1.19. - Font Application's colour board, Week 13 (16/12/2025)

For the font application, Photoshop was used as the primary tool to develop the visual outcomes. However, when working on the 3D memo pads application, I encountered challenges in translating the flat typographic design into a three-dimensional form.

During this problem-solving process, a new idea emerged—to experiment with ChatGPT as a creative support tool, exploring alternative approaches to visualising the typeface in a three-dimensional context.

I first designed the basic form and structure of the sticky note using Illustrator, then utilised ChatGPT to generate a conceptual visual to explore how the typeface could be represented in a three-dimensional space, serving as a spatial reference sample.

Fig. 1.20.&1.21. - The Picture I Used in Chatgpt, Week 13 (16/12/2025)

Intruction: I want to use this picture( (left) to do a 3D memo pads application (likes right picture), none background. With some light from window.

Fig. 1.22. - Screen Shot in ChatGPT, Week 13 (16/12/2025)

The final outcome was refined in Photoshop to ensure consistency with my original design intent and visual language.

Subsequently, I used Photoshop to further refine and adjust the generated image by enhancing selected details and adding background elements, while ensuring that the visual focus remained on the sticky note itself. As certain areas were difficult to modify without compromising the overall composition, these parts were intentionally retained in their original state rather than being overworked.

Fig. 1.23. - Process in Photoshop, Week 13 (16/12/2025)

After receiving feedback from Mr. Vinod, I realised that I had placed too much emphasis on the visual design of the book cover, while overlooking its primary function of communicating information to readers. I then studied and analysed various book cover structures and typographic layouts, and made significant revisions to the original design to ensure that it balances visual appeal with clear and effective information delivery.

Fig. 1.24. - The book cover's application, Week 13 (16/12/2025)

Fig. 1.25. - The book cover's application after adjustment, Week 13 (18/12/2025)

Fig. 1.26. - My Font Application, Week 13 (18/12/2025)

-- Back To Top --

My Final Outcome

This is my font: Nightscape City Font Regular

Font Information_TTF File, Week 12 (14/12/2025)

Fig. 2.1. - Final Outcome - Nightscape City Font_JPEG, Week 12 (15/12/2025)

Final Outcome - Nightscape City Font_PDF, Week 12 (15/12/2025)

Fig. 2.2. - FontLab Screengrab_JPEG, Week 12 (15/12/2025)

Fig. 2.3. - Font Presentation 01_JPEG, Week 12 (16/12/2025)

Fig. 2.4. - Font Presentation 02_JPEG, Week 12 (16/12/2025)

Fig. 2.5. - Font Presentation 03_JPEG, Week 12 (16/12/2025)

Fig. 2.6. - Font Presentation 04_JPEG, Week 12 (16/12/2025)

Fig. 2.7. - Font Presentation 05_JPEG, Week 12 (16/12/2025)

Fig. 2.8. - Font Application 01_JPEG, Week 12 (16/12/2025)

Fig. 2.9. - Font Application 02_JPEG, Week 13 (18/12/2025)

Fig. 2.10. - Font Application 03_JPEG, Week 12 (16/12/2025)

Fig. 2.11. - Font Application 04_JPEG, Week 12 (16/12/2025)

Fig. 2.12. - Font Application 05_JPEG, Week 12 (16/12/2025)

Final Outcome - Font Presentation and Application_PDF, Week 12 (16/12/2025)

-- Back To Top --

FEEDBACKS

Week 9

General Feedback: Design should prioritize client needs, not personal preference. Its core is problem-solving, not form. After confirming the direction, complete all uppercase letters this week following the grid system.

Specific Feedback: The second concept doesn’t highlight its intended elements clearly, while the third design requires further reference and research. Which idea to choose ultimately depends on the specific need you aim to address.

Week 10

General Feedback: The font design process must stay consistent in style and elements. Avoid using existing fonts or heavily referencing them. Keep the full design process, including sketch progress and form adjustments.

Specific Feedback: Adjust the size of the silhouetted windows to ensure consistency in the overall width and height.

Week 11

General Feedback: Refine the letter spacing using O and H as references, adjusting other letters by similarity.

Specific Feedback: Overall, the work is good. Even numbers and symbols are artistic.

Week 12

General Feedback: Provide feedback and explain important points regarding Font Presentation and Font Application.

Specific Feedback: Pay attention to the letter spacing, and continue.

Week 13

General Feedback: This assignment deadline has been extended until next week. Time management is required, and Task 4 on Blogger should be completed accordingly.

Specific Feedback: For the book cover application, the book title should remain the primary visual focus rather than the design itself, and greater attention should be given to typographic layout and composition.

-- Back To Top --

REFLECTIONS

Experience

This assignment provided me with a memorable learning experience, as I went through the complete process from concept development and letterform construction to font production and final application. The process was not only systematic but also engaging and enjoyable. The task offered a high degree of creative freedom, allowing me to design within established rules while continuously refining my work based on the lecturer’s feedback.

One of the main challenges throughout the project was the need to rely heavily on my own judgment when making design decisions, which encouraged more independent and critical thinking. In addition, while developing the 3D memo pads application, I experimented with AI-generated imagery as a supporting tool, integrating it with Illustrator and Photoshop. This helped me gain a clearer understanding of the roles different tools play within the overall design workflow.

Observation

During the design process, I realised that overall consistency is more important than the aesthetics of individual letterforms, as minor proportional or modular differences become amplified in layout. I also observed that rounded and angular forms require different spacing adjustments. At the application stage, I found that display typefaces rely on a clear visual context, where integrating urban nightscapes and architectural silhouettes enhances both narrative quality and recognisability.

Findings

Through this assignment, I gained a deeper understanding that a typeface is not merely a system of letterforms, but a visual language that requires appropriate media and context to fully express its value. I also realised that AI tools should function as supportive aids rather than dominant creators, as their strength lies in accelerating conceptual exploration while final visual decisions and integration remain the designer’s responsibility. Overall, this experience contributed significantly to my development in both type design and application thinking.

-- Back To Top --

XiangLingLee (0384095)

Search This Blog