Typography-Task 3: Type Design & Communication

16.05- 26.06 / Week 7-Week 13
Liang Lina / 0347076/ Bachelor of Design(Honours) in Creative Meida
Typography
Task 3

INSTRUCTIONS

CLASS SUMMARY

Week 7/ Task 3: In the second half of this week's lesson Mr. Vinod introduced us to a new task where we had to choose one of the 10 fonts given to us to analyse the decoupage section - decoupage letters. mr. Vinod suggested that we practice having ascending, descending, X-height and uppercase letters, lowercase letters. Then we should try to draw different lines (horizontal, vertical, diagonal) round and partial letters using different tools. We should keep the same angle throughout the style we are trying, different angles and pressure will all lead to different results. This exercise will help us to coordinate our writing, creating a unique style of our own (same angle, same pressure, same speed, etc.) requires a lot of practice. I used five different pens to practise this activity, Mr.Vinod reminds us that the letters don't have to be written in one stroke, most of the time it is possible to use more than one stroke, which is easy for me, but requires a lot of repetition.

Week 8/Task 3: This week was an independent learning week, no f2f lessons or online classes, continuing the writing activity from week 7, using 5 different pens and practising 5 different angles, from which you chose your favourite one to start practising and exploring a specific style.

Week 9/Task 3: During this week, we continued practising our writing activities and Mr.Vinod first explained to us how we would be doing task 3, choosing the final version among the preferred angles and fonts for the digitising stage. Mr.Vinod then showed and demonstrated to us how to convert letters into digitised ones using Adobe Illustrator. The first one is to use the brush tool in combination with the pen tool to work with details. The second is to use the pen tool before using the brush tool. The third is to use basic shapes and use the Pen tool to modify them so that they resemble handwritten letters. The third method takes more time, but is more precise. For the rest of the lesson we watched a video by Mr. Vinod to help us understand how to create a drawing board as required. We also digitised the handwritten letters during the lesson.

Week 10/Task 3: This week, Mr.Vinod began by explaining how we could benefit from Ms.Liu XinXian's presentation "BARANG2 SENDIRI S'JA - The Malaysian Commercial Vehicle Label". Sometimes we notice things but we don't really look into them, this presentation provided knowledge that we see but we don't care about in our daily lives. For the rest of the day, Mr.Vinod checked our work from last week, where our handwritten letters became digital. He then told us that writing was only the beginning of designing the typeface and that to do so we needed to refine our digitised content, a refinement process that would take a lot of time. Mr.Vinod then started to explain to each of us what they should do to digitise their letters.

Week 11/Task 3: During the week, Mr.Vinod asked us to cross-check each other's blogs and asked us to provide feedback on an individual basis, we had to pick four students, two local and two foreigners. After providing feedback on the blog, Mr.Vinod gave us feedback on the digital version. The design phase ended this week and we had to fix the comments and feedback provided by Mr.Vinod during the week to achieve maximum refinement for our transfer to FontLab. Mr.Vinod showed us and demonstrated the steps of how to transfer letters to FontLab, including the settings (preferences) and also showed how to How to make individual word spacing adjustments.

Week 12/Task 3: After Mr.Vinod explained and showed us an example of Task3, what we should do in the blog, and in addition we had to create another blog post with all the final submissions for all of us, from Task 1 to Task 3. Afterwards, Mr.Vinod gave feedback and advice on the font posters that each of us presented, and we had to ensure that the posters followed the rules set out last week. After receiving Mr.Vinod's feedback we worked on the changes.

Typography-Task 3: Type Design & Communication

1: Type Design & Communication

Typography Anatomy: Typography anatomy introduces us to the different parts of the alphabet, such as X-high, ascenders, descenders, baselines, serifs, counters and so on. We have to know this information when sketching and creating sketches.

Fig. 1.1 Typography anatomy

Basic Concepts: The basic concepts of type design include stroke, counter, body and structural groups.

Stroke: refers to the main, continuous line that forms the shape of a letter. It can be thick or thin and may have different degrees of modulation or contrast within a typeface.

Counter: refers to the enclosed or partially enclosed space within a letterform. It is the negative space surrounded by the stroke.

Body group: includes the letters that have a similar basic shape or structure, such as the lowercase letters in a typeface. These letters typically share similar characteristics, such as x-height, baseline, and overall proportions, to maintain consistency and harmony within the typeface.

Structural group: comprises letters that share similar constructional elements. Archetypal groups can be made on the basis of the dominant strokes of each letter: verticals and horizontals (E F H L T), diagonals (V W X), verticals and diagonals (K M N Y), horizontals and diagonals (A Z), circular strokes (C O Q S), circular strokes and verticals (B D G P R U), and verticals (I J).

Deconstruction References: By deconstructing letters, designers gain a deeper understanding of their structure, enabling them to create more informed and intentional typographic designs. It facilitates exploration, experimentation, and customization, leading to innovative and impactful typographic solutions.

Fig. 1.2 Deconstruction References

2: Writing Activity

Exercise 1:

Writing diagonal, horizontal, vertical and circular lines for all 5 tools in 5 different ways for each tool.

Writing AOTMX for all 5 tools 5 tools in 5 different ways for each tool.

5 tools in 5 different ways for each tool:

Fig. 2.1 Writing Activity (16.05.2023-Week 7)

Fig. 2.2 Writing Activity (16.05.2023-Week 7)

For this event, it was the same angle of presentation of each pen. I realised that it was difficult to recreate a different style of writing from different angles. We needed to keep track of the different angles to keep each one consistent. This activity was interesting in that we could use different writing styles and also explore and practice different writing styles using different tools.

Exercise 2:

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. Choose either UPPERCASE or lowercase to write in.

Exploring different styles of writing:

Fig. 2.3 Writing Styles (23.05.2023-Week 8)

Practising and Resolving Letters :

Fig 2.4 Practising and Resolving Letters (23.05.2023-Week 8)

Final option:

Fig. 2.5 Final option (30.05.2023-Week 9)

3. Analysis

We have to choose one of the 10 fonts given by Mr. Vinod and analyse them from Fontshare, anatomical parts-deconstruction of patters. As Mr. Vinod suggests, we analyse them by choosing lowercase letters with the following characteristics: ascending, descending, x-height and So I chose a total of 4 letters to analyse: "n k y A".

Fig. 3.1 "n" (16.05.2023-Week 7)

Fig. 3.2 "k" (16.05.2023-Week 7)

Fig. 3.3 "y" (16.05.2023-Week 7)

Fig. 3.4 "A" (16.05.2023-Week 7)

My own writing: "a" "n"

Fig. 3.5 "a" (13.06.2023-Week 11)

Fig. 3.6 "n" (13.06.2023-Week 11)

4: Digitisation

Requirements：

1000 x 1000pt art boaed; 500pt x-height*; cap line; descender and ascender line; baseline and median line. subject to your design, it can be smaller or bigger.

Exercise 1:

After identifying the latest fonts, the digitisation process was started. Here is a version of the first attempt at digitisation.

Fig. 4.1 Digitisation Process 1 (30.05.2023-Week 9)

Fig. 4.2 Digitisation profile 1 (30.05.2023-Week 9)

Exercise 2:

Then start making changes to the digitisation, this is the first version, I have copied two to make it easier to make changes and to avoid me not being able to go back to the original state if one of the fonts goes wrong.

Fig. 4.3 Digitisation Process 2 (06.06.2023-Week 10)

Fig. 4.4 Digitisation profile 2 (06.06.2023-Week 10)

Refinement Exercise 3:

After the typeface has been digitised, we need to refine the details, we need to add some features to the letters and we need to refine each letter until we are satisfied. I need to learn from Mr.Vinod's approach and I will copy each little refinement so that I don't lose the original version.

Fig. 4.5 Refinement Process 1 (06.06.2023-Week 10)

I don't like the refinement in this version, it feels weird, I just wanted to add a little tick to the vertical strokes to show that I had refinement.So I tried again, but perhaps I didn't need to add any details.

Fig. 4.6 Refinement Process 2 (06.06.2023-Week 10)

Fig. 4.7 Not Refinement Process 3 (06.06.2023-Week 10)

After completing the letters, Mr.Vinod asked us to continue creating some symbols ", . ! #". After having a look at the fonts I created myself, I felt that my fonts lend themselves better to uniformity, so my symbols are for the most part the same as the fonts I created.

Fig. 4.8 Fonts+Symbols (13.06.2023-Week 11)

During the class Mr.Vinod gave me feedback on my font symbols etc., so I made specific letter changes.

Fig. 4.9 Change Fonts+Symbols (13.06.2023-Week 11)

Fig. 4.10 Comparison of details (13.06.2023-Week 11)

Fig. 4.11 Specific change of letters (13.06.2023-Week 11)

In week 12 I found a problem that my fonts were separate in FontLab, I asked Mr.Vinod in class and he helped me to solve this problem.

Fig. 4.12 Final pre sentation contrast (20.06.2023-Week 12)

Measurements (from baseline):

Ascender: 730pt

Capital height: 690pt

Median: 500pt

Desender: - 230 pt

Fig. 4.13 Measurements (13.06.2023-Week 11)

Final Presentation

Fig. 4.14 Out come (20.06.2023-Week 12)

5. FontLab

After completing my letters and punctuation in Adobe illustrator, we needed to perform the task in FontLab, the software that needed to copy and paste the letters I had created into FontLab. So, before transferring my letters and punctuation, I watched a video posted by Mr.Vinod, who showed us how to set up the application and copy them according to the measurements.

Fig. 5.1 AI to FontLab (13.06.2023-Week 11)

After copying and pasting all the letters and punctuation I had created in Adobe illustrator, I did a spacing adjustment where I had to adjust the spacing for each letter individually until I thought it was right. I took reference from my classmate's method of spacing each letter individually to match the rest of the letters so that I didn't miss different combinations of letters.

Fig. 5.2 adiustment process (13.06.2023-Week 11)

Fig. 5.3 Individual Kerning(13.06.2023-Week 11)

The only letters available were formed into words through ChatGPT and then I did a word-spacing experiment by forming a sentence through these words.

Fig. 5.4 Testing the Outcome (13.06.2023-Week 11)

6. Poster

Once our fonts are ready to be applied, we need to use the fonts and we need to use a phrase in the limited number of fonts we have created, trying to add all the fonts we have created.

Fig. 6.1 Poster attempts (20.06.2023-Week 12)

Shortlisted Posters

Fig. 6.2 poster 1 (20.06.2023-Week 12)

Fonts: L Lina; Itc garamond std(U1tra condenset Italtc)

Point size: 110 pt; 12 pt

Leading: 130 pt; 14 pt

Fig. 6.3 poster 2 (20.06.2023-Week 12)

Fonts: L Lina; Itc garamond std(U1tra condenset Italtc)

Point size: 110 pt; 12 pt

Leading: 130 pt; 14 pt

Final poster

Finally, I changed my colour, not a solid black, but a comfortable looking colour.

Fig. 6.4 final poster (20.06.2023-Week 12)

Fonts: L Lina; Itc garamond std(U1tra condenset Italtc)

Point size: 110 pt; 12 pt

Leading: 130 pt; 14 pt

Final Type Design & Communicarion

Font download:

https://drive.google.com/file/d/1wMnAYkbxJ6lrHazOVgD_Fa4ULz5hlCcL/view?usp=sharing

Fig. 7.1 Fianl task 3 type design and communication"L Lina" -JPEG(20.06.2023-Week 12)

Fig. Final task 3 "L Lina' - JPEG (20.06.2023-Week 12)

Fig. 7.1 Fianl task 3 type design and communication"L Lina" -PDF (20.06.2023-Week 12)

Fig. 7.3 "L Lina" Screen Grab from FontLab (20.06.2023-Week 12)

Fig. 7.4 final poster - JPEG(20.06.2023-Week 12)

Fig. 7.4 final poster - PDF (20.06.2023-Week 12)

FEEDBACK

Week 9：

General Feedback: Follow specific steps for step-by-step writing activities without jumping straight to designing five selected options without writing five styles using five tools.

Specific Feedback: You need to select what you think is the highest to digitize and treat it carefully in Adobe illustrator.

Week 10：

General Feedback: The digitisation already done last week is the digitised version of the next writing. Next we need to refine the letters even more to achieve a better alphabet. Copy the letters as you refine them, keep what is there and update the letters from the original.

Specific Feedback: After the first refinement, your letters should remain consistent, though at what angle, with vertical strokes, horizontal strokes, and with every detail of the bend.

Week 11：

General Feedback: The subject tag markings may vary due to different fonts, analyse the different types of subject tags to understand the nuances. The size of the stem strokes of the description tag varies (top and bottom).

Specific Feedback: 'G's ball must reach the baseline.

'a' is at least slightly below p's baseline.

and the full stop needs to be readjusted.

The base line is in the wrong position and needs to be readjusted. The entire center line and sinker line must be within the drawing board.

Week 12:

General Feedback: Include as many letters as possible and this information can be used to link sentences. When words are embedded in sentences, be sure to pay attention to the word spacing between letters, as some of the spacing may vary depending on the shape of the letters.

Specific Feedback: My fonts should become one in AI, they are not separable in FontLab and I have to re-import my fonts into FongLab.

REFLECTIONS

Experience: This task was special and different from all the previous ones, it was a fun task that I enjoyed and I was able to create some of the fonts I wanted. Each step of the process was full of my own ideas, from exploring different tools to different angles of the style to digitising and refining the font. There were some difficulties with the process but overall it was fun and left me feeling full of anticipation.

Observations: Through this task, I observed that the writing exercise was important to us as a first step to what we wanted from the typeface, and that each variation brought about by different factors was unknown and required repeated attempts to produce results that were fresh. I also observed that deconstructing the letters allowed us to observe different features.

Findings: Through this task, I found that getting to know type is an interesting process, and even if the words are written by you, there are still endless possibilities in the process of creating them. It requires a balance of creative precision and attention to detail. And to discover the whole process of designing typefaces, we also need a lot of discovery, observation, research, etc. It also requires patience and precise adjustments to each typeface.

FURTHER READINGS

Fig. 8.1

Typography is a constantly evolving discipline that provides a concise and comprehensive overview of the information, vocabulary, tools, and methods used in effective typography design practices.

This book has a total of 13 chapters, including the history of typesetting and a series of content such as Anatomy, Legibility, and Typographic Grid.

Chapter 3: Legibility

Chapter 3 describes typographic legibility, which is always overlooked. But it is a subject that needs careful study and constant evaluation.

Basic Principles Of Legibility: As signs representing sounds in spoken language, letters are basic to legible typography. The primary purpose of a letterform is to convey a recognizable meaning to the mind. Therefore, letterforms must be designed with clarity, each being distinct within the alphabet. The contrast among individual characters makes it possible for the reader to decipher written information without confusion. The most legible typefaces are those timeless examples characterized by three qualities upon which legibility is dependent: contrast, simplicity, and proportion. These typefaces exemplify beautiful and functional letterforms.

Fig. 8.2 Basic Principles Of Legibility

Legibility And Digital Typography: New legibility issues emerged when the digital revolution occurred in typography and design. This includes concerns relating to software, discussed in this section, and problems related to on-screen display, covered in Chapter 8.

Fig. 8.3 Legibility And Digital Typography

Typographic Details:

Fig. 8.4 Typographic Details

Lianglina(0347076）

Search This Blog

Typography-Task 3: Type Design & Communication

Comments

Post a Comment