TYPOGRAPHY - TASK 3A

 TYPOGRAPHY - TASK 3

May 11th  - 1st June (WEEK 7 - WEEK 10)
NG VEYHAN (0349223) / Bachelor of Design (Hons) in Creative Media
TYPOGRAPHY 
TASK 3


Lectures

Week 7 // Introduction to Typeface Design

This week, Mr. Vinod and Mr. Sam briefed us on the basics of the task. As we were expected to have some rough knowledge of the task from recorded lectures, the technical aspects were kept short. They gave us a demo of designing a typeface and explained to us the functions of the baselines that we are going to use for alignment when designing the typeface.

Week 8 // Independent Learning Week

Unfortunately, there was no lecture session this week due to the nature of the Independent Learning Week. We were instructed beforehand in the previous week to utilize this time to complete the design of our typefaces.

Week 9 // Instruction for FontLab 

By this week, we were expected to have nearly completed the preliminary designing process and begin the process of digitizing the typefaces. Mr. Vinod demonstrated the basics of how to use FontLab in order to create the font package that we had to create, as the program can be fairly overwhelming at first glance. He also gave us some pointers and some small details that we had to look out for in order to smoothly import the letters into FontLab.

Week 10 // Review of Progress

Mr. Vinod and Mr. Sam took the week to individually review our work. Some students had also already finished creating the font package in FontLab and had already begun working on the final poster for the assignment and had them reviewed as well. Mr. Vinod also gave us a quick rundown on what was expected to be in the final submission and e-portfolio by the end of this task.


Instruction 

<iframe src="https://drive.google.com/file/d/181_VE8vfcKqdWZoCtwbL4xlVtYLIPE7W/preview" width="640" height="480"></iframe>


Practical

First thing that we, as a class, were advised to do was to pick a reference typeface to be used for this task. Personally, the most appealing typeface that we were currently assigned was the ITC Garamond typeface, which I then used for reference.





Studying the typeface and taking a closer look, I tried to list out the aspects of the typeface that made it distinct. While doing so, I also made the list in order to make it easier to evaluate which characteristics of the font I should try to keep in my final work.

I tried using brushes of various shapes in order to create a very basic sketch with appealing proportions. Solid round brushes created very rounded but flat-looking glyphs which reminded me of the comic sans typeface. I also realized very quickly brushes with low opacity edges are highly unsuitable, I settled on a solid vertical rectangular brush as it created a stroke quality that looked varied but distinct from a fountain pen type brush.

(Fig 02, Sketching Basic Shapes, 18/5/2021)

I wanted to preserve the theme of the original typeface while making it look a little less "stiff" and more expressive. When thinking about details that could be altered, the vertical rectangular brush made creating tapered edges quite difficult, however I decided to make an angular "serif" on certain letters.

I also sketched up some preliminary designs and slowly added more specific edges to refine the very rough shape, which also allowed me to keep track of the progress and any changes that seemed odd could be easily pinpointed. 

 
(Fig 03, Designing the Letter A, 18/5/2021)

I began to work on a more detailed version of my sketch, I wanted to follow the basic structure of the typeface because I liked the proportions that the letters had. I used basic lines to create a basic skeleton of the font, and built the font further up from there. Designing the eye of the letters a and e also proved difficult as finding the curves that could make it look consistent were few and far between.


(Fig 05, Completed Sketch, 20/5/2021)

After a few attempts, I reached a design that I liked. Following the steps provided in the weekly lecture, I began to start setting up for the digitization of the typeface. After setting up the initial document, I also had to mark out lines for the x-height, ascender/descender lines, capital lines etc. which wasn't too difficult after referring to the lecture.

(Fig 06, Workspace Setup, 20/5/2021)

(Fig 07, Aligning Illustrator and Sketch Baseline, 20/5/2021)

At first, I was testing the waters of digitizing the first few alphabets. Frankly it was a little difficult initially. Progressing through each letter in the sequence, it gradually became faster as there was no need to digitize each part of the letter from scratch in order to maintain consistency throughout.

(Fig 08, Digitizing with Letter O, 20/5/2021)

It was then time to make the more specific touches to the "components" of each letter. One of the key features that I wanted to include in my typeface were more rounded eyes in the letters and the angular serifs. Illustrator made it very convenient to adjust said features as you could edit multiple angles with just one input.

(Fig 09, Eye Rounding, 20/5/2021)

The typeface was pretty much completed at this point, and all that was left to do was to export it. It was a little unconventional when trying to export it as the artboard was extremely long horizontally relative to its vertical height. The file size was also really large so sometime to be uploaded onto webpages I had to downscale the image first with another software.


(Fig 10, Completed Digitized Typeface, 20/5/2021)

The next part of the task required us to import the typeface we had designed in Illustrator into FontLab and convert it into an installable typeface package. It thankfully wasn't much of a hassle to set up the application as it didn't require an account for the trial. 

(Fig 11, Inserting the Glyph for "i", 21/5/2021)

Following the directions from the lecture provided, I tried to specify the coordinates of the Illustrator file that I wanted to use for importing a letter but couldn't get it to work properly. After a little fiddling, I found out that I could instead delete the rest of the imported file for each glyph, though it was substantially more work.

(Fig 12, Previewing Typeface, 21/5/2021)

Once I was done importing the file for each glyph, I used the test typing function to type out a simple sentence. The vertical alignment was pretty accurate, however the kerning was all over the place. Conveniently, the kerning of each letter could be adjusted directly from the text field that I tested the typeface in. 

(Fig 13, Kerning Adjustments, 21/5/2021)

(Fig 13.5, Complete Letter Kerning , 21/5/2021)


Once that was completed, I was ready to export the typeface in a TrueType format. The exporting process was also quite streamlined as I had filled in the font info beforehand, I specified it as a "regular" font and created the installation package. Once I had installed the file, I booted up Photoshop for the final portion of the task, which was to create a poster with the font.

(Fig 14, Testing Out the Typeface, 22/5/2021)

After verifying that the typeface was displaying properly when typed out, I thought up a simple design for the poster. As with most assigned tasks and exercises beforehand, there should be minimal visual elements. Arranging the text in a manner that was simple and legible, the poster was quickly done.

Final Outcome


(Fig 15, Final Poster, 21/5/2021)



Feedback

Week 7: The basic design was good, I should continue developing the style of the text.

Week 8: No feedback was given this week, due to Independent Learning Week having no lecture sessions.

Week 9: The basic design was good, I should finish up developing the style of the text soon.

Week 10: The typeface that I had designed was quite legible. Mr. Vinod commented that it shared some similarities with existing fonts and instructed me to revise the design.


Reflection

Week 7: The task was quite daunting to me at first, as prior to this task being assigned, I was practically clueless as to what made a certain typeface or font appealing on its own. Therefore, with the design of the typeface, I started off taking a very reserved approach, and didn't want to be overly expressive or wacky with the designs.

Week 8: Digitization of the typeface was proceeding smoothly. At this point I'm fairly used to Illustrator and didn't face too many problems.

Week 9: I had to make a few small changes here and there to my current progress. I felt that my designed typeface, while meeting my own criteria of being very legible, still lacked in the department of consistency, I would try to address it this week.

Week 10: Following the advice of Mr. Vinod, I did a revision of my work so far. While I had no time to completely start from the ground up, I took the basic concepts of the typeface that I had designed so far and made a nearly new typeface. It was a bit of a rush, but I managed to pull through, much to my relief.


Further Reading

The Elements of Typographic Style by Robert Bringhurst, 1996 Revision

(Fig 16, The Elements of Typographic Style)

This book is comparatively old than the other books that I've come across. Having over 4 revisions over the years, I saw that this book was regarded rather highly by its readers. Personally, I liked that it had references for designing typographic elements, which gave me a little inspiration for the design of the typeface I made.

(Fig 17, Typography Anatomy Reference, excerpt from page 8)

Due to the time at which this revision was released, it was the beginning of systems that supported graphical interfaces, therefore the concepts that were covered by this book were basic and easy to understand. 

Certain techniques explained by the book such as the usage of a negative leading when typesetting was very interesting to see, and made some very appealing arrangements, but frankly I'm not proficient enough in typesetting to try out such techniques yet.

(Fig 18, Examples of Typesetting, excerpt from page 38)

As of writing this blog, I have yet to finish reading this book. The content provided me some insight into the possibilities of typeface design and text arrangement and made for a very interesting read, especially for the era when this was written. 


//END OF SUBMISSION//

Comments

Popular Posts