Labels

TYPOGRAPHY | PROJECT 2




22/05/18 - 5/06/18 | Week 9 - Week 11
Yeah Xiao Shi (0331577)
Typography
Project 2 - Font Design


LECTURE

 Lecture 9 : No lecture (Project 2 : Font Design)
22/05/18 (Week 9)

 After having a small group discussion with both our lecturers, we were taught on font designing by using Adobe Illustrator (AI). We were told to set our artboard at the size of 1000 point x 1000 point and the size for the type letter should be at 700 point. To show the ruler in AI, the shortcut key for it is command R. Then, drag the guideline for baseline and cap height line by pressing command Y.
After placing all the guideline, we move on to design the font that suit for Taylors's University logo. We have to choose 1 of the typeface out from the 10 typefaces given and placed it on the artboard. We can either create the font by using pen tool or rectangle tool. After that, we can start making changes on the font to make it suit the Taylor's logo.


Lecture 11 :  Print Type VS Screen Type
05/06/18 (Week 11)

 This week, Mr Shamsul began the class by giving us a lecture on print type and screen type. In the past, typography was only viewed as living when it reached on paper. Once the publication was edited, typeset and printed , it was done and nothing changed after that. But today, typography exists on a multitude of screens not only on a paper. It is subject to many unknown and fluctuating parameters, such as operating system, system fonts, the device and screen itself, the viewport and more.

Move on to type for print, Caslon, Garamond, Baskerville are the example of good typefaces that are used for print. This is because of they are highly readable when set at small font size. Typefaces for screen include a taller x-height, wider letterforms, more open counters, heavier think strokes and serifs, reduced stroke contrast, as well as modified curves and angles for some designs.

Hyperlink is a word, phrase, or image that jump to a new document or new section within the current document when you click on it. They are normally blue and underlined by default. The font size on screen (16 pixels) is about the same size as text printed in a book or magazine. When deciding font size for screen, we need to consider the people who will read through our website. If the font size used is small, it will looks smaller in a high resolution screen. Next, systems fonts for screen refers to the own pre-installed font selection in each devices. If the system don't have the typeface we use, the browser will choose the similar one from same type family and replace it. While if the browser can't find any similar type family, it will automatically set it to default.

Moreover, the screens used by our PCs, tablets, phones and TVs are not only different in sizes, but the text we see on screen also differs in proportion because they have different sized pixels. To know the size of the screen, we can measure diagonally at the screen. Lastly, we learned about static and motion typography. Static typography has minimal characteristic in expressing the words. Traditional characteristics such as bold and italic offer only a fraction of the expressive potential of dynamic properties. Motion typography offers opportunities for the typographers to "dramatise" type for letterforms to become "fluid" and "kinetic". It is often overlaid onto music videos and advertisements, set in motion following the rhythm of a soundtrack.



 INSTRUCTIONS



PROJECT 2
Font Design (Week 9 - Week 11)

Week 9 (22/05/18)
This week, we were taught on font design by using Adobe Illustrator. We were required to design the font that matches the word "Taylor's" and its logo by referring to the 10 typefaces given. Firstly, we were told to choose 1 typeface out from the 10 given as the base. Then, move one to create our own typeface by using pen tool to rectangle tool.


Fig.1.1: 10 Typefaces give as reference.


Fig.1.2: Typeface used (Futura).


Fig.1.3: Move on to create the font.




Fig.1.4: First attempt.


Fig.1.5: Typeface used (Gill Sans).


Fig.1.6: Process of designing the font.



Fig.1.7: Second attempt.


Fig.1.8:  Typeface used (Serifa).


Fig.1.9: Process of designing the font.


Fig.1.10: Final Outcome.


Week 11 (05/06/18)
In this week class, Mr Vinod checked on our previous work for font design and gave some feedbacks. He said that overall my font looks okay but there are too many breaks for the letter "O" and "S". So, he asked me to use Serifa Std 55 Roman as reference and make the curve for both of the letters.

Fig.2.1: Make changes for letter "O" and "S" by study the typefaces given.


Fig.2.2: Final Outcome. (after feedback)


After making changes for our font, we were told to save the font in Font Lab. Before that, we need to change the font to outline stroke first then only move on to Font Lab.


Fig.2.3: Process of moving the font to Font Lab.


Fig.2.4: Generate and save the font in Font Lab.



FEEDBACK

Week 9
General Feedback : At the beginning of the class, we had a small discussion to reflect on what we have learned from the previous class with both of our lecturers. Mr Vinod told us that as we are a design student we need to be brave for questioning and we need to stand out in order to success. He also asked us to utiliese our time to complete the work as next week is a public holiday. Move on to the font design project, we were told to change the size of the canvas to 1000 x 1000 point in Adobe Illustrator and the cap height for the letter must be 700 point. Lastly, we need to be aware of the consistency of the strokes when creating the letter. Specific Feedback : Mr Vinod said that the quality of printing book is good as it looks clean. He commented that I need to be aware of the layout for my book and the idea for the last spread looks like not matching the theme of the book. For the e-portfolio, he said overall is good as I have done updated my blog but for the project 1 it should be from week7 to week 9 so I need to make changes for that.

Week 11:
General Feedback : We were told to overcome the timidity we are currently facing and ask question if we have any doubt. For font design, we did not need to create a lot of difference to all the letters because it will makes it looks more complex.  
Specific Feedback : Mr Vinod commented on my font design and he said overall looks okay but too many breaks for the letter "O" and "S". He asked me to use the typeface given as reference to make changes on both of the letters.


REFLECTION

Experiences : 

Week 9 :  This week, we were assigned to our new project which we need to design a font that matches Taylor's logo by referring to the 10 typefaces given. I got to learn the step of creating font by using pen tool and rectangle tool in Adobe Illustrator.
Week 11 : In this week class, I got to learn how to generate and save my font by using Font Lab.

Observations :

Week 9 : I need to be aware with the width of the strokes when creating the font. To make sure that the letter is well placed, I need to get use of the guideline like baseline and cap height.
Week 11 : I realised it is hard to create the curve for letter "S" compare to letter "O". I need to consider the strokes as well as the curve when designing letter "S" so that it will looks smooth.

Findings : 

Week 9 : Study the 10 typefaces given as reference will help in the process of designing and creating a font. Consistency is important when creating a font.
Week 11: The letters will only looks more complex if create a lot of differences when designing a font. We do not need to create a lot of differences, two to three is more than enough.


FURTHER READING

Week 9 


From this book, I have read about typography grids. The grids establish a system for arranging content within the space of page, screen or built environment. An effective grid is not a stiff formula but a flexible structure. It belongs to the technological framework of typography, from the specific modularity of letterpress to the rulers that widespread, guides and  coordinate systems of graphic applications. Alphabetic writing organised into columns and rows of characters whereas handwriting flows into connected lines, the mechanics of metal type impose a stricter order. Each letter occupies its own block and the letters bring together in orderly rectangles. When the characters stored in the gridded case, they become an archive elements.
Week 11

     

The complete manual of Typography (2nd Edition)
By: James Felici

Font format : 
What is inside the font depends on its format and the word format has two meanings in computer type. First, it refer to the platform for which the font was designed. For example, two fonts with the same data for the same typeface may have different file formats depending on whether they are designed for use on an Apple Macintosh or a Window PC. Until the development of OpenType font format, a single OpenType font file can work on both  Mac or Window PC. Another meaning of font format refers to how the typographic information itself is described and organised. PostScript, TrueType and OpenType are the three leading font formats today.

PostScript Fonts :
This fonts are written in PostScript page description language. They need to be processed by a PostScript interpreter before they can be imaged. This interpreter is generally built into the device itself for high resolution printers and imagesetters while for the lower resolution devices like computer monitors and desktop printers, PostScript fonts can be imaged by a PostScript interpreter built into the operating system. PostScript fonts were the standard of the the publishing industry until the development of the OpenType font format. It has been completely replaced by OpenType as most type vendors including Adobe have converted their entire libraries of PostScript fonts into the OpenType format today. However, PostScript fonts are still fully supported by applications and operating systems.

TrueType Fonts :
TrueType Fonts were create under the collaboration of Apple Computer and Microsoft for a combination of primarily commercial but also technological reasons. The new format enabled both companies to build outline font-imaging capabilities into their respective operating systems without being beholden to Adobe. Hinting of TrueType format is the most prominently touted to prove the improvements over the PostScript format. Instructions were add to the font that tell the character outlines how to reshape themselves at low and medium resolutions in order to create character images of maximum clarity.Besides that, Truetype allowed for larger character sets. It introduced a two-byte numbering system which allowed much larger character sets by creating over 65,000 unique ID numbers.

OpenType Fonts :
OpenType is a hybrid font format created by Adobe and Microsoft. It reconciles the differences in the PostScript and TrueType formats by allowing them to exist together in a single file. It allows the same font file to be used on either a Macintosh or a Window PC. A problem with OpenType fonts, as with the TrueType fonts that proceed them, is that from the outside there is no way to know what a particular font contains inside or what it can do unless the features of the font are documented in some way.


Labels:

Comments

Post a Comment