21/6/2024 - 12/7/2024 (Week9-Week12)
Amber Tan Jing Jing (0372746)
Typography / Bachelor of Design in Creative Media / Taylors University
Task 3
TABLE OF CONTENTS
LECTURES
INSTRUCTIONS
TASK 3 - TYPE DESIGN AND COMMUNICATION
In this task, we were to design a type of letters (o l e d s n c h t i g , . ! #).
1. References and Sketches
Before I start sketching, I find some references on Pinterest.
Figure 1.1 References
Then, I started to draw my sketches.
Figure 1.2 Sketches
Sir choose Sketch#7 for me to digitize.
Figure 1.3 Reference of Final Sketches
Figure 1.4 Final Sketches (23/6/2024)
After my sketch is approved, I write all letters (o l e d s n c h t i g , . ! #) in the approved style.
Figure 1.5 Practice final outcome (1/7/2024)
Figure 1.6 Final outcome (1/7/2024)
2. Digitizing the written letters
Then, I started digitize my final outcome. I first create a square and rectangle as a basis for making font. This makes me more easier to create my font.
Figure 1.7 First Step to create font
I use shape tools to create many rectangles with different angles and lengths.
Figure 1.8 Start to create font
Figure 1.9 Final sketches and digitize
Figure 1.10 Height of the letters
Figure 1.11 Before and after shape builder tool
Figure 1.12 Font
3. FontLab
Ascender Height: 697pt
X-Height: 500pt
Baseline: 0pt
Descender Height: -232pt
Figure 1.14 Character Map
4. Final Work
Download font here:
Figure 1.15 Screen Grab of FontLab process (side-bearings),(12/7/2024)
Figure 1.16 Final Type construction, JPEG (1024px, 300ppi, Grayscale),(12/7/2024)
Figure 1.17 Final Type construction, PDF,(12/7/2024)
Figure 1.18 Final JPEG A4 black & white poster,(12/7/2024)
Figure 1.19 Final PDF A4 black & white poster,(12/7/2024)
FEEDBACK
Week9
General feedback : We need to come out with 9 sketches of typeface and digitize the final option before the next class.
Specific feedback : Post the sketches on Facebook. Then sir will choose the final option. Sketch#7 can be use to digitize.
Week10
General feedback : We need to digitize the final option before the next class.
Specific feedback : Sketch#7 can be use to digitize.
Week11
General feedback : We need to done the font lab before the next class.
Specific feedback : The corner of the letter 'L' is a little too fast and needs to be changed. There is nothing wrong with the rest. I can do the font lab after I correct the letter ' L'.
Week12
General feedback : We need to done the Task3 eportfolio before next class and post the FontLab Screengrab on Facebook.
Specific feedback : Spacing and kerning need to refer Mr Vinod's post.
Week13
General feedback : We need to complete the Final Compilation & Reflection eportfolio before the next class.
Specific feedback : Overall my Task3 eportfolio is ok.
REFLECTION
Experience
Through this exercise, I learned how to create my own font. I first found the references on Pinterest to look for some ideas. There are so many creative design to choose from. I think the hardest part is sketching. It is because I had to calculate the grid on the graph paper. I feel like my eyes become very tired after I draw all the sketches. This is my first time using Font Lab 7, I am not very good at using it, so I spend more time to researching it.
Observations
Somethings I have observed is that I first create a square and rectangle as a basis for making font before I start to create my font. This makes me more easier to create my font. My font looks more balance, doesn't look big or small. I feel like make the letter 'O' first, it will be easier to make other letters. I basically copy and paste and delete some extra rectangle, then my other letter is done.
Findings
This is more interesting for me because I can create my own font. I can make money with the letter I made! Although the process of making font is very hard, I am quite satisfied with the result. Overall through this exercise, I saw a lot of different fonts and learned a lot. I found that good fonts can enhance visual appeal and improve readability.
FURTHER READING
Typography Design Form And Communication
Figure 2.1 Typography Design Form and Communication
1. Typography on Screen (pg133 - pg148)
As more designers become involved in on-screen design, the need
to preserve typographic integrity in this environment becomes
paramount. Doing so, however, is complicated by rapidly changing
technology: screen sizes, screen resolutions, and new types of
interactivity.
Typographic considerations for printed communications carry over
to on-screen environments. However, designing with type on screen
poses special additional challenges, and attempts by designers to
simply mimic the appearance of the printed page are mistaken.
This chapter discusses the relationship of typography to screen
environments, especially as concerns legibility, visual hierarchy,
and structuring type on digital pages.
Figure 2.2 The more pixels used to generate the letterform
Figure 2.3 Small type appears on-screen with too few pixels
Screen fonts are bitmaps, which are digitized images made up of tiny dots. To render an outline letterform stored as a Bézier curve on a computer screen, it must be rasterized, or converted into tiny dots called pixels, which is short for picture elements. The relatively low resolution of many contemporary computer screens, which typically have a bitmap matrix of 72 or 96 pixels per inch, cannot display the subtle nuances of a beautifully designed font. When a type’s outline is rendered on a screen, details such as stroke weight, subtle curves, and serif detail are reduced to a coarse approximation of the refined forms found in the original design. This occurs because curved and diagonal edges rendered as pixels on a raster-scan display have a jagged stairstep quality, called “the jaggies.” The more pixels used to generate the letterform, the higher the resolution (Fig. 2.2). When small type appears on-screen with too few pixels to accurately display the subtle forms of the letter, a catastrophic decrease in legibility can occur (Fig. 2.3).

Figure 2.4 Type selection matrix
With rare exception, effective web pages utilize no more than two or three different typefaces. Using more than this number compromises hierarchical clarity. The most important consideration for selecting multiple typefaces is contrast, and variations in contrast are abundant: serif/sans serif, roman/script, bold/light, thick/thin, simple/complex, and functional/decorative. Plenty of contrast between typefaces ensures that each will effectively fulfill its task. Effective contrasts can also be achieved when using different typefaces within the same family, or using all capital letters in relationship to capitals and lowercase. The process of selecting typefaces is one of comparing several combinations on screen until the best possibilities emerge.
Comments
Post a Comment