19/11/2024 - 16/12/2024 | Week 09 - Week 13
Koh Sher Wei | 0353816
Advanced Typography | Bachelor of Design in Creative Media
List of Contents:
Task 03: Type Exploration and Application
For task 03, we are essentially tasked to utilise everything we've learned
from task 1 and task 2. There are three categories we can choose from, to
complete this task:
1. Focus on an issue where typography can make a
difference.
2. Select a widely used typeface or lettering style and improve
it.
3. Experimental. Choose an unconventional medium or approach for creating
or showcasing typography.
The final product should be a completely generated typeface, where we need
to showcase how the typeface would be applied.
We were told to present three ideas to Mr.Vinod and decide on which one
would be best to develop.
Initially I wanted to work with my third idea, to make a fisheye lens but
Mr.Vinod told me to try and explore Idea 01 instead. So my sketching process
took a bit longer as I ended up experimenting with both ideas.
|
fig 1.1 FIsheye idea exploration
[W9_25/11/24]
|
|
|
Mr.Vinod suggested that I can try doing a monospace font. He advised me to
replicate the film strip design and make it into a frame for my letters;
hence making it a monospace font would be suitable. So, I looked up a
references of film strips for inspiration.
fig 2.1 Film Strip References [W10_03/12/24]
|
|
fig 3.1 First film strip exploration
[W10_03/12/24]
|
|
Initially, my idea was to use the Courier typeface as a base. So what I
did was, I tried to make it seem like it has a light leak blue effect.
So I make the edges with gausian blur and added some texture to the main
body of the font. However, sir told me it would be better to come up
with a completely new typeface so I scratched this idea.
|
fig 3.2 Film Strip frame
[W10_03/12/24]
|
|
|
|
fig 3.3 Second film strip exploration
[W10_03/12/24]
|
|
|
So for my next idea, I played around with rectangles and made them
into a sort of unbalanced typeface. The reason for this is that I
still wanted to do something that gives off light leak, so as to not
stray too far from my initial proposal.
I didn't have much time to do more exploration so I went with this
idea as I felt it was not too bad.
|
fig 3.4 Film strip typeface standard form
[W10_03/12/24]
|
|
|
In terms of standardising the structure of my font, I used pixel
grids instead of making my own. I found it was more convenient
considering my letters are made of rectangles. Meaning, it would be
easier to measure my rectangles and distance between the shapes by
using grids. Doing monospace font also means I dont have to do
kerning, so I just had to make sure that the letters aligned in height
and is centered.
|
fig 3.5 Typeface construction in
different colours [W10_03/12/24]
|
|
|
|
fig 3.6 Typeface with rounded corners
[W10_03/12/24]
|
|
|
In terms of the actual construction of letters, I followed a
specific pattern. Fig 3.5 is a depiction of the different rectangles
and how I arranged them. Once I've completed the proper structure, I
unite the shapes with pathfinder so that I can round the corners at
13px. Most of my letters follow the rules of this letter A, to
ensure that every other letter is consistent.
Uppercase
|
fig 4.1 Uppercase Typeface with filmstrip
frame [W10_03/12/24]
|
|
|
This is a the full set of my uppercase alphabets. Every letter is
aligned by height but some letters are slightly off in width as there
are letters like "M", "W", "Z, and "N" that can't conform to become
thinner.
|
fig 4.2 Variations of different letters
[W10_03/12/24]
|
|
|
I also struggled with the letters X, Y and Z because I wasn't sure
how to incorporate the pattern that I created for letter A. "S" was
also a tricky letter to build due to its curvy nature.
Numerals & Punctuations
|
fig 5.1 font numerals [W11_10/12/24]
|
|
|
|
fig 5.2 font punctuations
[W11_10/12/24]
|
|
|
For the numerals, it was pretty similar to the structure of
uppercase alphabets so I just followed the same construction
method.
Punctuations took a bit more time but I basically used the left
side of my letter pattern as the main vertical base. I also made
sure the full stop and coma aren't too small as it's a monospace
font so it had to fill up more of the space in frame. The
punctuations on the top layer of fig 5.2 was relatively simple
because of how similar they are to one another. However, the
bottom layer required a bit more work, and I had to change the
angle of my slash a few times so it matches the hashtag and
percentage.
Fontforge
Then, I checked that the letters fit well and was properly centered so that
the spaces would be even. I had to correct a few letters and punctuations
but that was it, I didn't do kerning because it's a monospace
font.
Final Font Presentation
We were told to keep it simple to showcase our font, but a fully while
background would have been too plain so I added a small border for the font
name and year in black.
|
fig 7.1 Uppercase alphabets presentation
[W12_12/12/24]
|
|
|
|
fig 7.2 Font presentation in black background
[W12_12/12/24]
|
|
|
|
fig 7.3 Numerals presentation
[W12_12/12/24]
|
|
|
|
fig 7.4 Punctuation presentation in black
background [W12_12/12/24]
|
|
|
|
fig 7.5 Font phrase presentation
[W12_12/12/24]
|
|
|
Font Application
The font that I created is more for title display due to its monospace
frame. So my idea is to use it for a film fest poster, and merch for the
festival.
|
fig 8.1 Application designs in
illustrator [W12_12/12/24]
|
|
|
|
fig 8.2 Poster mockup in Adobe
Photoshop [W12_12/12/24]
|
|
|
I found some mockups and designed a few posters and horizontal
banners. Then imported the design into adobe photoshop to use it
on the mockups.
Final Font Application
fig 10.13 PDF submission compilation
[W13_17/12/24]
|
|
Week 08
General Feedback:
- ILW
Week 09
General Feedback:
- Try nit to use extravagant sketches as it may be complicated
when developing the proper form of a font style.
- Letter face grid does not have to be consistent not does it
have to be only vertical and horizontal.
- Build a grid that can accommodate to your font, uppercase and
lowercase.
- Expect all Uppercase letters to be completely built by next
week for feedback.
Specific Feedback:
- I can try out ideas 1 and 3.
- Idea 01 can be developed, try to gain inspiration from
tate gallery.
Week 10
General Feedback:
- When doing the lowercase letters, make sure that we
place it next to the uppercase version to
compare.
- Have to ensure standardised form for upper and
lowercase, so it's important to use grid.
Specific Feedback:
- Try experimenting with monospace
letterform.
- The film strip idea would be better than the
fisheye.
- Explore with new letterface structure instead of
using a basic courier font.
Week 11
Specific Feedback:
- Mr. Vinod said it looks cool :]
Week 12
General Feedback:
- Displays your alphabets in different
sizes for font presentation.
Specific Feedback:
- Don't include photos for font
presentation, keep it simple to
showcase your font.
- Try not to go for colour when doing
your font presentation, can just do it
in black and white.
Reflection
Honestly, this was the most stressful task of this module. The idea
of creating a font seems very fun, but the technicalities of it is
actually very time-consuming. Not only that, even the creative process
of coming up with a typeface is difficult. We needed to figure out a
way to make our ideas come to reality while keeping structure, so I
think it's definitely not easy.
Precision, form and structure is very important in creating a font.
Even the mistake of making your font too small may end up changing
the entire vibe of the font when you enlarge it to scale. There's
also so many rules that we need to follow when it comes to
constructing punctuations. Punctuations very tasking due to their
"messy" nature. Every punctuation comes in different shapes with
different height and different width. So it's important to observe
and explore how other fonts arrange their punctuations.
Realistically, this whole task just makes me understand that
creating a font is not my forte. It's very technical. Also, so
many fonts already exist that it's difficult to even come up with
a truly authentic idea. Most likely, any idea you have in mind has
already been explored and can be found on pinterest or other
sites. Most of them just aren't made into actual font files, but
the designs do exist.
Further Reading
|
fig 11 Poster font application
[W12_14/12/24]
|
|
|
"Advanced Typography: From Knowledge to Mastery" by Richard Hunt is a
comprehensive guide that delves into the art and craft of typography beyond
the basics. Aimed at students and designers seeking to deepen their
typographic skills, the book combines visual, linguistic, historical, and
psychological perspectives to provide a holistic understanding of
typography's role in modern design.
While I don't have access to the full text of "Advanced Typography: From
Knowledge to Mastery" by Richard Hunt, I can provide an overview of the
themes likely covered in the section titled "The Changing Technology and
Practice of Type," based on the book's description and table of
contents.
-
Historical Evolution: The transition from
traditional typesetting methods to digital typography, highlighting
significant technological advancements.
-
Impact of Digital Tools: How software and digital
platforms have transformed typographic design, offering new
capabilities and efficiencies.
-
Designing Across Media: The challenges and
considerations when applying typography in various media formats, such
as print, web, and mobile interfaces.
-
Cultural Adaptability: The necessity for
typographers to design typefaces that are culturally sensitive and
appropriate for diverse audiences.
-
Customization and Creation: The growing trend of
customizing existing typefaces or creating new ones to meet specific
design needs or brand identities.
-
Integration of Theory and Practice: The importance
of combining theoretical knowledge with practical application to make
informed typographic decisions.