Typography | Task 3: Type Design and Communication
-14/11/2025 - 14/12/2025/(Week 8 - Week 12)
-Takeguchi Shunta/0386416/Bachelor of Design in Creative Media
-Typography
-Task 3: Type Design and Communication
TABLE OF CONTENTS
LECTURES
All lecture session summaries can be found at https://shuntatakeguchi.blogspot.com/2025/09/typography-task-1-exercises.html,
https://shuntatakeguchi.blogspot.com/2025/09/typography-task-2-typographic.html
INSTRUCTION
PROCESS WORK
Research
Type dissection
I chose Futura and conducted a dissection of the types H, o, g, b.
The bowl of 'g' was difficult to trace the curve, so it looked
messy in the end.
|
| Dissection of H |
|
| Dissection of o |
|
| Dissection of g |
|
| Dissection of b |
I learned that in the 'g', there is a horizontal line between
the bowl and the link. We can also see that in the 'b',
between the stem and the bowl.
Another thing I learned is that the ascender of the 'b' is
higher than the cap-height of the 'H'.
Ideation
I started by sketching my type design ideas for 5 types:
'O' 'L' 'S' 'N' 'G'. I want to make a bold and simple type
design, so I chose to sketch the uppercase types.
The first sketch, my concept was half-circles. I tried to
input a circle shape or multiple according to the type. I
liked the 'L' design since it is simple and expresses the
beauty of half-circles. But for others, I could not create creative half-circle designs.
Type design sketch 1
The second design concept was triangles. Just like the
previous design, but this time triangles.
I tend to install triangles at the ends of lines to make them
look organized, although it makes them a bit boring
design.
Type design sketch 2
Type design sketch 3
During the consultation with Mr. Max, he suggested that the
second triangle design could work, but it needs to be refined
further. The work after the consultation is below. I focused
on the idea of triangles and spacing. I could assign a sense
of unity to all the types with this design. 'L', 'E', 'D',
'C', and 'G' are my favorite designs; they all have a
rectangular shape stem on the left, and the other parts on the
right are expressed by triangles mainly. They look minimal but
also luxurious.
Type design sketch 4
However, Mr. Max advised that
- 'S' and 'N' are not readable enough
- 'I' would improve by placing triangles for the top and
bottom
- A comma should be added with the same design as a full stop
- Hashtag needs a better design to match others
The reworked design is below. I could conceive a nice idea of
'N', which uses the diagonal edges of triangles.
Type design sketch 5
But the 'S', 'N', and hashtag still could not get approval, so
Mr. Max shared his idea, which is below. All types focus on
the concept of spacing here.
Type design sketch 6
I moved to the digitalization process in Illustrator. It was
quite easy since my design only has simple shapes without
curves. I tried to use the same size triangles, but for some
types, I had to make adjustments; for example, I had to make
the triangles of 'D' smaller to make it readable and look
stylish.
For Digitalization 1, I forgot to set the width of the
alphabet to the same value. So, Digitalization 2 is a rework
with the same width for each type.
Digitalization 1
Digitalization 2
I also took care of the space between shapes during the
digitalization process. I made a blue stroke rectangle and
used it to make the space equal in the types. The screenshot
below is a space adjustment for the types that have a vertical
line on the right, such as 'L', 'E', and 'D'. You can see the
blue rectangle in the screenshots if you click or zoom
in.
Space adjustment 1
In the two screenshots below, I used another rectangle to
adjust the space for 'N', 'H', and 'T'.
Space adjustment 2
Space adjustment 3
Digitalization work
The FontLab process had two main parts: importing the design and
setting the side bearings and kerning. Importing the design was
simple, although the kerning process was a bit time-consuming.
Needed to look at the types from a distance and try different
amounts of kerning.
FontLab screenshot
Final outcome
The type download link(https://drive.google.com/file/d/1Dvs1EW-l9NEclvXLlAruBU4TVOCKABjj/view?usp=sharing)
Initial type design sketch
FontLab screenshot
FontLab screenshot 2
Final artwork in Illustrator(JPEG)
Final artwork in Illustrator(PDF)
Final poster with triangle type(PDF)
Type tester
FEEDBACK
Week 8
General Feedback: Introduction to task 3.
Specific Feedback: None.
Week 9
General Feedback: How to conduct task 3A dissection.
Specific Feedback: My type design sketch with the triangles
concept is good and original; the other 2 sketches are common.
Need to refine some letters and complete the sketch for all
letters.
Week 10
General Feedback: Instructions for digitalization using
Illustrator.
Specific Feedback: S, N, I, , and # are not readable or not
similar to other designs, so changed to new ideas.
Week 11
General Feedback: Introduction for the FontLab process.
Specific Feedback: All letters need to be the same
width.
Week 12
General Feedback: Consultation of task 3.
Specific Feedback: Punctuation height should be within the
x-height. My poster looks okay.
REFLECTION
Experience
I was excited about this task, as I can create my own type and use it like the one I use every day. However, I struggled and took a long time to come up with designs. I needed to be original and unique, but also take care of readability.
Another tough part of this task was kerning in FontLab. I felt it was difficult to set the kerning just using my visual sensitivity, not numerical value. So after adjusting kerning long time, I started to confuse how much I should kern. I learned that sometimes the kerning process needs others' opinions, since it might be my subjective eye's kerning.
Observations
In the dissection part, I realized that even the simple types like Futura, Univers are designed with every detail carefully considered. The bowls' lines are not drawn by a single or a few circles, but by the combination of many circles to create the solid lines. I felt that font design required both a visual perspective of readability and beauty, and a mathematical perspective of smoothness and uniformity of lines or shapes.
Findings
I learned that writing types with a pen is easy, but designing them takes a lot of effort. Types also come in a variety of shapes. For example, 'S' is made up of almost all curved parts, so I had to think about how to design the letter while maintaining uniformity in my design. Also, when it is designed like mine, which are not simply represented by lines, I had to be careful about what elements of each type would allow people to recognize them. In the design created for this task, it seems possible that the 'S' could be mistaken for an 'N'. Perhaps it could be improved by adding some elements to make it more recognizable as an 'S'.
FURTHER READING
bold or italic(https://practicaltypography.com/bold-or-italic.html)
This website explains how we should practice bold and italic
in typography work. I use bold and italic in most of my work
so far, especially this e-portfolio. I use them mostly for
emphasizing. But I did not know that italics in the sans-serif
typefaces do not really stand out enough to emphasize as this
website exposition. I want to use proper bold and italic from
now, when I want to highlight heavily, using bold, and
highlight gently, using italic.
Typography hierarchy: How to improve readability(https://penpot.app/blog/typography-hierarchy-how-to-improve-readability/?utm_source=chatgpt.com)
On this website, the writer introduces tips to improve
typography hierarchy on digital devices. I especially liked
the GitHub website example. GitHub uses many pictures or
illustrations that divide the sections, creating hierarchy.
This eliminates the need for long text and also makes it
easier to get an image for the product. I think we do not
often get the chance to use the technique of creating a
hierarchy with photos, but I thought it was an interesting
idea.
Typographic Design Form Communication - Page
36 Optical relationships within a font
This page is dedicated to explaining the small adjustments to
typefaces to make them look more natural. For example,
Horizontal strokes are drawn slightly thinner than vertical
strokes in both curved and straight letterforms. This is to
avoid the horizontals appearing too thick. I could learn that
there is detailed work in the type design process. And thanks
to that, we can read the text smoothly.
Comments
Post a Comment