Typography: Task 3

Week 9 (24/11/2023): The class was attended physically. The lecturer gave us feedback individually and showcased different and more efficient ways to go about creating the fonts.

Week 10 (1/12/2023): The class was attended physically as usual. We submitted our font digitization draft and the lecturer gave us feedback individually. We were asked to further refine our letters.

Week 11 (8/12/2023): We were given the final feedback on our letters, so we had to finalize all the letters in order to upload it into FontLab and turn it into a font. This class was longer than usual, a total of 4 hours of work.

Week 12 (15/12/2023): During class, we posted our posters to be given feedback. Then we were instructed to finalize the poster in class.

2. Instructions & Tasks

Module Brief:

Task 3 (Week 8-9):

Task 3 material: Graph paper + 3 marker pens (your choice but must be 3.0 above)

4 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

- Sketch the following letters ODHNG / odhng using the 3 pens. Explore 3 different writing styles for each of the 3 pens.

-Write all the letters (o l e d s n c h t i g , . ! #) in the approved style and digitise.

Dissection:

I chose the font Univers Std to dissect. Dissection allows you to notice things that are otherwise not noticeable to the average eye. You would think the strokes and letters are symmetrical and equal in width, but you realize upon dissection that it is not; it is balanced and asymmetric for the sake of readability.

In figure 2.0, you can see how in the letter H that the horizontal stroke is slightly thinner in width than the vertical stroke. In "g", none of the circles or arcs are the same, there are slight variation in every arc. In "b", the vertical stroke thins out towards the baseline, and the arc's stroke weight is not the same throughout, it gets thinner as it connects to the vertical stroke.

Fig. 2.0: Dissection Process 1 (22/11/2023)

Fig. 2.1: Dissection Process 2 (22/11/2023)

Fig. 2.2: Dissection of Univers Roman Font (22/11/2023)

Researching:

Before I started sketching, I researched on existing fonts to get inspiration and ideas to create my own. Some of the fonts that caught my eye were Adobe Carlson Pro, ITC Baskerville, and several gothic fonts. I was more interested in serif fonts, so my research was solely on that type of fonts.

Fig. 2.4: Compilation of Font References (23/11/2023)

Sketching:

After collecting references, I start practicing on using the 3 pens (1 broad edge pen, 2 brush pens) to get comfortable with it and to get a better outcome.

Fig. 2.4: 9 Sketches of '"ODHNG"
(23/11/2023)

Fig. 2.5: Practicing with 3 Pens
(23/11/2023)

Fig. 2.6: Sketches of
"OLEDSNCHTIG,.!#"
(23/11/2023)

Digitizing:

At first, I chose sketch number 7 to digitize. I practiced on the letters "ODHNG". For this sketch, I was slightly inspired by gothic fonts, but I wasn't satisfied with any of the 9 fonts I have sketched out. So I retried writing using the broad edge calligraphy pen and settled with that.

Fig. 2.7: Digitization of Sketch 7 Attempt 1 (23/112023)

Fig. 2.8: Sketch Number 7 (23/11/2023)

Fig. 2.9: Compilation of Cut-out Letters (23/11/2023)

After many attempts, I cut out letters I liked most from all the attempts and compiled it into one as you can see in fig 2.9 and then started digitizing it. I started by tracing it one stroke at a time using the pencil tool and then smoothing it so it doesn't look ragged.

Fig. 2.10: Digitalization of Sketch Attempt 2 (23/11/2023)

Fig. 2.11: Process of Digitization 1 (23/11/2023)

After finishing all the letters I combined the strokes (or shapes) together so the letter can be selected as one shape (this is a vital step in order to turn it into a functional font in FontLab.) For letters O and D, I used the eraser tool since the negative ( ) space lies inside the letter and overlaps without making contact with the borders.

Fig. 2.13: Process of Digitization 3 (23/11/2023)

Fig. 2.12: Process of Digitization 2 (23/11/2023)

Fig. 2.14: Digitization First Draft (23/11/2023)

After receiving feedback from the lecturer, I remade my font using a different way. Instead of using the pencil tool and doing it freehand, I used the stroke tool and the calligraphy brush. I first use the pen tool to draw out the general shape of the letter, then add a brush stroke for contrast and enhancing the design. After finishing drawing all the letters' paths, I turn the path into an outline stroke and ensure it has as little vertices as possible; the less vertices, the smoother it is.

Fig. 2.15: Process of Digitization 4 (25/11/2023)

Fig. 2.16: Process of Digitization 5 (25/11/2023)

Since my font design is slanted, I had to keep the angle consistent. I achieved that by ensuring every letter is at the same angle by having a line at that specific angle as a reference. And lastly, after turning the paths into outline strokes, I added the last few modifications according to my liking.

Fig. 2.18: Process of Digitization 7 (25/11/2023)

Fig. 2.17: Process of Digitization 6 (25/11/2023)

Fig. 2.19: Digitization Draft 2 with Guides (26/112023)

Fig. 2.20: Digitization Draft 2 without Guides (26/112023)

After another feedback session, I made some modifications to my letters. Previously, there were a lot of inconsistencies and some letters didn't seem to belong in the same family. I adjusted the weight so it they have the same contrast, and I completely redid T, I, and the punctuation.

Fig. 2.21: Process of Digitization 8 (1/12/2023)

With the help of guides, I ensured that the letters that belong in the same group (i.e. O, D, C, G) have the same spacing and width for consistency.

Fig. 2.22: Digitization Draft 3 with Guides (1/12/2023)

Final Letters Outcome:

Fig. 2.23: Final Construction of Letters PDF (5/12/2023)

Fig. 2.24: Final Construction of Letters JPG (5/12/2023)

Font Lab:

After finalizing all the letters, I uploaded each letter one by one from Illustrator to FontLab7. You have to make sure to check A.I under Vector Artwork in Preferences in order for the scale to remain consistent once you start transferring the letters. I named my font "Racist -AL" because of the fonts similarity to ethnic fonts.

Once I've turned the letters into glyphs, I moved on to kerning and adjusting the letter spacing.

Fig. 2.25: FontLab 7 (5/12/2023)

Fig. 2.26: Kerning in FontLab 7 (5/12/2023)

Fig. 2.27: New Metrics Screen Grab (5/12/2023)

We Adjust side bearings of our letters using the chart provided as a reference. I asked ChatGBT to list down words or come up with phrases using the letters "O, L, E, D, S, N, C, H, T, I, G" to use it in the black and white A4 poster to showcase our font. But I eventually went with what the letters were intended to spell out: "The Design School".

Fig. 2.28: Compilation of Posters Using Racist -AL Font (5/12/2023)

Final Poster Submission:

Fig. 2.30: Final Poster of Racist AL Font PDF (15/12/2023)

Fig. 2.31: Final Poster of Racist AL Font JPG (15/12/2023)

3. Feedback

Week 8 (17/11/2023):

General Feedback: If you're using one side of the pen, stay consistent on that side.

Specific Feedback: The writing looks more like drawing rather than actual writing.

Week 9 (17/11/2023):

General Feedback: If your font has a slant or is at an angle make sure the angle is consistent throughout all the letters by drawing an angle line. The lesser the vertices in the path the smoother the outcome.

Specific Feedback: Instead of using the pencil tool, I could use the brush strokes and edit it to my liking for a cleaner outcome.

Week 10 (12/1/2023):

General Feedback: Ensure consistency; it is the most important aspect of making fonts. Consistency in strokes, weight, and slant. G, D, O, C are grouped together. L, E, N, H, I, T are grouped together, S is alone. The top stroke of S is usually thinner than the bottom. ! needs to be tapered.

Specific Feedback: Letter G needs working on the contrast. G, C, and D need to be more similar to O cause they are derived from it. The vertical stroke on T and I are too thick, they need to be similar to the vertical stroke in D. ! and # do not need to be stylized, look at Bodoni for reference. Looks like a better version of a racist font.

Week 11 (12/8/2023):

General Feedback: shift + minus anchor point: allows you to remove anchor point while retaining the shape.

Specific Feedback: Relatively consistent, but the right stroke on the N needs to be more consistent with the other letters. The G also needs work since generally the curved strokes go down-up, where as the G goes up-down. And the vertical lines on the # should be closer.

Week 12 (15/12/2023):

Specific Feedback: Consistent letter spacing based on the new metrics tab. The poster, however needed some work. The fact that it was tilted from right to left created a large gap of negative space. Needs to be redone.

4. Reflections

Experience

In the beginning of this task, we had to sketch our fonts with a pen and paper. I felt rusty because I haven't put in the effort to make my handwriting look pleasant in a long time. Although it was challenging to get a hang of the angle of the pen, especially the broad tip one, it was a fun exercise. This task taught me a lot about the steps that are typically underwent when creating a font, and how the attention to the littlest details make the biggest differences. I learned how to fully utilize the brush pen tool and work with vectors. It also taught me a lot of patience.

Observations

As I've mentioned before, this is the only physical core subject class. One of the main perks of having physical class is the opportunity to see other classmates' work. In one of our classes, we all displayed our works in our laptop, and we moved around to look at each other's laptops. I found that interaction very helpful, we observed, compared each others' posters, and thought about what it is that makes their designs good. The downside of having classes online, is that we're all isolated, stuck behind our screens, in our own chamber. We do not have a clue what the standard is; what is considered good, and what is considered bad. So, when we have the chance of looking at classmates works, we start to build an idea and a better judgement to critique ourselves with. And I felt like I took it for granted, I hope I will keep this in mind for next time and apply it better.

Findings

In the process of working on this assignment, I learned about Ethnic Typefaces; they are decorative typefaces that are designed to appear as foreign languages such as Arabic, Chinese characters, Hebrew...etc. The designs are often based off stereotypes, which is why it sparked such a controversy. Typography is known to evoke emotions, and especially in today's socio-political climate, the racialization of type has formed.

"Typography is what language looks like." - Ellen Lupton.

5. Further Readings

Garfield Simon Just My Type:

Simon's book Just My Type opens up with "Love Letters", an introduction about Steve Jobs. Steve jobs dropped out of college due to insufficient finances and stumbled upon calligraphy. He learned all about typography and grew fascinated with it, however, he was afraid that he would find no practical use with what he has learned. That is, until, he found a way to integrate it with computer technology. Ten years after he designed his first mac, it came with a wide range of fonts. He also introduced some of his own designs there. This was revolutionary turn that shifted society's relationship with font; it turned from something that was previously limited to just designers and printers to become a part of everyone's vocabulary.

The first chapter talks about the infamous font: Comic Sans; the font that has gone wrong. It was designed by Vincent Connare, but it was never intended to be a typeface. Comic Sans was originally just a solution he has made to what he found wrong with Microsoft Bob, a software package designed to be user-friendly. Additionally, Microsoft Bob was child-friendly and illustrative, but the instructions were written in Times New Roman, a formal and corporate font. Connare found it unfitting, and suggested to Microsoft Bob's designers to redesign it, since he has a professional background and experience with type and kids' software.Connare started designing a font, one that had to be as if it had been drawn by a creative and friendly hand. He used a standard technique at the time, Macromedia Fontographer, drawing each letter repeatedly in a grid till he is satisfied with the style. And he chose a child's soft rounded style for the letters.

Connare's redesign for Microsoft Bob was not a success, but it wasn't because of the font. However, not long afterwards, his work was adopted for Microsoft Movie Maker, which was a massive hit. Comic Sans became global. At first, it was used in greeting cards, birthday invitations, restaurant menus. Then it began being used on the sides of ambulances, BBC, Time Magazines, and Adidas. Comic Sans became the new corporate font, the new Times Roman.

Now, Comic Sans is despised. Some even wrote a manifesto that received global recognition about banning the font! Connare was not phased, he appreciated the attention, and even became the world's most popular type designer for a while.

Links You Might Want to Visit:

Typography: Task 1

Typography: Task 2

Typography: Final Compilation and Reflections

Search This Blog

ALTAIFI, LEEN MAAN A (0367698)

Typography: Task 3

Comments

Post a Comment

Popular Posts

Illustration and Visual Narrative: Self Titled

Illustration and Visual Narrative: Full Compilation

Advanced typography: Task 3