Advanced Typography: Task 3

25/10/2023 - 01/12/2023(Week 9 - Week 14)

Seh Zi Qi/ 0355872/ Bachelor of Design(Honours) in Creative Media

Module Name: Advanced Typography

Task 3

LIST

Task 3:

LECTURES

Click here for the lectures.

CLASS SUMMARIES

Week 9:

We started the class by showing off our proposals and the progress made on the font. Once we were done, Mr Vinod gave us time to work on our font

Week 10:

We started off the lecture by checking our digitised capital letters and giving us feedback on how to improve on creating our letters. When giving me feedback, he told me to look at someone else’s portfolio to gain better insight on how to create a better font; I was also sent out on a small field trip to look at the font at the student dorms, which was made by students, as to gain more inspiration on what I want to make.

Week 11:

We worked on our font the entire class time.

Week 12:

I went up to the computer room to finish my illustration and kerning during class time.

Week 13:

I finished up kerning during class time and started on some presentations and applications for the font.

Week 14:

I finished up some applications of the font and went ahead with finishing and submitting the task 3 portfolio.

INSTRUCTION

_______________

Task 3 Type Exploration & Application

"To be effective you will need to study your selected area, look at how type is used in the area and identify potential weaknesses or possible areas of further exploration or experimentation. You can then attempt to provide a creative solution or add value to an existing use."

____________

Research & Sketching

We had to make a few proposals before we created the fonts.

The first proposal was to solve problems within animators, where animators don’t really go in-depth with their processes when creating animations, therefore it’s hard for new people to find viable(?) references that show the processes of professional animators.

To combat this, I want to create a font that helps with that process. Since everything is digital, animators can use this font to type out their processes which can make it easier for people who want to look at the details and processes of the animation created.

Fig 1.1, First proposal, 30/10/2023

My second proposal was to create a font that was derived from one of the 7 world wonders, the Leaning Tower of Pisa. Even if the wonders are quite popular, there aren’t a lot of fonts that showcase those wonders so whenever someone makes a vlog or animation, they can use this font to showcase where they are.

The font will originally be italic as it is leaning, and the corners will be rounded since the arches inside the tower are rounded and leaning into the characteristics of the tower, I will make the font uneven as that shows the leaning aspect of the tower.

Fig 1.2, Second proposal, 30/10/2023

My third proposal is to create an expressive font that can help kids to be more expressive and that showing emotions isn’t a bad thing. This helps create empathetic and understanding children and helps anxious kids to express their thoughts by using this font.

My font will originally be expressive but I will create one that’s just the font itself for people who don’t want the expressions. I may use eyebrows to create more expressive fonts as they are the best ways to create expressions. Lastly, to create this font, I would need a range of expressions for easier control when I sketch and digitise them.

Fig 1.3, Third proposal, 30/10/2023

After showing Mr Vinod, he asked which font I would happily wake up to and make consistently and I said the expressive font felt the most right as I can explore a lot with this font.

I sketched more letters of the expressive font and gave Mr Vinod to check and see if it looked right, he said that the expressions looked good and that I could continue with the expressive fonts.

Fig 1.4, More sketched expressive fonts, 1/11/2023

Fig 1.5, More sketched expressive fonts, 1/11/2023

____________

Digitisation[Process of making the font]

I went into Adobe Illustrator to create the 4 basic letters ‘H, O, A, N’ as these letters can help build the foundation of the other letters. I started off by creating a guide using Mr Vinod’s previous video on how to create a consistent font.

Fig 2.1, Guidelines for fonts 4/11/2023

Once I was done with creating the guidelines, I went ahead and created the strokes for my font. I felt that the font by itself doesn't really harbour any feelings within myself even though it's the font I chose. I made the 4 main letters and decided to ask Mr Vinod for feedback and what can I do to improve.

Fig 2.2, First iteration of digitised expressive fonts, 4/11/2023

I had gotten Mr Vinod's feedback and he told me that the fonts don't really look that nice and if I wanted to continue on with the theme, I could but it'd be best to start over with a new expression because the expressions on each letter feel too singular to itself and wouldn't work well together.

He told me to look at my senior's task as well as go out to look at the typography on the dorms building that Taylor provides to gain insight into the font I want to make. After taking a short trip to the dorms and skimming through the senior's work, I made myself a board on how to create an expressive font that doesn't look out of place.

Fig 2.3, My own board on creating expressive fonts, 8/11/2023

I didn't have much time to complete the typography task so in Week 12, I stayed and sketched the whole uppercase, lowercase, numbers and punctuations that I would need for my presentation and application later on.

Fig 2.4, Digitised sketch of the new font (uppercase letters), 15/11/2023

Fig 2.5, Digitised sketch of the new font (lowercase letters), 15/11/2023

Fig 2.6, Digitised sketch of the new font (numbers), 15/11/2023

Fig 2.7, Digitised sketch of the new font ( punctuation), 15/11/2023

Once I was done with sketching, I went to Adobe Illustrator to create the entire font based on the digitised sketch. I started off by creating a guide for my baseline, ascenders, descenders, cap height and more; this is because I was a consistent look for all my fonts and height is especially crucial in this part.

Fig 2.6, New guides for font, 18/11/2023

Using basic shapes as a base for my fonts, I was able to create the specific strokes with ease since my font has thick strokes which capitalise off of the base; If I needed a specific shape, I would use the Curvature Tool to create those specific shapes. I also merged, used the Minus Front Tool and rounded the corners of the fonts since the expressive fonts are supposed to be used for children, therefore the font has to be kid-friendly.

Fig 2.8, Round corners and edges, 18/11/2023

Similar to the letters, I used the same tools and methods for the letters and punctuation.

Fig 2.9, Digitisation of numbers and punctuation, 19/11/2023

Measurements for digitised fonts:

Ascender: 709 pt
Capital Height: 675 pt
Median: 485 pt
Baseline: 0 pt
Descender: -222 pt
Overshoot: [Top] 494 pt, [Bottom] -11 pt
Stem: 748 pt

Fig 2.10, Measurements of created font, 19/11/2023

After finishing all of the uppercase, lowercase, numbers and punctuations of the letter, I went into Fontlab, put the letters in and started the kerning process. The easiest way that I found to kern the letters was to type it out with the letter you are trying to kern with the entire alphabet; i.e. 'AAABACADA...'; this would significantly reduce the space used within Fontlab and helps with the overall final look of the kerning since I would know how it looks like.

Fig 2.11, Kerning font using 'ABACA...' method, 22/11/2023

Uppercase letters were kerned with a spacing of 50, lowercase letters and numbers were mostly kerned with a spacing of 30 with some exceptions in 20-25 and punctuations were mostly kerned with a spacing of 30-50 while others were kerned at 20.

There were exceptions where the capital and lowercase letters 'J', 'j' and 'Y' needed lesser spacing because my fonts had too much spacing by themselves even without the kerning.

Fig 2.12, Kerning spacing (uppercase), 22/11/2023

Fig 2.13, Kerning spacing (lowercase), 22/11/2023

Fig 2.14, Kerning spacing (punctuation), 22/11/2023

____________

Digitising[Process of presentation & application]

I planned a few sketches for the presentation and application of the font that I made. I wanted to showcase the sleepy and tired side so sketches and collaterals were themed after that.

Before starting on the sketches, I chose a colour palette that consists mostly of blues with a yellow and beige colour for a contrasting yet pleasing colour scheme. It also goes with my night or sleepy theme as most people associate these colours with the night sky and stars.

Fig 3.1, Colour palette for presentation and application, 15/11/2023

Once I was done with choosing a colour palette, I went into sketching; Firstly, I did the presentations, 2 normal presentations can help showcase all of the types I made in a professional setting while the other 3 can be more up-close versions of the font to show work and individuality made into the font itself.

Fig 3.2, Sketches of presentation 1, 15/11/2023

Fig 3.3, Sketches of presentation 2, 15/11/2023

After that, I sketched the applications with the theme of creating more fun logos for mattress companies as all of them looked boring and dull; Sticking to the night sky, stars and sleeping theme, I created some designs that hopefully capture those themes.

Fig 3.4, Sketches of application 1, 15/11/2023

Fig 3.5, Sketching of application 2, 15/11/2023

Lastly, in Adobe Illustrator, I went into digitising the presentation and applications using the sketches. I made a multiple artboard with measurements of 1024 x 1024 px since that was the requested size by Mr Vinod.

Fig 4.1, Creating multiple artboards, 24/11/2023

Using the sketches, I followed as closely as possible to my vision and did my best to recreate the sketches. For the 2 normal showcases, I used the standard glyph system and presentation that most presentations use.

Using guides to create a much-needed baseline for an even and consistent look through the whole glyph.

Fig 4.2, Process of digitised showcases, 24/11/2023

For the "Sleepy All The Time" presentation, I replicated the sketch, using the font as the centre of attention, even using the capital letter 'I' to make graphical elements of the artboard. I also made a new presentation, making use of the colour palette chosen and my favourite letters of the font to create

Fig 4.3, Process of sketches & new presentation, 24/11/2023

For the punctuation presentation, I had either sized up or down the font's punctuation to achieve the look I was going for and randomly placed them around the artboard to create a clutter of punctuation.

Fig 4.4, Process of punctuation presentation, 24/11/2023

For the number presentation, I typed the number in every new line to create the jagged placement like the sketch; If numbers were presented outside the board, I would add additional to not leave any white space. This also creates a cluttered yet organised look which is aesthetically pleasing.

Fig 4.5, Process of numbers presentation, 24/11/2023

For applications, I decided to scrap the sketches as it didn't feel like it stuck with the mattress theme so I went on Unblast to find some collaterals that would make me the applications I needed.

Fig 5.1, Unblast website, 25/11/2023

I would 5 collaterals that felt close to what I wanted to recreate. Candles, pillows, books, sachets and paper pouches would make great collaterals that tie into the mattress theme that I decided to adapt. With these collaterals, I started with the candle as scented candles are a common item when it comes to sleep or relaxation.

Going into Adobe Photoshop, I changed the original colour to a darker blue to match the colour palette and using the Text Tool, I wrote "Zzzleepy Candles" and "Blueberry & Bubblegum Scented" since most candles show the name and scent it is infused with. Following that, I went into Edit > Transform > Warp to create the wrapped-around look that graphics will have when seen at a different angle of a round object.

Fig 5.2, Process of candle collateral, 25/11/2023

After making the candle collateral, I went onto the pillows as most mattress companies would pair their products with pillows and blankets. With the pillows dawning my font, it felt too lacklustre so I decided to add graphical elements like circles towards the pillows to add flair.

Fig 5.3, Process of pillow collateral, 25/11/2023

I had only done minimal applications because I felt the theme didn’t feel right with what I was trying to portray using the expressive font and decided it was best to consult Mr Vinod about my applications before I went any further.

Mr Vinod asked why I was doing collaterals that wasn’t a logo or on a mattress which made me realise that I shouldn’t go with this theme since my font doesn’t have good purpose and said that I should just go with making storybooks for children since the original purpose was to help kids be more expressive. He told me to look at Dick Bruna storybooks because it’s quite simple yet effective with it’s use of font and colours and it’s quite popular with children even with its simple art style.

Fig 6.1, Dick Bruna storybooks, 29/11/2023

After analysing and taking inspiration from his works, I went ahead with drawing sketches of covers and possible stories for the application within Procreate. Since they are children’s storybooks, the covers have to have simple enough for children to understand and stories that aren’t too complicated with a poem-like narrative to captivate them further.

The digitised sketches and illustrations were done within Procreate as it was much simpler for me with the horrible schedule that I had.

Fig 6.2, Sketches to digitised versions of the application 1, 30/11/2023

Fig 6.3, Sketches to digitised versions of the application 2, 30/11/2023

Fig 6.4, Sketches to digitised versions of the application 3, 30/11/2023

The covers have the uses of routines, friendships and learning because most children's books are informative and a lesson to be taught within those books is also crucial; the stories I’ve picked were connected to the 2 covers I’ve made, using the type to create poems to tell what’s happening within the ilustrations.

____________

FINAL Type Exploration & Application

Font Download: https://drive.google.com/drive/folders/1SYqS6sQ-meybb-Hf8ILMGpfVsiJSlZhT?usp=sharing

Fig 7.1, Presentation 1, 29/11/2023

Fig 7.2, Presentation 2, 29/11/2023

Fig 7.3, Presentation 3, 29/11/2023

Fig 7.4, Presentation 4, 29/11/2023

Fig 7.5, Presentation 5, 29/11/2023

Fig 7.6, Application 1, 29/11/2023

Fig 7.7, Application 2, 29/11/2023

Fig 7.8, Application 3, 29/11/2023

Fig 7.9, Application 4, 29/11/2023

Fig 7.10, Application 5, 29/11/2023

Fig 7.11, Presentation & Application PDF, 29/11/2023

FEEDBACK

Week 9:

-General Feedback:

When creating a font:

Please copy and paste your progress to show that you actually made the font, don’t just keep the final font only.
When designing fonts, keep the letters ‘H, O, A, and N’

-Specific Feedback:

What to do:

What type of font do I want to create? If I have an idea already, I can work backwards from that idea.
When I create a font, do I feel excited when I create the font? Because this can impact the final design when creating a font, I should go with a font that I would like to create instead of one that’s just the bare minimum.
Create 10 fonts to show Mr Vinod by today.

Further feedback about the font:

I have to consider the amount of white space I use when making the font.
The line weight has to be carefully considered when I actually digitise, all letters have to be consistent in style even if it’s expressive.
When using an existing font, you can use it for sketches but you can’t do that when digitising.

Week 10:

-General Feedback:

Making font feedback:

When creating capital and lowercase letters, make sure to place them next to each other as this helps with comparing both letterforms and see if they look good when next to each other; this also helps to check if all letters are consistent or not.

-Specific Feedback:

What I need to do:

I didn’t really like my font because of its inconsistencies so Mr Vinod asked me to look at a senior’s previous project and the typography on the dorm building to gain some insight.
Once I was done with gaining insight, I made a small guide for myself before creating a new font.
Using this guide, I was able to make a font that Mr Vinod said was all right.

Week 11: -General & Specific Feedback: Uppercase and lowercase letters should be made next to each other to see if they fit together or not. -Specific Feedback:
Didn't ask for specific feedback because I wasn't finished with my font.

Week 12: -General Feedback: Didn't get feedback since I wasn't in class but in the computer room.
-Specific Feedback:
My fonts look consistent which is good. I just have to do kerning, presentation and application.

Week 13:

-General Feedback:

Didn't have general feedback.

-Specific Feedback:

Upper and lowercase don't have the same line weight but it's too late to change so I need to move on to the application and presentation of the font.

Week 14:

-General Feedback:

Just do your best, and don't lose motivation on things you want to do. The market for art in Malaysia is only a fraction of what we actually see and to get your name around, you need to be innovative and create something new, be more pushy and forward but not too annoying.

-Specific Feedback:

Presentation glyph:

The fonts should be on a baseline for everything to look consistent.

Applications:

The applications don't match the font's purpose, so I have to create new applications that work well with the font, or we change the font's purpose itself.

Sad things to note:

The line weight doesn't feel consistent, so it doesn't feel like the fonts match each other, sadly I can't change it now so I have to live with it.

REFLECTION

Experience

This task made me realise that being a typographer isn’t an easy job as many may think. I was struggling quite a bit when I was creating a font since I didn’t know what to do and never really thought of creating a font before this. It was somewhat fun to explore and create the fonts and backstory of the font itself since that’s where most of the creativity came from; although it was still hard to figure out what I intended the font to be because it was made from random curiosity and inspiration of a joke I am within my friend group. I still had a bit of fun when I experimented with the usage of font within the presentation and application since I got to ground that backstory mentioned earlier.

Observation

I was able to observe and get inspired by other students’ fonts, exploration and applications with each different font because they all were unique in their own way which made me remember that I don’t need to be perfect when it comes to creating a font that I and, hopefully, others enjoy too. I was able to gain insight from the different talks and books I’ve read for my further reading since I couldn’t figure out a way to create a font that was visible and fun towards people I’ve never met.

Findings

This task showed me that fonts aren’t made just for decoration, they are used for their usability as well as their legibility towards a certain group of people that resonate with them. Typographers create new or improve on existing fonts because they want to solve a problem within the public where most people don’t realise that was a problem until shown; as if they were the underdogs of the graphic world, making me more appreciative of them with a better understanding.