Advanced Typography | Type Exploration and Application

 


Week 11 (08/11/2023) - Week 14 (29/11/2023)

Nurul Asilah Binti Mohamad Asif | 0353346 | Bachelor's of Design in Creative Media | Advanced Typography 

Instructions



Task 3 | Type Exploration and Application

For this task, we are required to complete the application With the knowledge and experience gained in the exercises and tasks, with the accumulated knowledge from the lectures and your own reading (library books and online sources), with the experience gained in the different software covered in the
program thus far, synthesize and apply the learning in the tasks to be mentioned. Allow the knowledge gained to guide and inform your decisions for the effective execution of your final
task. Create a font that is intended to solve a larger problem or meant to be part of a solution in the area of your interest be it graphic design, animation, new media or entertainment design or any other related area not necessarily reflecting your specialization. End result: a complete generated font (.ttf) with applications.


Proposal



References 

I began to do some research for my font designs, it was hard in the beginning because most fonts have their own unique styles. 

Fig 1.0 Reference #1

 

Fig 1.1 Reference #2

 

Fig 1.2 Reference #3

Fig 1.3 Reference #4

Fig 1.4 Reference #5

 



Progression

After looking at the references I went to Illustrator to start my rough sketch. In the beginning, I went for the "eye" look in the letters. At first, I went for rounded designs for the fonts, but then when I looked back at the fonts, it wasn't consistent. The design was not quite the same and it looked messy. 


Fig 1.5 Rough Drafts fonts (09/11/23)


Fig 1.6 Rough Draft fonts (11/11/23)

I, later sought some advice from Mr. Vinod as I was not sure about my rough draft. Mr. Vinod then gave me an idea on how to properly use the consistency of the fonts rather than throw ideas into a canvas. 

Fig 1.7 Example given by Mr.Vinod (16/11/23)

After getting some ideas, I used a square to keep the letters intact and for the letters to look like it has a square design "themed". 
Fig 1.8 Example given by Mr. Vinod (16/11/23)

However, It did not go as planned. It went well from "A,B,C, D" towards E and the rest, it has gotten weird and weirder. Again was NOT consistent with the font designs and allignments. However, I continued with the numbers.
Fig 1.9 Continuation of the last draft (17/11/23)


As I continued with the numbers and the punctuations, I realized that it (AGAIN) was inconsistent with the letters. I later thought that I could use the number style with the letters as well. 

Fig 2.0 Continuation of the last draft #1 (18/11/23)

Fig 2.1 Continuation of the last draft #2 (18/11/23)

As I looked back at my letters, I didn't quite like how the "eye" did not manage to fit in, in all the letters, but letters like "N,V,W" are interesting to look at. the square did match the theme I wanted originally. 
Fig 2.2 Inconsistent Fonts #1 (18/11/23)

Fig 2.3 Inconsistent Fonts #2 (18/11/23)

Fig 2.4 Inconsistent Fonts #3 (18/11/23)

As I give this another try, I decided to use "A" as the first tryout.
Firstly, I removed the "eye" from the shape and began to reshape the letter.

Fig 2.5 Execution of the letter#1 (19/11/23)

As I kept executing the letter A, I thought it would be a dead end. However, I quite like the last "A"
but I also did not like the letter's look. So I decided to look at more references. 

Fig 2.6 Execution of the letter#2 (19/11/23)

As I did my research, I found one that caught my attention. The letter has a close look at what my draft "A" looked like. 

 

Fig 2.7 Reference #1 

 

Fig 2.8 Reference #2


And so I continued to execute the letter. Then I realized that it looked better if it was pointy after a few tries. So, I decided to use a shape to follow that last draft letter.

Fig 2.8 Execution letter#3 (19/11/23)

After I used the shape to put together the letter, I realized it looked better. I also wanted to keep the "eye look in the letter, so I decided to create an "arch" to have that "eye" similarity.

Fig 2.9 Execution letter#4 (19/11/23)

Fig 3.0 Execution letter#5 (19/11/23)

I then resized the letter into the same grid as the previous letter.

Fig 3.1 Execution letter#6 (19/11/23)


Fig 3.2 Execution letter#7 (19/11/23)


After finding the letter that I actually liked, I continued with the same design with the rest of the letters. I also used some elements for the letters, like the shape circle for the letter "C" and a rectangle for the letter "B" as well as for the other letters. 

Fig 3.3 Continuation letter#1 (20/11/23)

Fig 3.4 Continuation letter#2 (20/11/23)

I continued with the other letters, as well as the lowercase letters.

Fig 3.5 Continuation letter#3 (20/11/23)

Once done, I grouped them because it would be easier to import them into the font lab. 
Fig 3.6 Continuation letter#4 (20/11/23)

Once I opened the font lab, I imported the letters in.
Fig 3.7 Import to Font Lab (20/11/23)

As I imported them, I decided to fix a few mistakes on some letters.
Fig 3.8 Import to Font Lab "R" Fixing (20/11/23)

such as the alignments bent shapes or even irregular shapes that did not match the other letters.
Fig 3.9 Import to Font Lab letter Fixing (20/11/23)

I was unsure about the letter 'S' because as I said before I wanted to keep the "eye" in each letter, but it does look quite funny in the letter "S". That said, I will keep that in mind as I will fix the others.
Fig 4.0 Import to Font Lab "S" Fixing (20/11/23)

Fig 4.1 Import to Font Lab Low Case Fixing (20/11/23)

Fig 4.2 Import to Font Lab Punctuation Fixing (20/11/23)

Fig 4.3 Import to Font Lab Punctuation Fixing#1  (20/11/23)

After I was happy with the letters, I moved on to the spacings. Yet again, I was not quite happy with how close they were. Therefore, I spaced them out with 0,952,24 I tried sticking with that number even when the others changed.

Fig 4.4 Import to Font Lab Spacing#1  (21/11/23)

Fig 4.5 Import to Font Lab Spacing#2  (21/11/23)

Fig 4.6 Import to Font Lab Spacing#3  (21/11/23)

I wanted to type it out and test it on a canvas in Photoshop to see if it looked okay after I spaced them out.
Fig 4.7 Font Lab Auto Spacing  (21/11/23)

After exporting them, judging by the look of the Installation, it didn't go quite well. But I'll give it a try and type it out instead. 

Fig 4.8 Font Lab Export Font As..  (21/11/23)

After I downloaded my fonts, I tried to type them out in Photoshop, yet again the spacing was terrible.

Fig 4.9 Photoshop Typing testing (21/11/23)

Even for the lowercase, I didn't like it either, the lowcase did not match as well as the uppercase. 
Fig 5.0 Photoshop Typing testing (21/11/23)

So I went back to the font lab and fixed some of the letters again, as well as their spacings.
Fig 5.1 Font Lab correction letters#1 (21/11/23)

As for the letter "S," I didn't like how the letter looked when I typed it out in the sentences. So I decided to tone down the "eye".
Fig 5.2 Font Lab correction letters#2 (22/11/23)

Fig 5.3 Font Lab correction letters#3 (22/11/23)

Again, I exported the fonts and tried to type them out in Photoshop. This time, it's getting better, but still needs a little more fixing. 
Fig 5.4 Photoshop typing testing #1 (22/11/23)

Fig 5.5 Photoshop typing testing #2 (22/11/23)

I also tried the feature on Font Lab, "Auto Spacing" to see if it would help me out.
Fig 5.6 Font Lab Auto Spacing (22/11/23)

Turns out, it does quite a bit. I still have to adjust them afterward.
Fig 5.7 Font Lab Auto Spacing#2 (22/11/23)

Fig 5.7 Font Lab Auto Spacing#3 (22/11/23)

Fig 5.8 Font Lab Auto Spacing#4 (22/11/23)

Fig 5.9 Font Lab Auto Spacing#5 (22/11/23)

After quite some time, the spacings turned out quite okay. I still have to fix them along the way. Nevertheless, it turned out just fine. Toward the end, I typed it out in Photoshop to give it another try before moving on to the font presentation and application. 

Fig 6.0 Photoshop testing typing (22/11/23)

Font Presentation and Application

Later, we were tasked to do a font presentation as well as an application.
I started with a very retro look for the font presentation, I feel like it would match the fonts way better. I took some time time to find the mockups for the vinyl album disk and changed the color to match the theme I'm going for. I also added some "noise" from Photoshop into the canvas to add a little bit more value to the design. As well as to give it a retro look.

Fig 6.1 Font Presentation#1 (22/11/23)

Fig 6.2 Font Presentation#2 (22/11/23)

After completing them, I moved on with my application. 
Fig 6.3 Font Presentation#3 (22/11/23)

I actually wanted to do a poster that says Kuala Lumpur in it, but I left that as a draft. For the other poster, with what is going on in the outside world, I wanted to go for a poster that says "Free Palestine". It seems quite meaningful to me that I would use a font I worked on, to also use it on a poster. 

Fig 6.4 Application Presentation#1 (24/11/23)

Fig 6.5 Application Presentation#2 (24/11/23)

Link to font file: https://drive.google.com/drive/folders/1De3ML8jFzkvVfoFFW8dzae6dsSKzV0wd?usp=sharing

Final Type Exploration in JPEG format


Fig 6.6 Type Exploration #1 in JPEG Format (25/11/23)
                            

Fig 6.7 Type Exploration #2 in JPEG Format (25/11/23)


Fig 6.8 Type Exploration #3 in JPEG Format (25/11/23)

Fig 6.9 Type Exploration #4 in JPEG Format (25/11/23)


Final Application in JPEG format

Fig 7.0 Application #1 in JPEG Format (26/11/23)

Fig 7.1 Application #2 in JPEG Format (26/11/23)

Fig 7.2 Application #3 in JPEG Format (26/11/23)

Fig 7.3 Application #3 in JPEG Format (26/11/23)


Type Exploration and Application in PDF Format

Fig 7.4 Final Type exploration and application combined (27/11/23)

Fig 7.5 Final Type Exploration and Application PDF Format (27/11/23)



Feedback 

Week 8 
- *Study week

Week 9 
- Start by aligning the letters properly, it should be okay. 
- If you want to follow the nano style, the consistency of the key letters needs to be there. 

Week 10
-If you want to make your letters bold, you need to have the consistants within these letters. or else it does not look pleasing to look at. -Use the dots wisely, with your letters. -Look at nano references.

Week 11
- Be consistent with your fonts, if you want to make it have the shape of an eye then stick with that. - Always remember to align them properly.

Week 12
- No feedback

Week 13
- It's too good to be true...
:")
-Fix it

Reflection

Experience

Diving into the world of typefaces and typography has been a delightful voyage through the artistry and functionality of letters. Exploring different font families, styles, and typographical elements feels like wandering through a vast library where each typeface tells a distinct story. Understanding the nuances between serif, sans-serif, script, and decorative fonts unravels their unique personalities and intended uses. Experimenting with typography has not only refined my eye for design but also taught me the importance of choosing the right typeface to evoke specific emotions or communicate a particular message effectively. It's a realm where creativity intertwines with functionality, and each typographic choice carries the potential to shape perception and enhance communication in subtle yet impactful ways.

Observation

Observation within type exploration and its application in typography has been akin to deciphering a secret language embedded in our everyday visual experiences. It's the subtle yet powerful influence of fonts on our perceptions and interpretations. Therefore, it brings a whole "adventure" throughout this whole process. Through keen observation, one can discern the nuances between typefaces—how a serif might lend an air of tradition and reliability, while a sleek sans-serif exudes modernity and simplicity. This observation fuels a designer's ability to strategically apply typography, understanding how certain fonts resonate with specific audiences or contexts. It's a study in balance, rhythm, and harmony, where the interplay of fonts, sizes, and spacing orchestrates a symphony that guides the viewer's understanding and emotional response to the conveyed message.

Findings

Through extensive type exploration and its practical application in typography, intriguing findings have emerged, unveiling the profound impact of font choices on communication. One prominent discovery lies in the nuanced psychology behind typefaces and their ability to evoke emotions, convey tones, and influence perceptions. Serif fonts often evoke a sense of tradition, reliability, and formality, while sans-serif exude modernity, simplicity, and approachability. Moreover, findings underscore the significance of typographic hierarchy and the strategic use of font sizes, styles, and spacing as well as to guide reader attention and emphasize key messages. This exploration has emphasized the pivotal role typography plays in shaping not just visual appeal but also the efficacy of conveying information, reinforcing the importance of thoughtful font selection and arrangement in effective communication design.


Further reading

14 best vintage fonts by William Hansen
https://creativemarket.com/blog/best-vintage-fonts

Vintage fonts embody a nostalgic feel reminiscent of different eras, evoking a sense of history and authenticity in design. These fonts often showcase characteristics from past typography styles, like ornate serifs, hand-drawn elements, or distressed textures. Hansen, like many designers and typographers, might have curated a list of vintage fonts based on their unique features, such as classic elegance, retro vibes, or antique lettering styles. These fonts are often utilized to add a touch of timeless charm to various design projects, from branding to posters, capturing the essence of bygone eras while retaining a timeless appeal.


Comments