Advanced Typography Task 3: Type Exploration & Application

June 26, 2022

Advanced Typography Task 3: Type Exploration & Application

23 /05/2022 - 2/06/2022 (Week 9 - Week 13)
Evaleez Voo Lian Yun / 0350275
Advanced Typography/ Bachelor of Design (Hons) in Creative Media
Task 3: Type Exploration & Application

Lectures

All lectures 1 to 5 completed in Task 1 and Task 2.

Instructions

Task 3: Type Exploration and Application

For Task 3 we were instructed to develop a font that is intended to solve a larger problem or meant to be part of a solution in the area of our interest (graphic design, animation, new media or entertainment design or any other related area). The end outcome could be a designed font and its application in the form or format that it is intending to provide a solution for, or an exploratory process that solves a problem or adds value to an existing use - MIB.

Research, Ideation and Sketches

Proposal of 3 Ideas

We were instructed to come up with some ideas for this project based on what we were interested in. From the proposal above, you can probably tell how much I like webcomics (definitely not the reason I'm procrastinating). Besides that, as part of my culture, I was also interested in creating a font for the Dusun language as the script it has is incomplete.

Explanation of Chosen Idea

Fig 1.0 Chosen Idea (

I have always liked comics and was always intrigued by its visuals. What I've noticed from reading them is the creative usage of onomatopoeia. What is onomatopoeia? Onomatopoeia is using a word whose sounds causes a tingling effect in your ear and considers you to think of its meaning. This type of words is used mainly when you are writing something related to natural sounds like boom, crackle, fizz. It presents the reader with some variations in the text across the language used, sometimes within the variety of suffixes. With those harsh and funny tones, the reader gets into the depth of the text.

I've been meaning to create these expressive words ever since the webtoon assignment we had in semester 1 for Illustration and Visual Narrative (however hard that assignment was it still brought a lot of joy in the creation process), you can read my webtoon here.

Also, I made a big decision to join a webtoon competition this year, with action as its main genre. So, being able to study something on webcomics would be really useful for my work.

Week 10

After showing my slide to Mr Vinod, he suggested to create a font similar to wingdings, where instead of ABCs it would be symbols.

Onomatopoeia Research

Webcomics:

Fig 1.1 Webcomic Examples (02/06/22)
Source: Bilibili Comics, Webtoon

Fig 1.2 Webcomic Examples (02/06/22)
Source: Bilibili Comics, Webtoon

These screenshots are from webtoons that I am currently reading, they exists of onomatopoeia made from cars, bombs, things hitting the ground, etc.

Pinterest:

Fig 1.3 Onomaopoeia Research (02/06/22)

After going through the references from actual webtoons, I browsed through Pinterest to gain more insight on how to express them.

Week 11

We had no classes this week, so I just started sketching the wingdings.

Sketches

Fig 1.4 Sketches (07/06/22)

I referenced the wingdings available in Windows, where symbols like the smiley face, the radio etc were used. From here, I made wingdings like flames for the onomatopoeia "burn", etc.

Fig 1.5 Digitised Wingdings with character (10/06/22)

Fig 1.6 Digitised Wingdings without character (10/06/22)

After finalizing the sketches, I moved it to Illustrator to test the outcome. Since the wingdings font in windows had smiley faces, I decided to create my own character too!

Week 12

This week, I realized I interpreted Mr Vinod incorrectly. So, I had to redo everything, yes you saw ir right, everything.

*Screaming, crying, rolling on the floor*

I redid one word during class to check whether I was on the right track and Mr Vinod confirmed it for me.

Note: I accidentally replaced the file in Week 13 when I was redoing the font so the old .ai file with the word above is now gone (as you can see the universe was pretty much against me when I was doing this assignment :))

So, here's a screenshot of our lecture:

Fig 1.7 Confirming if I Did Things Right (12/06/22)

Afterwards, I created more for the other letters.

Fig 1.8 Week 12 Outcome (18/06/22)

This assignment reminded me so much of the first task we had in semester 1 - typographic expression. But, however much rushing I had to go through, I managed to create 21 out of 27 letters!

Week 13

This week, I showed Mr Vinod the outcome I had in Week 12 and he confirmed that I was on the right track.

Fig 1.9 Comic Strip 1 (19/06/22)

Fig 2.0 Comic Strip 2 (19/06/22)

I also created the application part, where I chose a comic strip as the application. Mr Vinod, noted that I should add a texture on the comic to make it look like its printed. He also gave a short tutorial on how to create the overlay.

Fig 2.1 Click Process (25/06/22)

Fig 2.2 Click Process (25/06/22)

Mr Vinod noted that I should not make the fonts too similar to the original so, I made some changes to the letterforms. The above is an example.

Fig 2.3 Individual Artboards (25/06/22)

When the letters were done, I created a new file with separate artboards for each letter. This makes it easier to export to svg and import to font forge. I also arranged the letters based on the first letter of the onomatopoeia (at least tried to as some have repeated first letters).

Fig 2.4 FontForge Import (26/05/22)

After getting all the svg files, I began importing them to FontForge and placing the letters in their own sections.

Fig 2.5 Font Forge Trouble (26/05/22)

When generating the font, I realized part of the letters were missing. After inspecting them, I realized they had a detached shape, where the pen lines were not connected. I then fixed them in Illustrator because I wasn't sure on my skills on FontForge.

Fig 2.6 Application (Texture) (27/06/22)

When the font finished generating, I started doing the application - comic strip. I took some comic templates off Pinterest and traced them onto Photoshop. When then was done, I typed in my letters and added textures. As advised by Mr Vinod, I separeted the texture to: one of the paper, one of the black letters.

Fig 2.7 Further Application (26/06/22)

I made a total of 4 pages, with different layouts. With some browsing on the net, I found a book mockup template and decided to upload my pages to see what it would look like book form. (Ngl, it looks really cool to me :>)

Final Outcome

Link to font file: https://drive.google.com/file/d/1_uTEZLX5uxQRAlTSQgo0JtdvHgJgG10B/view?usp=sharing

Onomatopoeia Font

Fig 2.8 Onomatopoeia Font Final Outcome, JPEG (26/06/22)

Application

Comic Template 1

Fig 2.9 Comic Strip 1 (26/06/22)

Comic Template 2

Fig 3.0 Comic Strip 2 (26/06/22)

Comic Template 3

Fig 3.1 Comic Strip 3 (26/06/22)

Comic Template 4

Fig 3.2 Comic Strip 4 (26/06/22)

Comic Book 1

Fig 3.3 Comic Book 1 (26/06/22)

Comic Book 2

Fig 3.4 Comic Book 2 (26/06/22)

PDF Compilation