Labels

Typography - Task 3: Type Design & Communication

05/11/24 - 17/12/24 (Week 7 - Week 13) 
Anggia Tsani Rachmadiyanti, (0368487)
Typography / Bachelor in Design (Hons) in Creative Media / Taylor's University
Task 3: Type Design & Communication (30%)


 CONTENT LIST 


 Lecture: 

Lectures have been completed in Task 1



 INSTRUCTIONS 




Task 

Description:

  • You will be tasked to design a limited number of western alphabets. To begin, choose an existing font design that adheres to the direction that you would like to head in. 
  • Study the font carefully by analysing its anatomical parts. Start with rough sketches, explore a variety of options and upon approval begin digitization of the drawings—software for digitization Adobe Illustrator and later FontLab. Artworks shall be printed out for critique sessions followed by refinements. If time permits we shall generate the font for actual use. 
  • You will endeavour to create a typeface that has the hallmarks of a good typeface; subtlety or character, presence, legibility and readability. Below are the letters you will design: 
  • o l e d s n c h t i g , . ! # Upon completion of the font, you will create a basic A4 size poster displaying your font (further instructions in class).

Learning Goals: 

  • To develop student’s ability to construct a readable and legible font. 
  • To develop student’s ability to design a font with consistent characteristics premised on research and analysis.



Type Design & Communication

 WEEK 7: 

Task 3: Select a preferred font from the 10 fonts provided. Using the following letters H,o,g,b, do a detail dissection of the letters in Adobe Illustrator (artboard size: 1000pt x 1000pt). Write your observations in the eportfolio.

Sketch the letters HOGB / hogb (in both lowercase and uppercase) using the 3 different pens. 
  • Additional reference for TASK 3: the writing tools and letterform styles. Resource: Typography: theory in practice (notes & thoughts), Keith Tam (2014). 
    • The broad-edge pen  (aka. flat nib)
    • The flexible pointed pen (aka. pointed nib / brush)
    • The pointed pen (aka. ball point pen, rounded felt-tip)

(Fig.1) - Additional Reference


  • Explore at least 3 different writing styles for each of the 3 pens. Note: don't draw your letters, write them.

Visual Reference / Research


(Fig 2.1) - Zrnic


(Fig 2.2) - Qaranta


(Fig 2.3) - Low Rider


I loved these 3 examples I got from online. I like the neat look of it and it looks simple and futuristic.

 Overshoot 

(Fig 3) - example of overshoot

  • When rounded or pointed letters like 'O, A' extends over the x-height to make them appear larger than they are to achieve an optical effect of being the same size; it compensates for inaccuracies in human visual perception
  • Overshoot of a round or pointed letter is the degree to which it extends higher or lower than a comparably sized "flat" letter.
 Sketches 

We had to write and test out writing the word 'HOGB/hogb' on a graph paper using 3 different pens and choose 3 styles we like.



(Fig. 3.1) - Testing different writing styles on graph paper


 WEEK 8 (ILW) - WEEK 10 : 

Week 8 - Independent Learning Week (Task 3 continued)

 I used 3 different pens: The broad-edge flat nib pen, Tilted calligraphy pen, & pointed round marker pen: 

(Fig. 3.2) - 3 different style ideas


 Deconstructing:  


(Fig. 3.3) - Dissection on Adobe Illustrator

We were to deconstruct and dissect 'h,o,g,b' letters on Illustrator using one of the existing fonts to see the small details in the font. Mr Vinod ask us to pick fonts that were similar to our sketches. I chose the 3rd style from (Fig. 3.2) above so I used Futura Medium to dissect as it is closest to the style I sketched. 

(Fig. 3.4) - hogb letter analysis


 Digitisation on Illustrator 

I referred to my sketches for guide and started digitising my letters on Illustrator. Here I used the rectangle shape tool and pen tool to create the straight strokes first. Then I used the curve tool to make some points rounded. I wanted to make a modern look but also a chubby and fat look. I made the widths of the stem of all letters same size too so that the fonts look consistent and neat.

(Fig. 4) - sketching out all the other letters pre-digitisation



(Fig. 4.1) - screenshots of progress on illustrator using shape, curve and pathfinder tool

 told me to try letter 'q' and 'k' for extra as she said it's an interesting letter to do, so I added 2 of those letters as an extra...



(Fig. 4.2) - final fonts using illustrator (extra b, q, k)


  FontLab : 

After digitising, I transferred the letters to FontLab:

(Fig. 5) - character map on FontLab



(Fig. 5.1) - adjusting letter spacing on FontLab Screengrab

here I adjusted the left and right spacing of each letter to the same amount so it look consistent. For the comma and full stop, I increase a bit of the spacing so that it's not too cramped to the letters. Then I finally downloaded the font to .ttf file.

 FINAL FONT: 




(Fig. 6) - Final 'BladeLiner' Font Construction JPEG (20/11/2024)


(Fig. 6.1) - Final 'BladeLiner' Font Construction PDF (20/11/2024)

Measurements:
Ascender: 606 pt 
Cap Height: 560 pt 
X-height: 341 pt 
Descender: -163 pt


(Fig. 6.2) - Final 'BladeLiner' Font Poster JPEG (20/11/2024)


(Fig. 6.3) - Final 'BladeLiner' Font Poster PDF (20/11/2024)


 TEST OUT MY FONT HERE: 

Test the font by typing some words below...


*Only type in these alphabets/symbols: ( o l e d s n c h t i g b k q , . ! # )





 FEEDBACK 

Week 7:
  • General Feedback: Ms.Vitiyaa checked all our Task 2 print outs and then we had to finalise our task 2 eportfolio by today. Then, we had to start doing Task 3 research and sketches using the 3 pens on the graph paper. We had to select a preferred font from the 10 fonts provided. Using the following letters H,o,g,b, do a detail dissection of the letters in Adobe Illustrator (artboard size: 1000pt x 1000pt). Write our observations in the eportfolio. We then had to sketch the letters HOGB / hogb (in both lowercase and uppercase) using the 3 different pens on the graph paper. 
  • Specific Feedback: For final checking of my previous Task 2 (Bauhaus), I printed out my work in A3 and ms Vitiyaa checked it. She said I needed to remove some hyphenated words since there too many words that are hyphenated. But everything else is ok. So I edited it all the hyphens in InDesign and finalised it and finished it.



Week 8:
  • ILW PROGRESS: First, I tried finding some inspirations from websites. At home I wrote 3 style of HOGB letter on the graph paper using 3 different markers and picked one of the style i like. Then  I dissected HOGB letter and tried deconstruct it using Futura as my chosen font because I was planning to go to a modern and simple, clean style. Once I found my chosen style I like, I wrote the letters (b o l e d s n c h t i g , . #) on the graph paper using the same style i did and then digitized them on illustrator using the shape builder tool, shape tool and curve tool.

Week 9:
  • General Feedback: We had to continue with our digitisation and had to export it to fontlab app. We have to finish this task by next week. She also showed us an example of a good blog portfolio so that we can improve more on making out blog neat and nice. 
  • Specific Feedback: Ms Vitiyaa said my digitised fonts were all ok but she told me to try letter 'q' and 'k' for extra as she said it's an interesting letter to do, so I added 2 of those letters as an extra. For my Task 1 & 2 portfolio she checked all of ours and for mine she said everything is nice but only that I need to change all my font size to the same sizes for all my (Fig.) figures and make it a bit smaller than the body text.

Week 10:
  • General Feedback: Idea sketches, the process of generating font in Fontlab need to be documented in e-portfolio. Try not to watch tutorial and do it at the same times, this might cause missing of important steps. We had to watch the video demo on FontLab and continue to refine our letters in class.
  • Specific Feedback: Ms Vitiyaa said my portfolio and work progress so far is nicely compiled and she said the font design is overall good to go. I continued on fixing slight errors and tried to start putting the letters in FontLab as i've finished my part on Illustrator.

Week 11:
  • General Feedback: Ms told us that after we are done with our fonts, we had to continue making an A4 poster showcasing our fonts on illustrator.
  • Specific Feedback: Ms Vitiyaa said my final fonts were nice and so I proceeded in making and finalising my final A4 poster on Illustrator.

Week 12:
  • General Feedback: Ms told us that by next week we have to finish everything as well as our blog and make sure all links are working. 
  • Specific Feedback: Ms told me to change my words and sentences for my poster to have something related to design. She also told me to change the alignment as it looks odd. So i finalised it and she said it looks better.

Week 13:
  • General Feedback: We had to make a new post for our Typography Final Compilation & Final Reflection, and we need to make sure that all Fig. are visible and all embedded files are working. She told us that the jump links must work.
  • Specific Feedback: Ms said that my poster is now ok compared to last week and I can proceed with it.



 REFLECTION 


1) Experience
  • Overall, this project was enjoyable for me personally as it was pretty fun getting to make my own font from sketches. While doing the calligraphy, I discovered how to invent via my own experience from dissecting the sans serif font to the final! Sometimes it's quite challenging too especially getting used to handling the calligraphy markers and pens and doing it on graph paper. It took some time for me to finally know how to hold it at a proper angle. Most of the ink piled up in the beginning of the stroke, resulting a big fat stroke than subsequent strokes. 
2) Observations
  • I observed that in making fonts, you have to be really detailed. While adjusting the size of a letter in my own font design, sometimes I would directly press 'Unite' but then as i zoom in i see that some shapes are not touching each other properly or not in line. I also press Shift to enlarge it with ratio, which it will increase the stroke weight, leading to not consistency if there are big changes and therefore as said --- slight differences in thickness due to optical/TECHNICAL reasons. I realise that while creating and building the shapes and strokes I have to properly zoom in often to check for little mistakes.
3) Findings
  • Designing and developing a typeface was a challenging process, but I believe it was the most educational experience for me. Creating letters from the ground up helped me appreciate the unique nuances and features of each character. It also required a blend of creativity and technical expertise. Although I was already familiar with Illustrator, I discovered new techniques and insights as I worked on designing my typeface.  I found that there are many ways to build the font on illustrator. I now know that creating a font really takes a lot of time, detaild-ness and focus. Measurements of the spacings and width/heights are also really important as well as the angle, since a typeface have to be consistent. During these whole series of analyzing and creating typography and fonts, what I gained the most might be observation skills --- I find myself getting more and more able to notice the calligraphies and typographies in my daily life. I tried applying into my work of what I see/learned from my observation of others' work, perhaps I can apply into future works too.



 FURTHER READING ... 

1) Thinking With Type - Ellen Lupton

(Fig. 7) - 'Thinking With Type'

This was such an interesting book!  The text is divided in neat little sections regarding every aspect of the page, starting from the birth of calligraphy styles and the typefaces they inspired, up until the use of the space in a page and the editing process. The information is very basic, but the presence of clear (and sometimes funny) examples, as well as further recommendations for each specific topic, make it a great basis to learn a new skill: how to use a blank page to the best of your abilities and how to think like a graphic designer.



2) Why Fonts Matter - Sarah Hyndman

(Fig. 7.1) - 'Why Fonts Matter'

This book was in general just about how fonts affect what we read and influence the choices we make everyday. I like how it talks about the science and the art behind how fonts influence you. It explains why certain fonts or styles evoke particular experiences and associations. Fonts have different personalities that can create trust, mistrust, give you confidence, make things seem easier to do or make a product taste better. They're hidden in plain sight, they trigger memories, associations and multisensory experiences in your imagination. * Fonts can alter the meanings of words right before your very eyes. * 



SEM:

Comments

Post a Comment