Typography Task 3

21.11.2023 - 19.12.2023 (Week 9 - Week 13)
Ng Kar Yee / 0367743
Bachelor of Design (Honours) in Creative Media
Typography / Task 3

INSTRUTIONS

TASK 3

EXERCISE⇒ TYPE DESIGN & COMMUNICATION (FONTS DESIGN)

For our third task, we were introduced to Type Design and Communication (Font Design), which can be known as designing fonts for writing or display to enhance readability while emphasizing particular ideas or feelings. Mr Vinod and Ms Low gave us a head start by explaining the guidelines for the task and showing us the basic on how to create a font.

RESEARCH

The idea of type design and communication (fonts design) is to creatively design a letter form while still following the anatomy of typography as well as still easily visible to others. To start, I did some research on what is type design and the examples of font designing done by others.

Figure 1.0 The anatomy of typography, week 9 (21/11/2023)

Figure 1.1 Examples of font design from Pinterest, week 8 (14/11/2023)

Figure 1.2 Examples of font design from Google, week 8 (14/11/2023)

Figure 1.3 Examples of Thai font design, week 9 (21/11/2023)

Figure 1.4 Examples of Sanskrit font design, week 9 (21/11/2023)

SKETCHES

After doing some research and getting advices from Ms Low, I started on the sketching process for my task. We were instructed to use 3 different type of makers to sketch.

Figure 1.5 Sketch attempt no 1 to 11, week 8 (14/11/2023)

Figure 1.6 Sketch attempt no 12 to 14, week 8 (14/11/2023)

Figure 1.7 Sketch attempt no 15 to 23, week 8 (14/11/2023)

After getting Ms Low and Mr Vinod's feedback, we concluded with sketch type number 20. Ms Low suggested to improved the sketch based on Thai letters or Sanskrit fonts as an example.

Figure 1.8 Improved sketch attempt 1, week 9 (21/11/2023)

Figure 1.9 Improved sketch attempt 2, week 9 (21/11/2023)

Figure 2.0 Improved sketch attempt 3, week 9 (21/11/2023)

DIGITIZATION

After getting Ms Low's feedbacks for the final sketching, I began with Mr Vinod's tutorial videos on digitization. Then, I started trying digitization.

Figure 2.1 Digitization process, week 10 (28/11/2023)

⇓

Figure 2.2 Digitization process, week 10 (28/11/2023)

I added a loop when constructing both of the letter d and g so that all the letters have the same theme and style.

Figure 2.3 Digitization process, week 10 (28/11/2023)

⇓

Figure 2.4 Digitization process, week 10 (28/11/2023)

Then, I reconstructed my letter n as the loop of the letter n was not obvious and smooth

Figure 2.5 Digitization process, week 10 (28/11/2023)

⇓

Figure 2.6 Digitization process, week 11 (05/12/2023)

Next, I reconstructed the letter o l e d n h t i g. I adjusted the width for the letter o to be thick and even on both side as it was more visibly smoother. After that, I adjusted the style and the size of the loop in the letter l d h and t to be the same. I also did some adjustment for the letter e t g's loop to be more rounder and even. For the letter i, I changed the direction for the head to match the overall font's design.

Figure 2.7 Digitization process, week 11 (05/12/2023)

⇓

Figure 2.8 Digitization process, week 11 (05/12/2023)

After the major adjustments, I wanted my font to have a little incline therefore, I used the guide tool to rearranged the letters to have the same incline angle.

Figure 2.9 Digitization process, week 12 (12/12/2023)

After getting a few feedbacks from Mr Vinod and Ms Low, I adjusted the width of the letter c to be thinner so that it matches the overall styles of the fonts. Besides, I also redesigned my # to be more a simple style as it was too complicated for the overall style of the fonts.

Figure 3.0 Digitization process, week 12 (12/12/2023)

FINAL DIGITIZATION

After getting some feedbacks from Ms Low and Mr Vinod for the digitization, I made some adjustment for the fonts to make it more smoother and complete.

Figure 3.1 Final digitization process (Line), week 12 (12/12/2023)

Figure 3.2 Final digitization process (Shape), week 12 (12/12/2023)

Figure 3.3 Final digitization process (JPEG), week 12 (12/12/2023)

Figure 3.4 Final digitization process (PDF), week 12 (12/12/2023)

FONTLAB 7

After finalizing our digitization process, we moved on to the next step which is creating our fonts in Fontlab 7. For the next step, Mr Vinod introduced us to an new app which is Fontlab 7, which basically enable us to create and edit our fonts and convent it to our Windows/IOS so that we are able to use our designed fonts realistically.

To start off, I began by downloading the app and watched Mr Vinod's tutorial videos on how to use Fontlab 7. After merging the shapes of my fonts and adjusting the minor details in Illustrator, I converted my fonts into Fontlab 7.

Figure 3.5 Converting process from Illustrator to Fontlab 7, week 12 (12/12/2023)

Figure 3.6 Adjusting Process, week 12 (12/12/2023)

After converting all the letters, I adjusted all the letters one by one with the direct selection tool to have a more smoother and complete font.

Figure 3.7 Guide for lowercase left and right side bearing measurement, week 12 (12/12/2023)

Figure 3.8 Fontlab 7 Screengrab, week 12 (12/12/2023)

After that, I adjusted the left and right side bearing measurement for the fonts following the guide provided by Mr Vinod.

Family Name: Lushhh
Ascender: 433pt
Decender: -200pt
Cap Height: 337pt
X-height: 213pt
Left Bearing: Between 0 to 30
Right Bearing: Between 0 to 30

FINAL FONTS IN FONTLAB 7

Link for final font design

https://drive.google.com/file/d/1wLVwLuK1EjcP_vOo7m5zWtTr_VxUEM8k/view

Figure 3.9 Final fonts in Fontlab 7, week 12 (12/12/2023)

FONT TESTER

To operate the font tester, please form a word or sentence using the letters

o l e d s n c h t i g # ! , .

BLACK AND WHITE POSTER

After converting my fonts in fontlab 7 and exporting the fonts in my Window, Mr Vinod instructed us to create an A4 black and white poster which our font is mainly displayed. I formed a quote echoing lights design silent nights from the letters we had with the help of Chat GPT.

Figure 4.0 Layout attempt 1, week 12 (12/12/2023)

Figure 4.1 Layout attempt 2, week 12 (12/12/2023)

Figure 4.2 Layout attempt 3, week 12 (12/12/2023)

FINAL BLACK AND WHITE POSTER

After getting some feedbacks from Ms Low for the layouts for my posters, I finalized with layout attempt 1.

Figure 4.3 Final black and white poster (JPEG), week 12 (12/12/2023)

Figure 4.4 Final black and white poster (PDF), week 12 (12/12/2023)

FEEDBACK

WEEK 9

General Feedback

Split the digitization into 3 artboard, stroke, shape and merge
Save the original copy of the digitization to make future chances in fonts more easier

Specific Feedback

Can refer to Thai letters or Sanskrit fonts as an example to improve on sketched fonts

WEEK 10

General Feedback

Align fonts in a single line when getting feedback
Font lab need to be downloaded before next week class
Artboard in illustration need to be 1000 pixels for the current assignment

Specific Feedback

Don't need so many anchor in one path
Try to adjust the anchor of the path with the handle instead of adding new anchors
The curves of the fonts need to be more rounder

WEEK 11

General Feedback

Try to put anchor points in core part of a letter and reduce the numbers of the anchor points in a letter as it will be difficult to adjust the letter if there are too many anchor points
Advice to go through the tutorial videos on how to use fontlab 7 for next week's class

Specific Feedback

Fonts still need some adjustments
The loop in the letter e need to be more bigger
The direction for the letter i's head maybe can change

WEEK 12

General Feedback

Letters must be extend into shape form and merged before converting into Fontlab 7
Follow instructions given in Teams to adjust the setting in Fontlab 7 before starting
Follow guidelines given in Teams to adjust the left and right bearing
Advised to mainly focus on adjusting the left and right bearing before adjusting other letters
Byline in poster must be in Univers LT Std. at 8pts

Specific Feedback

The letter c still need some adjustment in width
Need some improvement for the # design
Fonts in Fontlab 7 looks ok

REFLECTION

Learning Type Design and Communication (Font Design) was quite interesting as we get to learn how to design our own fonts and the anatomy of typography like the x-height, median and cap height. It was also my first time designing my own font and I also found out that there are different type of fonts in the world like Sanskrit and the uniqueness in Thai fonts. For this task, we got to learn new skills like how to use Fontlab 7 as well as how to use the brush tool and width tool to create a font in Illustrator while combining the skills we previous learned like kerning. Therefore, this task was quite a fun and challenging as I get to increase my knowledge and design skills in fonts.

Visual configurations were invented by combining letters from the English alphabet and single-digit numbers (Figs. 11-1 to 11-4). Scale, proportion, weight, and shape relationships between two different signs were explored.
Objectives of this exercise include introducing letterform drawing and drafting skills, using typographic joinery to unify the two distinct forms into a visual gestalt, and understanding the variety of spatial relationships that can exist among characters.
Letterforms in an old section of a European town were studied and documented through drawing, rubbings, and found material. A black-and-white letter composition was developed, depicting graphic qualities found in the assigned area. On a formal level, compositional issues such as dynamic asymmetrical composition and form-counter form relationships are explored. On an interpretive level, the ambience of a historical area is translated into a typographic configuration (Fig. 11-5).

Figure 3.0.1 Letter digit/configurations

2. Urban letterform studies

Letterforms in an old section of a European town were studied and documented through drawing, rubbings, and found material. A black-and-white letter composition was developed, depicting graphic qualities found in the assigned area. On a formal level, compositional issues such as dynamic asymmetrical composition and form-counter form relationships are explored. On an interpretive level, the ambience of a historical area is translated into a typographic configuration (Fig. 11-5).

Figure 3.0.2 Urban letterforms studies

3. Flowering Typographic

Selected letters of the alphabet were combined with images of flowers that have been reduced into visually simplified forms. Each letter is coupled with a flower whose name begins with the chosen letter. In the examples shown, A is for alyssum (Fig. 11-6), K is for Kirengeshoma (Fig. 11-7), J is for jalap root (Fig. 11-8), and H is for hollyhock (Fig. 11-9).
A primary objective of this project is to achieve a harmonious synthesis between type and image, and in the process create a new visual configuration. It is essential that both the letterform and the flower be recognizable in this hybrid form. This project is also concerned with exploring the dynamic relationship between

Figure 3.0.3 Flower Typographic

4. Inventing Sign Systems

A set of nine signs were invented (Figs. 11-10 and 11-11). Each was required to be a distinctive mark, with unique optical characteristics, yet harmonious with all the other signs and clearly recognizable as part of the set.

Figure 3.0.4 Inventing sign system

NG KAR YEE (0367743)

Search This Blog