Typography - Task 2: Typographic Exploration and Communication
26.5.2025-8.6.2025/( week6-week7)
YANG SHUO / 0384037
Typography /Bachelor of Design (Hons) Creative Media / Taylor's University
Task 2: Typographic Exploration and Communication
LECTURES
week5
Typo_5_Understanding
1. Understanding letterforms
The forms of uppercase letters are actually not symmetrical. Their stroke forms can have two different stroke thicknesses. More notably, each bracket that connects the serifs to the stem has a unique curve.
The capital letters look visually symmetrical, but the left slope is
slightly thinner than the right .
|
| Figure.1.1 Baskerville vs Univers 'A' (20 May/W5) |
|
| Figure.1.2 Helvetica vs Univers 'a' (20 May/W5) |
Note: Novice designers should avoid designing fonts that are too
decorative and ignore readability.
2. Maintaining x-height
Figure 1.3 Maintaining x-height (20 May/W5)
Counterform (or counter)—the space describes, and often
contained, by the strokes of the form. When letters are combined into
words, the spaces between and around them—known as counterforms, is
really important. The way these spaces are handled affects how well the
words flow together and how easily we can read the text.
The design principle of Contrast is also applied in typography.
|
|
Figure.1.5 Contrast (20 May/W5) |
INSTRUCTIONS
TASK 2
Text Formatting and Expression
Task 2 requires us to design a 200×200mm two-page layout based on the English
text provided, use InDesign to complete the text arrangement, the title can be
designed in Illustrator, no images or colors are allowed, but basic graphic
elements such as lines and shadows are allowed to be added moderately.
First, I read the given text and chose the second one –Punk's Design Revolution: Breaking the Rules. For this theme, I wanted to design the headline with a strong font and
eclectic typography.
I sketched on Procreate.
|
| Figure 2.1 Screenshot of the sketch(26 May/W6) |
Next, I made it on Adobe Illustrator. I tried two different compositions.
|
|
Figure 2.2 Headline 1
|
|
|
Figure 2.3 Headline 2
|
|
|
Figure 2.4 Screenshot of the process
|
|
|
Figure 2.4-2.6 Layouts
|
I consulted the professor about feedback on the revisions during the online
meeting. My assignment still has some major issues. The word 'punk's' in the
title uses the Gill Sans font, which is not punk style and lacks personality.
Therefore, I changed the font of 'PUNK' from Gill Sans Std to Futura Std
because I feel it looks more modern and sharper. At the same time, I made some
design changes to the arrangement of the letters, as shown in the image.
|
|
Figure 2.7 Redesigned headline
|
Besides , the line length in my body text is too short. I need to rethink the layout and find ways to highlight personality. Therefore, I abandoned the plan of dividing the text into three columns and reduced the font size to ensure that the number of characters per line is about 50.
I divided the title into two parts and placed them on the left and right sides
of the page, creating a diagonal line.
|
|
Figure 2.8 Screenshot of the process
|
The following is the final layout assignment.
|
|
Figure 2.9 Layouts without baseline(jpg.) |
|
(2 Jun/W7) |
|
|
Figure 2.10 Layouts with baseline(jpg.) |
|
(2 Jun/W7) |
| Figure 2.11 Layouts （pdf） |
|
(2 Jun/W7) |
Formatting details
HEAD LINE
- Typeface: Futura Std
- Font/s: Heavy
- Type Size/s: 72 pt
- Leading: 36 pt
- Paragraph spacing: 0
BODY
- Typeface: Univers LT Std
- Font/s: 55 Roman
- Type Size/s: 11 pt
- Leading: 13 pt
- Paragraph spacing: 13pt
- Characters per-line: 51
- Alignment: left justified
- Margins23 mm top,10 mm left + right ，20 mm bottom
- Columns: 2
- Gutter: 10 mm
FEEDBACK
Week6
General feedback： This week, we are having online classes. We
presented the assignment for week five in the meeting. Mr. Vinod
provided feedback on them and pointed out a common issue: the headline
and the body text should be connected to create a visual guide.
Special feedback： My assignment still has some major issues.
First, the word 'punk's' in the headline uses the Gill Sans font, which
is not punk and lacks personality. Secondly, the line length in my body
text is too short. I need to rethink the layout and find ways to
highlight personality.
Week7
General feedback： This Monday is a public holiday, so Mr. Vinod
held a quick online feedback meeting. He provided suggestions for
modifications to our layout work.
Special feedback： In my layout assignment, the design of the
main title part 'PUNK'S DESIGN REVOLUTION' could be more distinctive,
and the subtitle part needs to pay attention to the problem of excessive
white space. The body text part is fine.
REFLECTIONS
Experiences
In Task 2, I need to combine the layout skills learned in Task 1 to
design the layout of a complete text. I have made numerous attempts
for this task, including overturning and rebuilding my ideas.
Achieving a satisfactory overall result is difficult.
Observations
I found that the readability of the text is very important in the
overall layout, as it relates to reading comfort. There should be a
guide between the headline and the body text to achieve text coherence.
This requires designers to have a global awareness and pay attention to
the balance of black and white in the layout.
Findings
I found that creating text layouts is not an easy task; it has to
balance aesthetics and practicality. At the same time, the design
of the headline must be related to the content of the text;
otherwise, it will lack character and even create a sense of
disconnection.
FURTHER READING
The VIGNELLI CANON
Massimo Vignelli
|
||
|
Figure 3.1 The cover of The Vignelli Canon |
This time I continue to read the remaining parts of this book.
Last section, I studied 'The Intangibles' in design, and next
is the 'The Tangibles' .
Here are some key points that left a deep impression on me：
1. Paper Sizes
Vignelli advocated for the use of the international standard A
series paper sizes instead of the commonly used Letter size in
the United States. He believed that a systematic size standard
could bring clarity and efficiency.
My opinions: I think using a standard paper size is
helpful for beginners to get the hang of formatting rules,
and it makes the layout look way more neat and
professional.
2. Grids
The grid is our main tool to organize space. A well-designed
grid creates a structure that supports clarity and rhythm.
It’s not meant to restrict creativity, but to support it.
My opinions: I believe that grids can help beginners
recognize the norms of typography. During the practical
process of assignments, I also realized the importance of
grids. (For example, baseline in InDesign)
3. Margins
Margins are like breathing room. White space gives elegance
and clarity to a layout.
My opinions: Leaving white space can greatly enhance reading comfort. In
my reading experience, appropriate page margins give me a
sense of sophistication and increase the time I focus on
reading.
4. Columns
Using columns enhances organization. A multi-column layout helps
to separate different types of information, making the page more
readable and practical.
My opinions: The separation of text can affect the
reading rhythm.
5. Typefaces
Typography should not decorate; it should inform. Too many
typefaces create visual chaos.
My opinions: I still remember Mr. Vinod telling us about the wrong
examples of font usage for wedding invitations in the
lecture.
6. Scale
Using different scales gives hierarchy and visual rhythm.
Large sizes attract attention, small ones support
secondary information.
7. Color
Color is a powerful tool, and it should be used with
purpose. Don’t use color randomly—each color should have
a role. Often, high contrast is better for communication
than decoration.
My opinions: Improving the perception and
aesthetics of color is one of the keys to a designer's
progress.
评论
发表评论