Final Project
14th June 2019 (week 11-14)
Daryl Pung Xi Ern (0333743)
Typography
Final Project: Expression, Hierarchy and Composition
LECTURE NOTES
Week 11: Typography in Different Mediums
Print type: type was designed to be read from a print long
before we read from screen. It is the designer’s job to ensure that the text
can be read smoothly and easily.
-elegant and intellectual typefaces for print: Caslon,
Garamond, Baskerville
Screen type: Typefaces on the web are optimized and often
modified to enhance readability and performance onscreen. This could range from
modifiying angles and making the letters forms wider or reducing stroke
contrast etc.
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. Hyperlinks
are found in nearly all web pages, allowing users to click their way from one
page to another.
Best fonts for screen: Open sans, Lato, Arial, Helvetica,
Times New Roman, Times, Courier New, Courier, Verdana, Georgia, Palatino,
Garamond
Static typography: Minimal characteristic in expressing
words. From billboards to posters, magazines to flyers, we encounter all forms
of static typography with wide ranging purposes.
Motion typography: Temporal media offer typographers
opportunities to “dramatize” type to become “fluid” and “kinetic”. Film credits
present typographic information, bringing it to life through animation.
Week 12
No lecture this week, instead we focused on our final project.
INSTRUCTIONS
FINAL PROJECT
Week 11
For our final project we're tasked to design a poster advocating for an issue that applies for the students on campus. I decided to focus my topic around mental health, I felt that this is very relevant as more and more people are beginning to struggle with depression, anxiety etc. I wanted to make it a more approachable topic and to break the stigma around it that it's something socially unacceptable to talk about.
![]() |
Fig 1.0 1st Sketches |
![]() |
Fig 1.1 2nd Sketches |
![]() |
Fig 1.2 3rd Sketches |
Week 12
After getting my sketches approved, I decided to use the design on the top right. I went ahead and digitized it. I used the font Futura because I felt that it was simple, yet bold, which was quite fitting.
![]() |
Fig 1.4 First Attempt |
![]() |
Fig 1.5 Attempted With Spiral Tool |
PDF of my final outcome:
![]() |
Fig 1.6 For the animation I used around 29 artboards and 60 frames |
![]() |
Fig 1.7 Final Animation Outcome |
FEEDBACK
Week 11
Mr Vinod told me not to focus too much on the visual aspect but rather on the typographical part instead.
Mr Vinod's comment from facebook: So this explanation (my explanation of the stigma around mental health) presently doesn’t seem to be expressed typographically. The distortion that you use must be inline with the message (stigma).
Week 12
Mr Vinod said that I had a good composition and he told me to make the curve around the letters smoother. He also said to change the colors for "Mental Illness" to make it stand out more.
REFLECTION
Experience
Week 11
I was getting a little frustrated with myself as I struggled to come up with designs that typographically expressed my topic.
Week 12
It was a little hard to use my judgement to align all the letters around a spiral.
Observations
Week 11
After getting the feedback from Mr Vinod, I had a clearer understanding and I could see that my designs were slowly getting better and better.
Week 12
I'm a lot more comfortable with the shortcut keys in illustrator now.
Findings
Week 11
I googled a lot of experimental typography and I realised that I shouldn't be afraid to step out of the conventional "safe" designs.
Week 12
I learned how to combine the visual and typography aspect together a lot more smoothly (the head aligned with the word "health")
FURTHER READING
Week 11
While reading, I came across a passage that I found quite relevant to the current topic:
“After World War II, type begins another transition. Herb Lubalin says, “the realization came to many of us in the early ‘50s that type was not just a mechanical means of setting words on a page. It as, rather, a creative and expressive instrument.”In this project, I've experimented with how letters can be used to create an image, for example how the letters for "health" creates a shape around the person's head. It proves that type should not only be limited to normal conventional format, but it should be explored just as art is.
Week 12
For this week, I looked at an online article called "When Typography Speaks Louder Than Words" by Carolyn Knight and Jessica Glaser.
Link: https://www.smashingmagazine.com/2012/04/when-typography-speaks-louder-than-words/
Using delicate and well-considered composition of typographic detailing, Lubalin has succeeded in making an unpleasant message seem attractive and pleasing. The quote states “A diplomat is a person who can tell you to go to hell in such a way that you actually look forward to the trip.” The focal point of this statement, being told to “go to hell,” is shown in an elaborate and elegant calligraphic form, enabling this mildly offensive statement to be mistaken for something that could be looked forward to with great anticipation at first sight.This shows how the design of a type can twist the meaning behind a font, such as the elegant font used for the phrase "Go to hell", which connotes hatefulness.
Week 13
I looked at another article on typography called "A Look Into Responsive Typography" which is a topic we haven't particularly covered on, so I thought it would be interesting to read more about.
Related to responsive layout design, this is a single part of the larger puzzle. It is the use of fonts that adapt to different resolutions so they are still viewable, with the overall layout still intact. Unlike using a simple font for a separate mobile site, you are using a font that is an complex as you like, which will stretch or shrink according to the screen’s need. All while remaining readable and clean looking, and without overlap or other readability issues.I believe that responsive typography is especially important when integrating a certain layout on various devices as it can change the overall look and feel depending on the size it has to accommodate.