ADVANCED TYPOGRAPHY / TASK 3: TYPE EXPLORATION & APPLICATION
18/06/2025 - 23/07/2025 (Week 09 - Week 14)
Aveline Kristie / 0372310
Advanced Typography / Bachelor of Design (Honours) in Creative Media / School of Design
Task 3: Type Exploration & Application
TABLE OF CONTENTS
1. Lectures
2. Instructions
3. Tasks
4. Feedback
5. Reflection
1. LECTURES
(No Lectures)
2. INSTRUCTIONS
3. TASKS
1. Ideation Proposal
Before starting to make our font, we were tasked to make a presentation of our three ideas based around our personal interests or our chosen specializations.
I came up with four different ideas, but I chose my second idea as my final decision since it looks the most interesting and quite fun and experimental for me to make.
Fig 3.1 Ideation Proposal, Week 9 (18/06/25)
2. Visual References
.jpg)
Fig 3.2 Visual References, Week 9 (18/06/25)
Since I want my font to have a retro vibe, I made the letters appear
blocky and include pixelated decoration, but not too much. For
uniqueness, I added pixel crumbs to my font. However, to maintain
consistency in the letters and side bearings, I will keep the crumbs
minimal and only place them at the top or bottom of each letter.
3. Sketches
Fig 3.3 Sketches, Week 9 (18/06/25)
For the sketch, I did a rough sketch for some of the letters, and I was
planning to develop the rest from my sketch later when I begin
digitizing.
4. Digitization
After I was satisfied with my sketches, I began digitizing all letters,
numerals, and punctuation in Adobe Illustrator. The artboard height is
1000px, and I used the Myriad font to measure the x-height, baseline,
cap height, ascender, and descender. The x-height is 500pt. First, I
attempted to create all the letters before continuing with the numerals
and punctuation.
Fig 3.4 Font Digitizing Process, Week 10 (21/06/25)
After measuring, I began by making the letters A, H, O, E, and B first,
and continued with the rest afterward to check for consistency and a
balanced look.
Fig 3.5 Font Digitizing Process, Week 10 (21/06/25)
After I finished making the uppercase, I felt that my font would work
better as a unicase letterform rather than having a separate lowercase,
since I aim to use the font for posters, and I feel that lowercase letters
aren't really necessary. I also didn’t really like how the Z looked, as it
seemed unbalanced with the rest, so I revised the Z and replaced some
letters to look like lowercase but in the same size as the uppercase, to
make them unicase.
.jpg)
Fig 3.6 Font Digitizing Process, Week 10 (28/06/25)
Fig 3.7 Font Digitizing Process, Week 10 (28/06/25)
Then, I began to create the numerals and punctuation.
.jpg)
Fig 3.8 Font Digitizing Process, Week 11 (30/06/25)
Fig 3.9 Font Digitizing Process, Week 11 (30/06/25)
However, I didn’t like how the comma and quotation mark looked, as
I felt the tail was too long. So I remade them with a shorter tail
to achieve a better look.
.jpg)
Fig 3.10 Font Digitizing Process, Week 11 (31/06/25)
After the feedback session, Mr. Vinod said that my parenthesis
marks and brackets are too short; they should extend below the
cap-height and above the descender.
.jpg)
Fig 3.11 Font Digitizing Process, Week 11 (02/07/25)
Fig 3.12 Font Digitizing Process Compilation, Week 11
(03/07/25)
.jpg)
Fig 3.13 Font Digitizing Process Compilation, Week 11 (03/07/25)
Final Outcome (Adobe Illustrator)
Fig 3.14 Unicase Letterform Final Outcome, Week 11 (04/07/25)
Fig 3.15 Unicase Letterform Final Outcome, Week 11 (04/07/25)
Fig 3.16 Numerals & Punctuations Final Outcome, Week 11 (04/07/25)
Fig 3.17 Numerals & Punctuations Final Outcome, Week 11 (04/07/25)
5. FontForge
After I was done digitizing my font in Adobe Illustrator, I
transferred it to FontForge. To begin, I go to Adobe Illustrator,
then click Window > Asset Export > choose SVG >
Export.
Fig 3.18 FontForge Process, Week 12 (06/07/25)
Then, I imported everything into FontForge. I set the ascender,
baseline, and descender based on my measurements in Adobe
Illustrator.
Fig 3.19 FontForge Process, Week 12 (06/07/25)
Fig 3.20 FontForge Process, Week 12 (06/07/25)
After finishing the import, I began adjusting the side bearings.
Fig 3.21 Adjusting Side Bearings Process, Week 12 (07/07/25)
Fig 3.22 Adjusting Side Bearings Process, Week 12 (07/07/25)
Fig 3.23 Adjusting Side Bearings Process, Week 12 (07/07/25)
Fig 3.21 FontForge Final Outcome, Week 12 (07/07/25)
Lastly, I named my font and exported it, then installed it so I
could use it to create my font presentation later.
Fig 3.22 FontForge Process, Week 12 (07/07/25)
Fig 3.23 FontForge Process, Week 12 (07/07/25)
6. Font Presentations
After installing my font, I began creating five artworks to
present my font. Since I wanted it to have an arcade pixelated
vibe, I designed the presentation to look like it appears on a
computer screen. Then, to make my artworks stand out, I
applied green and pink colours to enhance the overall look.
Fig 3.24 Font Presentations Process, Week 12 (08/07/25)
Fig 3.25 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.26 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.27 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.28 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.29 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.30 Font Presentations Final Outcome, Week 12 (08/07/25)
7. Font Applications
For the font application, I am planning to use my font for retro arcade
posters and other game-related designs since it is a pixelated font. To
begin, I searched for several mock up images on
https://www.free-mockup.com/ and found a picture of a Nintendo Switch and some posters mock up.
First, I made three posters using my font and tried to make them look
vintage and old.
Fig 3.31 Font Applications Process, Week 13 (14/07/25)
After I was satisfied with the outcome, I placed the posters into
Adobe Photoshop and edited them to fit into the mock up picture.
Fig 3.32 Font Applications Process, Week 13 (14/07/25)
However, since the artboard size is 1024px by 1024px, two posters were
slightly cropped.
Fig 3.33 Font Applications Process, Week 13 (14/07/25)
Fig 3.34 Font Applications Process, Week 13 (14/07/25)
Fig 3.35 Font Applications Process, Week 13 (14/07/25)
Final Outcome
Fig 3.36 Font Applications Final Outcome, Week 13 (14/07/25)
Fig 3.37 Font Applications Final Outcome, Week 13 (14/07/25)
8. Honor Competition
Lastly, for the Honor competition, I wanted to create a fun,
game-inspired vibe for the digital clock design. I experimented with
different clock designs, but the one that looked like a game fit my font
concept the best.
Fig 3.38 Honor Competition Editing Process, Week 13 (15/07/25)
Fig 3.39 Honor Competition Editing Process, Week 13 (15/07/25)
After that, I changed the Honor logo colour in Adobe Photoshop to
make it uniform with the rest of my design.
For the signature, I reused one of my font presentation designs as
the tagline for my font. For the background, I adjusted my numerals
randomly and created a glitched effect.
Fig 3.41 Honor Competition Editing Process, Week 13 (15/07/25)
Next, for the animation, I divided the elements I wanted to animate
into different artboards and exported them as PNG files.
Then, I imported the files into Adobe After Effects and started
animating the clock. I made the changing minutes look like the numbers
were bouncing on a floating dirt before transitioning to the next
minute. I adjusted the position and opacity of the elements in the
keyframes. To make the animation of numbers 7 and 8 appear only inside
the phone, I used the Track Matte tool to crop the animation so they
didn’t show in the background.
After finishing the animation, I exported it in MP4 format and
uploaded it to YouTube.
Fig 3.43 Honor Competition Editing Process, Week 13 (15/07/25)
Fig 3.44 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.45 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.46 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.47 Honor Competition Final Outcome, Week 13 (15/07/25)
9. Type Exploration & Application Final Outcome
Compilation
This font is a retro, pixel-style typeface made to bring back the nostalgic feel of classic arcade games. Its bold, blocky letters and 8-bit look make it great for gaming posters, arcade themes, and designs that need a vintage video game vibe. Inspired by old-school arcade graphics and the Wreck-It Ralph movie poster, this font adds a fun, nostalgic touch to modern projects.
Font Download: https://drive.google.com/file/d/1AjqkaEkf6i0GFII6kUJjwjZ_7nYMsn4H/view?usp=drive_link
Fig 3.48 Font Information, Week 13 (15/07/25)
Fig 3.49 FontForge Screen Grab, Week 12 (08/07/25)
Fig 3.50 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.51 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.52 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.53 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.54 Font Presentations Final Outcome, Week 12 (08/07/25)
Fig 3.55 Font Applications Final Outcome, Week 13 (14/07/25)
Fig 3.56 Font Applications Final Outcome, Week 13 (14/07/25)
Fig 3.57 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.58 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.59 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.60 Honor Competition Final Outcome, Week 13 (15/07/25)
Fig 3.61 Honor Competition Final Outcome, Week 13 (15/07/25)
Font Tester:
Fig 3.62 Honor Competition Submission, Week 13 (20/07/25)
I was unable to submit my artwork for the Honor competition because the 'Standby' category option was not available.
4. FEEDBACK
Week 9
General Feedback: Mr. Vinod explained that when we design a font,
we need to first understand the problem, so we can apply the solution
through the typeface design. He also mentioned that when creating a
font, the artboard size should be 1000px, with an x-height of 500pt.
Specific Feedback: Mr. Vinod said that it is okay if I add the
pixel crumbs into my font, but I need to think more carefully about how
they should appear. For example, whether they should drop down or be
positioned differently, in order to keep the kerning consistent for each
letter. He also reminded me to think about where and how I will apply my
font later on.
Week 10
General Feedback: -
Specific Feedback: Mr. Vinod said that all of
my letters are already good, so I can continue my work.
Week 11
General Feedback: Mr. Vinod said to the
class that when we make punctuation, there are rules we need to
follow. So, we can't just make punctuation randomly without
following those rules.
Specific Feedback: Mr. Vinod said that my
parentheses and brackets are too short, and I must follow the
rules. For the rest, they are already good, and I can continue my
task.
Week 12
General Feedback: -
Specific Feedback: Mr. Vinod said that
both my font and font presentation were well done, so I can
continue working on my font application.
Week 13
General Feedback: Mr. Vinod reminded me not to forget to submit the artwork to the Honor competition.
Specific Feedback: Mr. Vinod said that all of my work were already good.
5. REFLECTION
Experience
In this project, I improved my skill in making my own font from start to
finish. In this module, I wanted to try something new, so I came up with an
idea by making a decorative font. I feel that this can be a new fun
experience for me, since I already have the basic knowledge in making font
from semester 1. It was fun but also challenging, especially when fixing
small details. In the end, I used my font to make artworks with an
arcade-style look, and I felt proud of how everything turned out.
Observations
I noticed that small parts of a font, like how wide or short a bracket is,
can really change how the font looks. When I added pixel crumbs, I learned
that their position matters for the space between letters. I also saw that
making a font is not just about drawing, but it’s about making sure every
letter works well together. Even punctuation needs to follow design rules to
look neat.
Findings
From this project, I found out that designing a font needs both creativity
and structure. I can be creative with shapes and style, but I also must
follow rules to keep everything consistent. Feedback from Mr. Vinod helped
me see what to fix and how to improve. I also learned that thinking about
how the font will be used later is important. This helped me make better
design choices for my font.
6. FURTHER READING
Fig 6.1 "Typographic Design: Form & Communication" by Carter et al (6th Edition).
Basic Principles of Legibility:
The main job of a letter is to help people understand what is written. Because of that, letters must be clear and easy to see. A font is easy to read when it has three main features: strong contrast between thick and thin parts, simple shapes without too much detail, and well-balanced sizes for each part of the letter. Fonts that follow these ideas are usually the easiest to read.
To make good typography, designers need to think about how and where the text will be used. Small changes, like fixing the space between letters or adjusting their shapes, can make a big difference in how easy it is to read the text.
The Typographic Message:
Typography is like a visual language. It’s a way to share ideas by using letters in a powerful and meaningful way. It can be used to teach, convince, explain, or entertain people.
The message we send through typography depends on our choices, like which font we pick, how big or small the letters are, their style, spacing, and how everything is arranged. All of these choices work together to send a message that people can see, read, and feel.
Comments
Post a Comment