Task 03: Type Design & Communication
23/05/2023 - 06/06/2023
Week 08 - Week 13
Adrianna Sofea Mohd Fauzi (0350661)
Bachelor of Design (Hons) in Creative Media
Typography - Task 3: Type Design & Communication
JUMPLINKS:
1. Lectures and Journal 2. Task 3: Type Design and Communication Process 3. Final Typeface Outcome 4. Feedback 5. Reflection 6. Reading and Findings
Lectures and Class Activities
WEEK 7 - WEEK 12
All lectures are completed in Task 1 and Task 2
Task Briefing Week
Week 7, 16/05/23
This week (WEEK 7) we were assigned our third project which is the Task 3: Type Design and Communication. Mr.Vinod had briefed us on the details of the instruction for this particular task and showed a few examples of how the process goes to help us understand the steps we must take to achieve a good typeface following the typography rules.
As instructed, we were to bring a graph paper and art pens. He specifically requested to bring five different tools and an ink for us to experiment which tool is the best for ourselves to write and understand the balance of handwriting. We had to practice writing diagonal, horizontal and circular lines for all 5 tools in different ways as well as the alphabets of " A, O, T, M, X". Mr.Vinod had suggested working on these first before we go deep into the real process. After we had done so, we are to select 1 option from the different options from each tool and write "A, E ,T, K, G, R, I, Y, M, P, N" we were given two options, whether to write them in uppercase or lowercase.
Figure 1.1
Week 7: Class Exercise on diagonal and horizontal lines, circular and A,O, T, M, X Week 8, 23/05/23
Independent Learning Week
On week 8, we were to watch the lectures provided by Mr.Vinod as this week is Independent learning week which requires us to self-learn on the particularness of typeface construction.
typeface.
Typeface Digitisation Week
Week 9, 30/05/23
This week we are to start digitisation and finalizing our chosen typeface and style from our handwriting practices. Mr.Vinod shared with us a demonstration of transferring the handwritten alphabets into Adobe Illustrator.
Sharing session with Low Hsin Yin
Week 9, 02/06/23
Ms.Hsin Yin is a type and graphic designer from Malaysia. She started her journey from a long period of research and methodology of the mundane markings on commercial vehicles in Malaysia. Ms.Hsin Yin found that the markings on those vehicles could have been done better by unskilled lorry workers and reduced the readability of the details on the vehicles. After many discussions with other typeface experts, she started documenting the practices and processes of enhancing the labelling on these vehicles by using different tools and methods. In the end, she came out with her official project called "Barang- barang sendiri sahaja" or "BARANG2 SENDIRI S'JA" in Malay which is also expressed as "Own goods only" in English.
From this 30-minute session, I had found that creating a typeface requires a strenuous amount of research and practices. Understanding the fundamental aspect of a good typography will make your typeface enhance legibility. Ms.Hsin Yin had many photographs of the lorries labels to help her identify the problem that she can help improve, she had many visual researches and feedback sessions from the signwriters and other experts to point out the small details she can improve.
Figure 1.2 Low Hsin Yin Talk
Figure 1.3 Low Hsin Yin Tools
Week 10, 6/06/23
This week, Mr.Vinod solely focused on helping us identify the flaw in our draft digitisation typefaces, he went around and gave feedback while we continue on digitising our typefaces. This week we worked independently as well as consulting with Mr.Vinod as the process takes pretty long especially having to achieve the balance structure of a font.
Punctuation Construction and Discussion Week
Week 11, 13/06/23
On week 11, Mr.Vinod had given us feedback on our punctuation which are coma, full stop, and exclamation mark, he has advised us to reconstruct and study more on ensuring our punctuation is aligned to our typeface design. Mr.Vinod had also given a 20 mins tutorial on how to improve them, while in the midst of that he had suggested us to learn how to use FontLab, to ensure we have no difficulty in transferring them later on.
1. Handwriting Exercises
Write diagonal, horizontal, vertical and circular lines for all 5 tools in 5 different ways for each tool - Write AOTMX for all 5 tools in 5 different ways for each tool - Select 1 option from the 5 different options from each tool and write "a e t k g r i y m p n" in the selected style.
Figure 2.1 Exercise Instructions
Figure 2.2 (Phase 1) Practices on strokes and alphabets
1.2 Handwriting on AETKGRIYMPN
After understanding the process of movement, angle and strokes I
began to practice on AETKGRIYMPN with different tools
Figure 2.3 (Phase 2) Practices on strokes and alphabets
I struggled with having every alphabets to have the same x-height, ascender and descender because if every each of them looked different, it will look as if it is from different type families. Therefore, I pushed myself to do extra sketches and practices on these letterforms.
Figure 2.4 (Phase 3) Chosen tool and style
Figure 2.5 (Phase 3) Choosing the proportionate alphabet
2. Visual Research
Figure 3.1 Anatomy of Type
We must be conscious of typographic standards such as the baseline,
median, ascender, descender, and typography essentials when designing a
typeface.
-
Descender Height: The size of the descenders in a letter affects its style and tone.
-
Baseline: This is where all the letters rest, providing stability and serving as a reference line for aligning text and other elements.
-
X-Height: The height of the lowercase letters' main body.
- Cap Height: The measurement from the baseline to the top of capital letters, which determines their size in terms of points.
- Ascender Height: Certain elements may extend slightly beyond the cap height, going above the top of capital letters.
Figure 3.2 Anatomy of Type
Notes:
Although we must adhere to the typography guidelines,
every typeface is not symmetrical or perfect. This is because it goes back
to the foundation of letterforms from our handwriting, it is not perfect
and some lack stability. Therefore we must have these guidelines to help
us enhance what we might want it to be a flawless look although it
isn't.
Figure 3.3 Typography Basics Book
Figure 3.4 Typography Referenced Book
Figure 3.5 A Type Primer by John Kane Book
Figure 3.6 A Type Primer by John Kane Book
.jpg)
Figure 3.7 Yayashii Bold
For deconstruction, we need to select a preexisting font that closely matches our design and carefully examine and break down the shapes of its letterforms. For this analysis, we should choose one typeface from the given selection of ten typefaces and another typeface from either Fontshare or Google Fonts. It is recommended that we focus on lowercase letters that have ascenders, descenders, and x-height, as well as capital letters with a cap height.
Figure 3.8 10 Typefaces Present
Link to site: https://www.whatfontis.com/?s3
.jpg)
Figure 3.8.1 Dream Orphan Regular
.jpg)
Figure 4.1 Understanding the Technicalities
Figure 4.2 Handwriting to Digitising
- Rectangle Tool
- Pen Tool
- Brush Calligraphy Tool
4. Rectification of typeface
At this stage, we are to refine our typeface and after studying and analysing between existing fonts with mine that I handwritten, I decided to follow the "modern" serif typeface that has curvature or obvious contrast between thick and thin strokes.
Figure 5.4 Determine the characteristics of my type family
After finishing the refinement of the alphabet, I started to work on punctuation. We were required to do Period, Exclamation Mark and Comma.
Figure 5.5 Comma Process
Figure 5.6 Exclamation Mark Process
Figure 5.7 Exclamation Mark Process
Figure 5.8 Numbersign Process
Figure 5.9 Numbersign Process
Figure 6.0 Details on Ascender, Descender, X-Height, Baseline
5. Fontlab
Next, we were required to transfer our typeface into FontLab and try and error whether our font was legible.
Tutorial Video from Mr.Vinod
Figure 7.0 Transferred all letterforms and placed on the baseline
Once I had imported all the letters into FontLab7, I proceeded to perform individual kerning for each glyph within the metrics tab. Additionally, I provided the necessary font information and measurements, such as ascender and descender height, within the 'font info' tab.
Measurements:
- Ascender height: 700
- Cap line: 637
- Median line: 500
- Baseline: 0
- Descender: -170
Figure 7.1 Punctuations transfer
Figure 7.3 Metrics Tab Screenshot after multiple try and error with kerning of each letterform.
6. Poster layout and sentence
Poster layout composition for font display or promotional.
After multiple word search of words that use "AETKGRYPMN," I found
"Karate Party in Tiger Gym" were best.
Figure 8.3 Mr. Vinod's Suggestion
From Figure 8.2 I had asked my lecturer's opinion on the layout and composition of the texts. Initially, he suggested the first or second poster. However, he asked me which one do I prefer? And I answered, "the third one" and he said that works too although I have to ensure that it has given more "movement" or and attraction or somewhat. Which took me a long time to do. As shown (Figure 8.3) he asked me to play around with different angles for my subtext (my credit name and typeface name) but after several tries, this layout still felt awkward and boring. I asked my friends around on the third option and they agreed it had this huge spacing in the middle that feels separated from the sentence, although the stairs lookalike composition looked good, it was not impactful enough
Therefore, I went back to look into all the compositions I did before and observing them, I saw the first poster stood up to me but it needed a few changes.
Figure 8.4 Readjustment from the first poster
This time I went with the first option and to give a "continuation" look, I placed them on top of each other following their stems. If seen above, the letter "P" is aligned with "A" and "I" and "R" and "Y". My friend also mentioned it looked like a book cover, and that's the kind of layout that I was able to achieve using my typeface. As this typeface feels more suitable for "Heading" designs.
7. Final Outcome of
Typeface
Font Download: Great Anchor Regular Typeface
Figure 9.2 Final Poster A4 Task 3: Type Design and Communication
Feedback
Week 12:
General Feedback: Ensure the credit name is at 12 point
Specific Feedback: Practice more compositional layout for the poster and give more impact and use every letterform for the sentence
Week 11:
General Feedback: Slightly smaller than capital letters (#), exclamation marks top and bottom sections are not the same size, and the bottom is smaller.
Specific Feedback: Good progression, continue with the refinement of typeface & ensure the ascender height for each letter is balanced and stroke width is not vary
Week 10:
General Feedback: Ensure the typeface is straighten and refined, avoid uneven ascender and different stroke weight
Specific Feedback: In the refinement process, I have to be more mindful of the details of smoothing my typeface from the final handwritten one
Week 9:
General Feedback: Watch the video provided and practice type construction, ensure baseline/ each details and guide are acquired during the process
Specific Feedback: Redo the lettering or choose another style (do not design the lettering, just write in your own handwriting)
Week 8:
General Feedback: (ILW) Practice more on writing style with a calligraphy pen, find the rhythm and get used to shaping strokes.
Specific Feedback: I have to practice more and look up for references to understand better to create a legible font
Week 7:
General Feedback: Practice more on researching and sketching/writing the designed typeface of your own and do a lot of research how it is done and understand each detail
Specific Feedback: To be more focused in the requirements of what to submit into the E-Portfolio such as (JPEG AND PDF) for each tasks.
Reflection
Experience: My whole experience with this assignment was better than I had anticipated. I enjoyed the process of learning every element of creating my own typeface. Especially after the Low Hsin Yin sharing, she is someone experienced in this area and was able to share her thought process as well as educate us on what she learned over her path and the mistakes we may learn from. Furthermore, my encounter with FontLab proved to be an intriguing experience. I had to kern my letters and conduct tests to determine the optimal letter spacing between pairs. This process allowed me to make necessary adjustments and fine-tune the overall presentation. Prior to this experience, I had never fully grasped the extent to which fonts and typefaces are meticulously developed by individuals who consider every detail to ensure ease of use for the end users
Observations: Based on what I've observed, creating a typeface involves a great deal of
intricate work. Each element within a letter's design must adhere to
typographic principles and be coherent. Essentially, a typeface should be
easily readable and understandable, facilitating convenient use for both
users and designers. Consequently, while working on the development of
"Great Anchor," there were numerous instances when I felt compelled to
start over. However, I eventually recognized that what I truly needed to
improve was the consistency and legibility of the typeface, aspects that
could be refined rather than starting from scratch
Findings: I discovered that creating punctuation marks can be quite challenging. By referring to (Figure 5.7), you can observe the intricate construction details of the exclamation mark. I had to ensure that the exclamation mark harmonized with the alphabets in terms of both height and stroke weight. The size and weight of the mark were particularly important as they contribute to the defining characteristics that unify a type of family.
Further Reading
For details on references click here: Up
(Applicable letters AETKGRIYMPN and Uppercase Letters Only!)
Comments
Post a Comment