12/11/2024 - 17/12/2024 (Week 8 - Week 13)
Typography / Bachelor of Design (Honours) in Creative Media
Task 3 - Typeface Design & Communication
JUMPLINKS
LECTURES
There are no lectures.
INSTRUCTIONS
PRACTICAL
Task 3: Typeface Design & Communication
Week 7
1. Dissecting Letters
For task 3, we were assigned to dissect a few letters; H, o, g, and b. We
had to use one of the 10 fonts that were given to us earlier. I have
chosen to dissect these letters using the Futura Std Light typeface.
Fig. 2.1.1, Dissecting letters on Adobe Illustrator, (05/11/24)
Here's the final dissected letters (H, o, g, b) from the typeface Futura
Std Light:
Fig. 2.1.2, H, o, g, b, dissected, (05/11/24)
After dissecting the four letters, I have gained a few observations on
each of the individual letters.
H: The vertical and horizontal strokes in the "H" are consistent in
weight, reflecting Futura's focus on geometric precision. The straight,
clean lines convey stability and modernity.
o: The "o" is a perfect circle, showcasing the geometric foundation of
the typeface. Its curves are smooth and balanced, with no visible
stress or deviation.
g: The "g" in Futura is a single-story design, which is simpler and more
geometric compared to the double-story "g" in other typefaces. Its
rounded and closed-loop descender aligns with the circular forms found
throughout the typeface.
b: The "b" combines a straight vertical stem with a rounded bowl,
maintaining consistent stroke weights. The curve of the bowl mirrors
the geometry of the "o."
2. Sketches
During this week, we had to hand draw our fonts on A4 graph paper with the
3 markers that possess point sizes that are 3.0 / greater than 3.0. We had
to write the letters "H," "O," "G," and "B," in 3 different writing styles,
both in uppercase and lowercase form.
Fig. 2.2.1, Trials and errors of the initial h, o, g, b sketches,
(08/11/24)
After a lot of trial and error, I ended up with these three
typefaces:
Fig. 2. 2. 2, Initial sketches of the three typefaces (scanned),
(08/11/24)
After deciding on which one we want to digitalize and finalize,
we had to write the final letters and punctuations before digitalizing
them on Adobe Illustrator.
Letters: o, l, e, d, s, n, c,
h, t, i, g; punctuations: , .
! #
Here are the final sketches that I have made:
Fig. 2. 2. 3, First final sketches of the letters and punctuations,
(08/11/24)
I didn't feel fulfilled and I felt like there were still some room for
improvement and I thought that the initial final sketches were messy so
after receiving feedbacks regarding my initial sketches, I decided to
revise the sketch and I also added a few more letters: "a," "r," and
"u."
Fig. 2. 2. 4, Final sketches of the letters and punctuations,
(11/11/24)
Week 8
3. Digitalization
After choosing our final font, we had to digitalize them on Adobe
Illustrator. We had to use the pen tool to draw our typeface and we utilized
the knife, shape builder, and pathfinder tool to make the shapes of the
typeface more precise and clean.
Before I started creating my font on Adobe Illustrator, I watched Mr.
Vinod's tutorial on YouTube and followed through by making a 500 × 500 box to match the words "T," "y," and "d." We had to do this in order to determine the x-height, ascender height,
cap height, baseline, and the descender height.
Fig. 2. 3. 1, Creating guidelines, (12/11/24)
In making the fonts, I mainly used the rectangle tool to create the stems
and the basic shapes. I also heavily relied on the curvature tool to
create the rounded edges on each one of the letters. I tried to be
consistent in creating each letters so I tend to reuse parts of existing
shapes; combining them with the new shapes to create a new letter using
the pathfinder and shapebuilder tool.
Fig. 2. 3. 2, Final result, (19/11/24)
Fig. 2. 3. 3, Final result with grid, (19/11/24)
Fig. 2. 3. 4, Final result (PDF), (19/11/24)
Week 11
Before uploading my finished font to Fontlab 7, I measured all the
key imaginary lines, (baselines, ascenders, descenders, and x-heights), and made optical adjustments to ensure consistent proportions and
balance across the typeface.
Fig. 2. 3. 5, Final font measurements, (03/12/24)
Ascender height: 740pt
Cap height: 699pt
x-height: 500pt
Baseline: 0pt
Descender line: -225pt
After doing so, I also entered the measurements into Fontlab 7.
Fig. 2. 3. 6, Entering the font measurements into Fontlab 7,
(03/12/24)
Next, I adjusted the side bearings for each letter and punctuation
mark, following the guidelines provided on Microsoft Teams.
Fig. 2. 3. 7, Sidebearings adjustments and measurements on
Fontlab 7, (03/12/24)
Week 12
4. A4 Poster
We were assigned to create an A4 Typography
Poster with the font that we have created.
With limited characters, I decided to use the phrase: "design a light,
ignite a soul."
Here are a the few layouts for the poster that I have made:
Fig. 2. 4. 1, Initial poster layouts, (10/12/24)
After further consideration and feedback, I decided to choose the
second one as my final poster.
Fig. 2. 4. 2, Final A4 poster, (10/12/24)
Fig. 2. 4. 3, Final A4 Poster (PDF), (10/12/24)
FEEDBACK
Week 9:
General Feedback:
We will have to continue on digitizing our fonts. Ms. Vitiyaa checked
on our hand-drawn fonts on our graph papers and gave feedback on the
digitalized versions of our work.
Specific Feedback:
The edges of the letters aren’t too similar with the ones on the
sketch. It could be improved.
Week 10
General Feedback:
We will have to work on our Task 3 blog for today; Ms. Vitiyaa
also said that we should look at our friends feedbacks to further
improve our e-portfolio, we will have to continue on perfecting
our digitized fonts for today as well.
Specific Feedback:
Ms. Vitiyaa checked both of my e-portfolios for Task 1 and Task 2.
The e-portfolio for Task 1 has been tidied up and looks okay and the
Task 2 blog is also okay. She told me to try to tidy up the
thumbnails of the blogs and make them the same sizes to make them
look neater.
Week 11
General Feedback:
Ms. Vitiyaa told us to put our finished font(s) into Fontlab. If we
already did that, we were told to start working on the A4 poster that
is also required for the Week 13 submission.
Specific Feedback:
The font looks okay; the poster layout should be tidied up
more.
Week 12
General Feedback:
Ms. Vitiyaa told us that we are going to be submitting our final work
the next week on Week 13. She told us that the blog should be done by
then and to re-check all of the media and embed files on our blog
using incognito mode.
Specific Feedback:
Ms. Vitiyaa told me to change the alignment of the poster since it is
still a bit all over the place.
REFLECTIONS
Experience
I gained hands-on experience in designing fonts using Adobe
Illustrator, specifically utilizing tools like the Shape Builder and
Pathfinder to create consistent and clean letterforms. Additionally, I
worked on refining sidebearings and preparing the font for use in
FontLab 7, which allowed me to make the font fully functional and
downloadable.
Observation
Throughout the process, I noticed how crucial precision and
consistency are in font design, particularly in ensuring that all
characters align seamlessly. Using tools like Shape Builder and
Pathfinder made it easier to achieve uniformity across the characters.
The importance of sidebearings in maintaining proper spacing between
letters became evident as I polished the font.
Findings
I discovered that the combination of Adobe Illustrator and FontLab 7
provides a powerful workflow for creating professional fonts. Tidying
up sidebearings significantly improves the overall appearance and
readability of the text. The final result was a custom font that I
successfully applied to my A4 typography poster, showcasing both its
functionality and visual appeal.
FURTHER READING
The Elements of Typographic Style (Second Edition) by Robert
Bringhurst
The Elements of Typographic Style by Robert Bringhurst by Robert
Bringhurst is a guide to the art and craft of typography, blending
technical instruction with philosophical insights.
Bringhurst emphasizes clarity, harmony, and the seamless integration
of typography with content. He covered typeface selection,
proportional systems like the Golden Ratio, white space, and the
technical details of letterforms, spacing, and alignment, offering
practical advice in creating readable and elegant designs. He showed
how to dissect letters individually and elaborated about the
importance of shapes in letters.
The book also explored typography's cultural and historical
dimensions, stressing its role as a mediator between the author and
the reader. Bringhurst argued that great typography is invisible,
enhancing the text without any distractions. He encouraged designers
to respect tradition while innovating thoughtfully, making this book
an essential resource for anyone seeking to master the craft of
typography.
Additionally, Bringhurst underscored the importance of typography as
a tool for storytelling, where every typographic choice contributes to
the narrative's tone and impact. He advocates for precision and care
in every detail, from the arrangement of characters to the structure
of pages, reminding typographers that their work shapes how readers
engage with and interpret the written word.
Typographic Design: Form and Communication (Sixth Edition) by Rob
Carter, Philip B. Meggs, Ben Day, Sandra Maxa, and Mark Sanders
Typographic Design: Form and Communication (Sixth Edition) by Rob
Carter, Philip B. Meggs, Ben Day, Sandra Maxa, and Mark Sanders is an
in-depth textbook exploring the fundamentals, history, and application
of typography in design.
The book is divided into sections that progressively build the reader's
understanding of typography. It starts with the anatomy of typography,
discussing elements like x-height, serifs, ascenders, and descenders,
followed by a classification typefaces, including Old Style,
Transitional, Modern, and Sans Serif. The text offers detailed
explanations of type families and their historical and cultural
significance.
The book explores typographic principles such as hierarchy, legibility,
and readability, offering guidance on layouts with grid systems to
ensure organized and balanced designs. It showcases examples across
print and digital media, incorporating exercises to reinforce key
concepts. Later chapters delve into typography's role in visual
communication, its ability to convey mood and meaning, and the impact of
technological advances like variable fonts and responsive design.
Ethical considerations, including accessibility and cultural
sensitivity, are also addressed, making this richly illustrated guide a
valuable resource for all designers.
.png)
.png)
Comments
Post a Comment