TYPOGRAPHY - PROJECT 2

on

24/05/19 - 31/05/19 (Week 8-Week 9)
Piyaphon Inthavong (0337589)
Typography
Project 2

LECTURE NOTES

Lecture 8:
May 24th, 2019 

No lecture today, most of the instructions on project 2 was made clear. Although there are few notes on the instructions on Font Lab tutorial.

 Lecture 9:
May 31st, 2019

 There are many ways to specify the separation of different paragraphs, this includes the ‘pilcrow’ (¶), line space and the extension of the first line of a paragraph.

Leading can be referred to as a jelly of the typographic sandwich in which the line spacing is the bread, this is due to the comparison of their vertical distance between lines of text. 

 In typography, there are 2 mistakes that are unforgivable at most times, the widows and the orphans. They create poor typography as the excessive white spaces are left in between the paragraphs or either the bottom of a page.

A window is a short line at the end of a column separated from the rest of the paragraph. An orphan, on the other hand, is a short line in which appears in the opening column of a paragraph.

 Few ways to highlight/emphasize text: italic, bold, color, different typeface, gray boxes (readable), bullet points, quotation marks (don't mistaken this as the prime symbol, they are meant for different purposes).


INSTRUCTIONS

EXERCISES

Letter Analysis:
May 17th, 2019

 Before digging into project 2, we all were required to study individual letters by breaking down its part with basic shapes. The letters below belong to Futura Std Book, a sans-serif typeface released since 1927. I chose this typeface primarily because they are made of geometric shapes (as seen clearly with the circles).








Week 8:
May 24th, 2019
Figure 8.1. Project 2 draft on a sketchbook, the main idea of this personalized typeface is to create a mix feeling for Futura Std with letter contrast and weight.
Figure 8.2. The first attempt on digitization. This is the longest process among all the progress in Project 2, despite its complexity, drawing typeface on a paper is a whole different level compared to the digital version. The most difficult part about this process is the consistency that I want to show within the letters which were sketched earlier. Pen tool, Shape tools, Shape Builder tool, and the Smooth tool was the main tools for this undergoing process.
Figure 8.3. The final digitization of the week. Consistency needs to be taken care of as told by Mr. Vinod.

 Week 9:
May 31st, 2019
Figure 9.1. Progression on project 2
Figure 9.2. Semi-final outcome of Project 2. The rough edges of some of the letters were balanced by adjusting its anchor point (suggested by Mr. Vinod).
Figure 9.3. Measuring consistency of the letters with basic rectangles.
Figure 9.4. Comparison between the final typeface to the original "model."
Figure 9.5. Finalized typeface of "Piya Sans."
Project 2 final work:
https://drive.google.com/file/d/1pq8S7j0o6EfqFIYziqsynx3-dHhC5muh/view?usp=sharing



Figure 9.6. "I survived Mr. Vinod and Mr. Sam's class" poster progression (made with Piya Sans typeface).
Figure 9.7. Project 2 final outcome

FEEDBACK

Week 8: May 24th, 2019

 The idea behind the font is interesting. Mr. Vinod suggested checking the typeface Optima because the contrast of the alphabet style is similar. Study the letters, break them down, see the differences between letters such as the O and C, they are a little different on the curve. Fix the lettering consistency, the idea is a pass, but the stroke weight on the contrast is still inconstant. Lastly, mind the minor details like fixing the sharp edges, which can help create an elegant font.

Week 9: May 10th, 2019

The overall typeface style is acceptable and nice. The consistency is well maintained compared to the previous week. There are few things to fix such as the contrast of the letter "s" as it too thin compared to rest. After importing all the letters into Fontlab, spacing and kerning of letters was the only concern. For the final project 2 of letter showcase, Mr. Vinod chose two of the left-aligned version showcase as they look edgier and has a more appealing arrangement to it.

REFLECTION

Experiences

Week 8: By comparing different letters together as told by Mr. Shamsul, I discovered a few tricks on constructing type (advice much appreciated).

Week 9: Getting used to Fontlab, discovered how powerful it is. The interface isn't the best but its function is very efficient despite my first time of use.

Observation

Week 8: I'm behind work, I felt lost and not knowing my own progress.

Week 9: It takes some time to align all the letters in Fontlab, my placements of the letters are also inaccurate and not positioned correctly.

Findings

Week 8: Write here... Don't work at the project all alone, email Mr. Vinod to confirm the work when needed, waste as less time as possible.

Week 9: It is much easier to use Fontlab after spending some time learning the software. The concept isn't as complicated as first thought, it is better to clear the fog first before walking straight in without knowing our direction. Rather than trying to position the letters in Fontlab manually, a preset with right calculations of baseline, x-height and cap height was set in Illustrator beforehand. Making the most out of Adobe Illustrator and Fontlab is one of the most efficient ways to create fonts, it saves at least half the time spent compared to the first attempt.

FURTHER READING

Grids - by Ambrose / Harris
n. a structure or pattern of lines used to guide the placement of the elements of a design

 Grids carry out one of the most important roles in an art composition, they are the skeletal structure behind every art pieces. These technical constructive rectangular boxes can be used to determine the right placement for design elements, to define a hierarchy, form proportions, columns, rules of third and many more functions. In typography and layout, grids bring in order, structure and help create a narrative in design.

 The grid system existed for a very long time dated from the 1400s and continually evolved throughout centuries. Until now, the grids still apply from book to web as the basic principles remained intact even after it has been developed over time.

 Understanding the natural eye reading direction is one of the basic knowledge for the use of the grid system. It can, however, lead the eye with its own unique design once fully understood with practices incorporated into it.

 Eyes, in general, scan a newly opened page from the top left area across to the bottom right. This knowledge can be used to lead the placement of key design elements. For web and screens, we tend to search for the key information and interest first, we usually do this by scanning across the top from left to right in 2 stripes, and then down the page, forming an "F" before moving towards to other sections.

 When talking about the modern design element, white space is the element that speaks louder than a compact design, this is because it provides design elements with breathing space. Its core function is to guide the reader around a page in a clearer approach, to simplify and standardize the reading pattern that has been once considered "complex" through the influence of technology.



Grids - by Ambrose / Harris
n.the sensation produced by rays of light of different wavelengths, a particular variety of this

 Basics
In design, color is the first element we see; Its role is to attract, steer, and direct attention of the audience. Color is the most immediate form of nonverbal communication; We react instantly to colors and they shape our emotions in a short time. A study has proven this matter by the explanation behind the fact that survivors back then rely upon colors as signs of what is consumable and risk. Color is the only design element that can represent thoughts and emotion in human and because of its importance, it’s essential for us to learn all the cultural norms and understanding of color usage all around us.

 Color theory
There are 2 forms of primary colors: Additives and Subtractives.
Secondary colors are the set of combination from primary colors in equal proportion.
Tertiary colors are a mixture of subtractive primary colors in the ratio of 1:2.

 Additive and Subtractive color models
Additive primary colors (RGB) are red, green, and blue, they all combine to form white.
Subtractive primaries (CMY) are blue, red, and yellow; They mix together to produce black. The mixture of colors is achieved by illuminating colored filters with white light from behind.

 *The CMY model is different from CMYK (printing primaries), the extra Black was added to create a better outcome for printing quality. *

 Describing colors
We describe colors in greater detail with values of hue, saturation, and brightness. The color wheel is a representation of the color spectrum to explain the relationship between different colors. Helps designers successfully select systematic color schemes and harmonious combinations for a design.