26.10.2022 - 23.11.2022 (Week 9 - Week 13)
Loh Qiao Yin/
0348923
Advanced Typography / Bachelor of Design in Creative Media / Taylor's
University
Task 3
[Type Exploration & Application]
LECTURES
All lectures completed in Task 1
INSTRUCTIONS
/>
Task 3: Key Artwork
2) Promotional posts
3) Character Introduction
4) Random Stuff
Just for showcasing the punctuation marks. Also, featuring a quote by Mr Vinod when being caught off guard by an amazing cat poster in one of the tutorial sessions. The maths equation is just for testing out the brackets.
FINAL SUBMISSION
Task 3: Type Exploration & Application
Font file link:
https://drive.google.com/file/d/1x5AS1yqTGbj4AytYk2RpjDAsilIwo3o0/view?usp=sharing
i. IDEA PROPOSAL
I wanted to go with the experimental route but sadly the cons outweigh the pros based on my existing knowledge and the time given to complete the task. At last, I went with completing the typeface for a mobile game called Alto's Adventure. The typeface design has a distinctive chipped part to it, it's a small but important detail that I can venture into. Little did I know, this small detail almost drive me insane throughout the process of completing the design for all letters.
ii. VISUAL RESEARCH
Doing a thick and chunky letter with a low x-height is actually not as easy as it seems. A lot of times I am unsure of how the letters should look like, thus the visual reference of a typeface with a similar look does assist me a bit.
Fig2.3 Design featured on awwwards.com, 10 November 2022
Fig 2.4 Design featured on creativemarket.com, 10 November
2022
iii. SKETCH
Figuring out the scale and shapes used for each letter.
iv. DIGITALISATION
Fig 2.7 Comparison between 2 types of chipping method, 13
November 2022
I wanted to go with the experimental route but sadly the cons outweigh the pros based on my existing knowledge and the time given to complete the task. At last, I went with completing the typeface for a mobile game called Alto's Adventure. The typeface design has a distinctive chipped part to it, it's a small but important detail that I can venture into. Little did I know, this small detail almost drive me insane throughout the process of completing the design for all letters.
Fig 2.1 Idea proposal, 26 October 2022
Fig 2.2 Mobile game original poster, 1 November 2022
ii. VISUAL RESEARCH
Doing a thick and chunky letter with a low x-height is actually not as easy as it seems. A lot of times I am unsure of how the letters should look like, thus the visual reference of a typeface with a similar look does assist me a bit.
Fig2.3 Design featured on awwwards.com, 10 November 2022
iii. SKETCH
Figuring out the scale and shapes used for each letter.
Fig 2.5 Sketches, 10 November 2022
Fig 2.6 Exploration of both uppercase and lowercase
letters, 13 November 2022
Uppercase Letters
There is a huge difficulty in balancing the letters when the chipped parts are applied, especially in letters that are symmetrical in nature. I cannot chip both sides as it will turn them into another type of style. An image of a comparison is shown below.
There is a huge difficulty in balancing the letters when the chipped parts are applied, especially in letters that are symmetrical in nature. I cannot chip both sides as it will turn them into another type of style. An image of a comparison is shown below.
Fig 2.8 First attempt of all uppercase
letters, 13 November 2022
After some peer feedback, there is a noticeable imbalance in
some letters. I have to play with the placement of chipped parts
more. The human eye reads from top to bottom and left to right,
so I thought of putting the chipped parts more on the right side
or the bottom side of the letters. I can't reduce the size of
the chipped part or else it will be inconsistent for certain
letters. The image below is just a few examples for demo
purposes (top- original versions; bottom- revised versions).
Almost all of the alphabet needed changes in the placement of
the chipped part and a huge chunk of my time was used in making
the tiniest changes and it still looks a bit off. To minimise
the odd feeling, the strokes with chipped parts (in certain
letters) were made slightly longer to compensate for the absence
of something there.
Finalised uppercase letters.
Lowercase Letters
This is the most difficult one. The design either looks bland like steamed chicken breast without seasoning or it looks horrendous to the point I'm scared. Putting the exaggeration aside, like the uppercase letter, it is just a balancing game whereby I have to make sure the letter stays true to its original look in the game poster while still having a distinctive flare to it.
All the lowercase letters above are not consistent at all. Halfway through I got doubtful about the thickness of the strokes and the implementation of chipped parts. I was very indecisive about whether or not I should go with number one (thin+thick strokes) or number two (thick strokes). So, I compared it with the uppercase letters to get an overlook of cohesiveness. Despite number one being more pleasing to the eye, number two fits with the uppercase letters more after some discussion with a few of my peers.
Finalised lowercase letters
Numbers
Fig 2.9 Chipped parts variations, 13 November 2022
Finalised uppercase letters.
Fig 2.10 Finalised uppercase letters, 13 November 2022
This is the most difficult one. The design either looks bland like steamed chicken breast without seasoning or it looks horrendous to the point I'm scared. Putting the exaggeration aside, like the uppercase letter, it is just a balancing game whereby I have to make sure the letter stays true to its original look in the game poster while still having a distinctive flare to it.
Fig 3.1 Exploration of lowercase letters
variations, 13 November 2022
All the lowercase letters above are not consistent at all. Halfway through I got doubtful about the thickness of the strokes and the implementation of chipped parts. I was very indecisive about whether or not I should go with number one (thin+thick strokes) or number two (thick strokes). So, I compared it with the uppercase letters to get an overlook of cohesiveness. Despite number one being more pleasing to the eye, number two fits with the uppercase letters more after some discussion with a few of my peers.
Fig 3.2 Comparision between uppercase and lowercase
letters, 13 November 2022
Fig 3.2 Comparision between 2 types of lowercase
letters, 13 November 2022
Fig 3.2 Finalised lowercase letters, 13 November 2022
Numbers
I had a bit of fun with '7'. The process of figuring out the numbers
is a little less frustrating.
Finalised numbers
Punctuation Marks
Quite a difficult process and it felt like it took as long as doing the alphabet.
Fig 3.5 Exploration of punctuation marks, 13 November 2022
Finalised punctuation marks
v) FONTLAB
Creating the fonts in FontLab and doing the kernings.
vi) APPLICATION
1) Loading Screen Animation
(The part where I accidentally turned Typography module into Animation module for myself)
There is no loading screen or a direct obvious prompt for the players to start the game in 'Alto's Adventure' (seen in the top left image below). I replayed the game again to screenshot some visuals and take note of the colour palette.
Recreated assets in the game so that I have a full control over
them. The animation will be in a silhouette style because a
loading screen would benefit from a clean and simplistic visual
as well as favour my time constraints. Besides, it also relates
to the original poster.
First Attempt
Ew, ew, ew. There is a lot to fix here. Exported as h.264 instead of .gif because or else it turns out grainy and glitchy particles appear on the graphic.
Final Loading Screen
I have decided that I am accidentally spending too much time on this application. Since the focus should be mainly on typography, I believe I have somewhat made my point for this application and I hope to prioritise other applications more. I only managed to create a still incorporating Mr Vinod's feedback towards the loading screen design. Moving on.
Fig 3.3 Exploration of number forms, 13 November 2022
Finalised numbers
Fig 3.4 Finalised number forms, 13 November 2022
Punctuation Marks
Quite a difficult process and it felt like it took as long as doing the alphabet.
Fig 3.5 Exploration of punctuation marks, 13 November 2022
Fig 3.6 Finalised punctuation marks, 13 November 2022
v) FONTLAB
Creating the fonts in FontLab and doing the kernings.
Fig 3.7 Progress in FontLab, 13 November 2022
1) Loading Screen Animation
(The part where I accidentally turned Typography module into Animation module for myself)
There is no loading screen or a direct obvious prompt for the players to start the game in 'Alto's Adventure' (seen in the top left image below). I replayed the game again to screenshot some visuals and take note of the colour palette.
Fig 5.1 Screenshots from the game, 15 November 2022
Fig 5.2 Recreated assets in Illustrator, 15 November
2022
Fig 5.3 Loading screen template, 15 November 2022
Ew, ew, ew. There is a lot to fix here. Exported as h.264 instead of .gif because or else it turns out grainy and glitchy particles appear on the graphic.
Fig 5.4 First attempt of animation, 15 November 2022
Final Loading Screen
I have decided that I am accidentally spending too much time on this application. Since the focus should be mainly on typography, I believe I have somewhat made my point for this application and I hope to prioritise other applications more. I only managed to create a still incorporating Mr Vinod's feedback towards the loading screen design. Moving on.
Fig 5.5 Final loading screen animation, 15 November 2022
Final 5.6 Final loading screen still (revised), 15 November 2022
Fig 5.7 Promotional post 1, 17 November 2022
Fig 5.8 Promotional post 2, 17 November 2022
Fig 5.9 Promotional post 3, 17 November 2022
Fig 5.10 Felipe the llama, 17 November 2022
Just for showcasing the punctuation marks. Also, featuring a quote by Mr Vinod when being caught off guard by an amazing cat poster in one of the tutorial sessions. The maths equation is just for testing out the brackets.
Fig 5.11 Random stuff, 17 November 2022
FINAL SUBMISSION
Task 3: Type Exploration & Application
Font file link:
https://drive.google.com/file/d/1x5AS1yqTGbj4AytYk2RpjDAsilIwo3o0/view?usp=sharing
Fig 6.1 "Alto" - Final type design, 28 November 2022
Fig 6.2 "Alto" - Final type display poster, 28 November
2022
Fig 6.3 Final loading screen animation, 28 November
2022
Fig 6.4 Final loading screen still (revised), 28
November 2022
Fig 6.5 Application #1- promotional post, 28 November
2022
Fig 6.6 Application #2- promotional post, 28 November
2022
Fig 6.7 Application #3- promotional post, 28 November
2022
Fig 6.8 Character introduction, 28 November 2022
Fig 6.9 Random stuff for punctuation marks showcase, 28
November 2022
/>
/>
Fig 6.10 Final compilation of Task 3 - Type Exploration & Application in pdf, 22 November 2022
FEEDBACK
Week 12
General feedback
- In a poster, arrange the words first before inserting an image.
Prioritise what you have designed and want to showcase the most
Specific feedback
- Think of more variety of applications that can utilise the
typeface made (promotional/ social media posters etc.)
- Make a box with the word 'loading' inside and the ellipsis (Make
it like a typical loading screen)
- Remember to prioritise the typography more than the graphics and
animation
General feedback
- For lowercase letters, it should be a simplified/ reduced version of
the uppercase letter without looking like a totally different font
- Lowercase letters and punctuation marks should already be completed
on this day and the application for the next class
Specific feedback
- Idea proposal for application is okay
Week 10
General feedback
- Contemplate if the idea is challenging enough or not while considering the deadline and your own ability
- The more u continue, u might learn new things/form/shapes that can be introduced to the character form
Specific feedback
- The detail in the tail of 't' is a nice touch
- Top section of 'G' might look a bit too elongated, it can be solved by just shortening it, allowing the below section to look wider, but it doesn't mean that the top stroke needs to be the same as the bottom G cross bar although generally it is.
- Adjust the top of the 'T' to be smaller and conventionally, it should be thinner.
General feedback
- Needs more thought process and reconsideration of all 3 proposed
ideas
Specific feedback
- (First Idea) quite risky like what I explained for the cons of the
idea
- (Second Idea) The common challenge of making English letters
representation based on other languages is that there is a lot of
existing work out there, so think of ways to make yourself different
from others. Another problem is if the whole form of the letter is
taken literally and transformed into an English letter, it will
cause a frakenstein-ish look. An example of a good work is when a
student took minor characteristics of the letter and created the
typeface based on the essence of it.
- (Third idea) There is too much limitation imposed on the
exploration by just choosing art deco glass planes. Explore more
examples of art deco such as architecture, interior design etc.
before narrowing down on the chosen reference.
REFLECTION
Experience
Not gonna lie, I am a bit disappointed that I did not manage to go with the
experimental route. There are quite a few ideas on doing experimental fonts
but to make them work, I either needed tons of knowledge in building the
mechanisms for all letters or doing complex coding, which I lack. Have I
tried finding ways to make them work? Yes, but time was my biggest enemy
along with the workload of other modules. In the end, I settled on
completing a typeface for a game and I did not regret it. It turned out to
be very challenging for me and I was running out of patience at the end of
designing all the letters. Things became enjoyable after everything is
settled in Fontlab and I had a breeze in doing applications.
Observations
I noticed I have a tendency to dig a hole for myself, jump in, then
whine about why is my life so hard. Being ambitious but lacking the
ability to set realistic expectations is something I should deal with.
Another thing is that I enjoyed looking at how diverse everyone's
preference in design is when given the liberty to develop any fonts they
want. I am glad that there are a few students who work at the speed of
lightning so I have someone to look up to and reflect on my progress.
Findings
I
was wondering why am I having a hard time designing the rest of the alphabet
for the typeface I chose, turns out I skipped the visual research process and
jumped straight into the sketch and digitalisation process. I only realised
this when I wanted to update my blog after designing the capital letters and
realised the "visual research" section is empty (shame on me). My brain got
tricked that having a game poster with few alphabets is enough for me to
continue the rest of the typeface but no, I needed more visual research on
other blocky fonts to see how the strokes are made. This is a lesson for reminding me to not build a house without laying down the correct foundation.
FURTHER READING
Fig 6.1 'The Anatomy of Type: A Graphic Guide to 100 Typefaces' by Stephen Coles, 9 November 2022
I am exposed to a comprehensive explanation of 100 typefaces on their
versatility and practicality in forming a harmonious visual.
Fig 6.2 Garamond Premier, 9 November 2022
One of the examples featured is Garamond. It has a formal tone that
might not fit a casual use and it is useful for infusing a document
with importance or poetry.
Luxury Diamond strikes an impression in the viewer's mind and has an
exclusive tone to it. Good for raising a product's perceived value and
filling horizontal space.
Fig 6.4 Forza, 9 November 2022
Fig 6.3 Luxury Diamond, 9 November 2022
Fig 6.4 Forza, 9 November 2022
Forza is a slightly more geometrical typeface. Rounded shapes are
only concave on the sides, good for communicating toughness,
authority and are usually used for automobiles or athletic
content.
With its broad, massive slab and prominent tails that turn
upwards, Giza is good for grabbing attention as it has a bold look
by occupying a lot of space.
Key findings: The lasting impression a viewer gets from a typeface come from the delicate decision-making of the angle/ thickness/ characteristic of the strokes/ terminals to the spaces and gaps between the bowl.
Fig 6.5 Giza, 9 November 2022
Key findings: The lasting impression a viewer gets from a typeface come from the delicate decision-making of the angle/ thickness/ characteristic of the strokes/ terminals to the spaces and gaps between the bowl.
Comments
Post a Comment