Typography Task 2 Text Formatting & Expression
Ang Siu Boon (0345135)
Typography (Bachelor's Degree (Hons) in Computer Science)
Task 2 Text Formatting & Expression
CONTENTS
LECTURES
Week 5 (26/9/2023): Lecture 5: Letters
Understanding Letterforms
|
|
|
Maintaining x-height
x-height - description of the sizes of the lowercase letterforms
x-height - description of the sizes of the lowercase letterforms
|
|
|
Form/Counterform (Counter)
The space which describes, often contained by the strokes of the form
The space which describes, often contained by the strokes of the form
|
|
|
|
|
|
Contrast
Basic principles of Graphic Design, which produces many variations
:
-small + organic
-small + organic
-large + machined
-small + dark
-small + dark
-large light
|
|
|
Week 6 (3/10/2023): Lecture 6: Screen & Print
Print Type vs Screen Type
Type for Print
-Intended for reading from print long before we read from screen
-Intended for reading from print long before we read from screen
-Designer's job tot ensure that text is smooth, flowing,
and pleasant tot read.
-Caslon, Garamond, Baskerville are most common typefaces
used for print.
Type for Screen
-Intended for use on web.
-Optimized and modified to enhance readability and
performance on screen in various digital environments.
-Include :
• taller x-height (reduced
ascender/descenders)
• wider letterforms
• more open counters
• heavier thin strokes and serifs
• reduced stroke contrast
• modified curves and angles for some designs
Hyperactive Link/Hyperlink
-A word, phrase, or image that you can click on to jump to a
new document or a new section within the current document.
-Found nearly in all Web Pages.
-Allowing users to click their wat from page to another.
- Normally blue and underlined by default.
-When moving the cursor over the hyperlink, arrow should change
to a small hand pointing at the link.
Font Size for screen
-16-pixel text size. (same size as text printed in a book or
magazine)
-Accounting for reading distance.
System Fonts for Screen/Web Safe Fonts
-Device comes with its own pre-installed font selection.
-Times New Roman are the most default basic typeface.
Pixel Differential Between Devices
|
Figure 1.5 Different Screen Sizes Between Device, Week 6 (5/10/2023) |
|
Figure 1.6 Different Pixel and Resolution, Week 6
(5/10/2023) |
-Screens used by PC, Tablets, Phones and TV have different sizes.
-Text you see on-screen differs in proportion too. (Different sized
pixels)
Static vs Motion
Static Typography
-Has minimal characteristic in expressing words
-Traditional characteristics such as bold and italic offer only
a fraction of the expressive potential of dynamic
properties.
Motion Typography
-Offer Typographers opportunities to "dramatize" type.
-For letterforms to become "fluid" and
"kinetic"
INSTRUCTIONS
<iframe
src="https://drive.google.com/file/d/1joM7TpmzqN8mglFlvQX7jXn1bxYheB8c/preview"
width="640" height="480" allow="autoplay"></iframe>
Task 2: Text Formatting & Expression
For our Task 2 : Text Formatting and Expression, we would require to
compile our knowledge and basically combine all the exercise from Task 1 for
the next task. Firstly, I tried recreating the Headline for Task 2 by
utilizing the type expression that I learned during Task 1.
![]() |
Figure 2.0 Type Expression Application, Week 5 (27/9/2023) |
Next, I implemented my text formatting knowledge for the paragraphs such as
kerning, leading, etc. I tried several layouts and placements.
![]() |
Figure 2.1 Text Formatting Application, Week 5 (27/9/2023) |
![]() |
Figure 2.2 Text Formatting Draft 1, Week 5 (27/9/2023) |
![]() |
Figure 2.3 Text Formatting Draft 2, Week 5 (27/9/2023) |
![]() |
Figure 2.4 Text Formatting Draft 3, Week 5 (27/9/2023) |
After listening to Mr. Vinod's opinion I tried trying different styles for
the word 'BUILD'.
![]() |
|
|
I felt that the headline is not expressing any emotion of feeling. However,
Mr. Vinod have me the freedom to choose my design. Thus, I revert back my
word 'BUILD' and try some more experiments.
![]() |
Figure 2.6 Text Formatting Draft 5, Week 6 (3/10/2023) |
![]() |
Figure 2.7 Text Formatting Draft 6, Week 6 (3/10/2023) |
![]() |
Figure 2.8 Text Formatting Draft 6, Week 6 (3/10/2023) |
Draft 5 was an improvement for Draft 2. However, Mr. Vinod said that he'd
prefer the paragraph placings of the other drafts. Hence, I chose Draft 6
and made the upper text more uniform and after seeing my peer's design, I
felt my design is quite plain and I tried to add more elements. My seniors
had also thought about QR code which ended up not being ideal, The second
thoughts that crossed my mind when I think about the word 'CODE' is the
barcode.
I researched some barcodes and then I generated a barcode for the title and
used it in my design. I then traced the barcode one by one in Adobe InDesign
![]() | |
|
![]() | |
|
EXTRAS!!
FINAL
![]() |
Figure 2.13 Text Formatting Final JPEG (With Guides and Grids), Week 7 (10/10/2023) |
![]() |
With Grids and Guides
<iframe src="https://drive.google.com/file/d/1Rkwinz3kpIuudLl5gkvfT7rGhGqINa_m/preview" width="640" height="480" allow="autoplay"></iframe>
Without Grids and Guides
<iframe src="https://drive.google.com/file/d/1mBk8kwimpq94AO_2LvSvpZ4-slTkimsq/preview" width="640" height="480" allow="autoplay"></iframe>
FEEDBACK
Week 5 (26/9/2023)
General Feedback
-Implement all knowledge from Task 1 into Task 2 -Not necessary need to use same font type. (Same typeface, but can different style)
Specific Feedback
-Try playing around the Headline.
Week 6 (3/10/2023)
General Feedback
-Focus one word in the headline to express. (Build)
-Do not express every single word for the headline.
REFLECTIONS
Experience
Mr. Vinod, my professor, has allowed me to delve deep into the intriguing
area of typography and text formatting throughout the course. The
experience has been nothing short of transforming and illuminating.
Mr. Vinod guided me on a journey that began with the fundamentals of
typography and progressively progressed into a full understanding of how
to properly express meaning through text. It was both tough and enjoyable
to learn about type choice, size, leading, line-length, and all the other
technical aspects that go into typography. Each course and project seemed
like a step closer to understanding the art and science of text formatting
and expression.
Observation
One of the most striking insights I noticed during this session was the
great power of typography in changing our perception and interpretation of
information. Every decision, from the typeface to the meticulous correction
of leading and kerning, effects the readability, tone, and impact of the
text. It was eye-opening to see how different typefaces and formatting
options can convey whole different emotions and thoughts.
I also observed how important attention to detail is. Small but significant
differences between amateur and professional design include avoiding widows
and orphans, ensuring regular cross-alignment, and utilizing forced line
breaks sparingly. Precision is required in typography, and these nuances are
important.
Findings
The main takeaway from my research into typography and text formatting is
that they are not just technical parts of design but also essential
components of good communication and expression. Typography is an artistic
medium that may elicit emotions, establish hierarchy, and improve
readability. It is the visual language we use to convey meaning, tone, and
intention.
Furthermore, I found that typography requires a careful mix of creativity
and discipline. While it permits artistic expression, it also necessitates
respect to standards that ensure clarity and functionality. It's all about
striking a balance between beauty and practicality.
In conclusion, mastering typography and text formatting under Mr. Vinod's tutelage has been a journey of discovery and growth. My understanding for the intricacies and complexities of this discipline has grown as a result of my observations and discoveries. Typography is more than just arranging letters; it's about creating a visual narrative that connects with an audience, and it's a talent I'm eager to hone as a designer.
In conclusion, mastering typography and text formatting under Mr. Vinod's tutelage has been a journey of discovery and growth. My understanding for the intricacies and complexities of this discipline has grown as a result of my observations and discoveries. Typography is more than just arranging letters; it's about creating a visual narrative that connects with an audience, and it's a talent I'm eager to hone as a designer.
FURTHER READINGS
All further readings are at Task 1 Exercises
Comments
Post a Comment