Typography - Task 2

4/5/2021- 11/5/2021 (Week 6 - Week 7)
Maizatul Amirah Mahat (0336918)
BA Mass Communication (Digital Media Production) (Minor) /Taylor's University
Task 2 

---

LECTURES

Week 6: On this week, I studied the Screen and Print through the lecture video that have been prepared in the list.

Typography has a permeated many different platforms; Print type and Screen Type;

Based on the lecture, Print types are most likely to be on paper as a means to communicate, but since there is Screen type, the uses of Print type has been reduced. Yet, it will not go out of style and will
still be used due to the invention of printer. In the past, only as it hit paper did typography seem to be alive. Typography is now used on many platforms, not just on paper. The experience of typography
today changes based on how the page  is rendered, because typesetting happens in the browser.

Print Type vs Screen Type ;

Type for Print:

http://spbookdesign.com/wp-content/uploads/2015/11/05-1024x442.jpg

• Intended for reading from print long before screen.
• Designer need to make sure the text is smooth, flowing and pleasant to read.
• Caslon, Garamond, Baskerville - Because of their elegant and intelligent features, which contribute to highly readable when set to small font size, this typeface is the most commonly used in print.
• Versatile, easy-to-digest classic typefaces, which has neutrality that makes typesetting with is a breeze.

Type for Screen:

• It's designed to be used on the web. 
• Optimized and often updated to improve readability and screen efficiency.
• E.g. Taller x-height, wider letterforms, more open counters, heavier thin strokes, etc.
• Verdana, Georgia - typefaces created specifically for use on a screen.
• On some design, larger letterforms, more open counters, heavier thin strokes and serifs,
  lower stroke contrast, and altered curves and angles were used.
• Important adjustment - smaller sizes, more open-pacing. These factors serve to improve character recognition and overall readability.

Hyperactive Link / Hyperlink:

• Word, phrase or image that allow you jump to a new document or section within the current document once you clicked it
• Normally blue and underlined by default

Font Size for Screen;

• 16-pixel on a screen is same as text printed in a book or magazine.
• 20-24 point size is good enough for screen reading.

System Fonts for Screen/Web Safe Fonts

• Each device comes with its own pre-installed font selection. Eg. Windows-based devices might have one group. MacOS ones pull from another. 
• 'Web safe' ones, on the other hand, can be used on every operating system. They're a select group of fonts that cross platforms from Windows to Mac to Google.
• Open Sans, Lato, Arial, Helvetica, Times New Roman, Times, Courier New, Verdana, Georgia, Palatino, Garamond - This are few 'Web Safe' font that can be used on both platforms.

Pixel Differential Between Devices;

https://www.youtube.com/watch?v=h8lTwvffrZw&list=PLZk01iRkmnlUF8tRLTTAogutYcraV6DFR&index=8

• Screens - Not only are the sizes different, but the proportions of the text you see on-screen differ as well, so the pixel sizes vary from 100 pixels on a large 60" HDTV.
• There's a lot of variation within a single device class.

Static vs Motion;

Static typography; 

• Has minimal characteristic in expressing words.
• Traditional characteristics like bold and italic barely scratch the surface of complex properties' expressive power.

Motion typography;

• Allow typographer to "dramatize" type
• The film title credits use animation to add typographic material to life.
• Often overlaid onto music videos and advertisements.
• Often set in motion following the rhythm of a soundtrack.

---

INSTRUCTIONS

Fig 1.0: Module Briefing Week 1 [30/03/2021]

https://drive.google.com/file/d/1A4mZ4X0s0JSTPCdCounIeiz6kcLaWkU8/view

Task 2 : Text Formatting.

We are now on task 2 Typographic Exploration & Communication, after getting through all of the text formatting lecturers and exercises (Text Formatting and Expression). This task requires us to create a two-page spread with text provided by lecturers. Only black and white are permitted, with a few small graphic features such as lines and tones allowed.

Figure 2.0 rough sketches of Ideas  [22/4/2021]

I have chosen 'be good, do good, follow the code.' editorial. After a few rough sketches been done, I have proceed to created the digitization process following my idea.

Figure 2.1 first draft digitized work  [23/4/2021]

Figure 2.2 second draft digitized work  [23/4/2021]

Week 5

In this week, I made some amendments to my first draft work according to Mr. Sam, which was to improve the type expression of the heading. Shown below are the amendments made to my first draft. I figured to changed the grey strokes into black strokes and embed the word 'DO' on top of the strokes that illustrate as a bar code; 

Figure 2.3 Task 2_V1.1   [27/4/2021]

This is my second attempt on the type setting;

Figure 2.4 Task 2_V1.2   [27/4/2021]

This is my third attempt on the type setting;

Figure 2.5 Task 2_V1.3   [18/5/2021]

FINAL OUTCOME

Figure 2.6 Task 2_Final.jpg [18/5/2021]

Figure 2.7 Task 2_Final.pdf [18/5/2021]

---

FEEDBACK

Week 6

General Feedback: In this week, I have ask some feedbacks from Mr. Sam. He mentioned as for my first trial (Figure 2.1) Type setting of the content looks okay but the type expression of the heading can still be improve. He suggest me to show few options. He also shared that it should not be to complicated. Make it simple.

Specific Feedback: Don’t need outline for the D and O, The barcode doesn’t look like a barcode.

Week 7

General Feedback: I consulted with Mr. Vinod. overall, he say it is nice.

Specific Feedback: Based on my second attempt, he questioned the paragraph space where its too large.

---

REFLECTION

Experience and Finding: Throughout the weeks, I have learned few fundamental things about typefaces and typesetting. I was thought to appreciate each and every type of fonts and understand the deconstruction in certain fonts. Moving on throughout the project, there were few challenges such as starting the research itself for my third assignments. Even though there were video tutorial to look at, finding my own idea was a really tough progress.

Observation: Going through the second task, the are few thing I have observed that was important in formatting the text layout which was the kern, paragraph spaces, etc. As well as using the Adobe InDesign itself.

---

FURTHER READING

Typography: A Very Short Introduction

The writer, Paul Luna, defines typography as "template for reading," whether in print or on screens, in which a series of graphic choices are made to make a written document more available, quickly conveyed, important, or appealing. Luna considers the evolution of letterforms and the shapes of letters we use, before delving into the problems that underpin important typographic decisions and the variations in handwritten and on-screen typography. Luna presents the choices available today, as well as the reasons why important typographic decisions are taken, by presenting any piece of typography as a fundamental design choice.