Typography - Project 2
Kitty Lai Yung Syn (0331933)
Typography
Project 2 - Font Design
LECTURE 9
22/05/2018
We were given project 2, which is font designing, in class. Thus, Mr Vinod gave us a short brief on the project.
LECTURE 10
29/05/2018
There was no lecture given today because it was a public holiday. But, Mr Vinod has tasked us on writing what we hate and what we love in 150 words each. With the 150 words written, format the text adhering to the tone of the written information on two A4 pages in a square of 200 x 200mm (0.5pt stroke width outline). Use one A4 for; somthing I love text; and another A4 for the something I hate text. Below are the instructions he gave us.- Set a margin. Create columns and rows.
- Choose an appropriate typeface from the 10 given (for love and hate respectively)
- Format the text while considering the point size, line length, alignment, ragging and tracking.
- Save as PDF, upload to G-Drive and embed onto eportfolio.
- Print out on A4 and bring to the next class.
LECTURE 11
05/06/2018
Today was the first time Mr Shamsul giving lecture to us. I could see how nervous he was but overall I like the speed on how he explain. So, we learnt about 'Typography in Different Medium'.
Type for Print
Type was designed intended for reading from print long before we read from screen. It's the designer's job to ensure that the text is smooth, flowing and pleasant to read. A good typeface for print - Caslon, Garamond, Baskerville are the most common typefaces that is used for print. Because of their characteristic which are elegant and intellectual but also highly readable when set at small font size. They are versatile, easy-to-digest classic typeface, which has a neutrality and versatility that makes typesetting with it a breeze.
Type for Screen
Typefaces intended for use on the web are optimized and often modified to enhance readability and performance onscreen in a variety of digital environments. This can include a taller x-height (or reduces ascenders and descenders), wider letterforms, more open counters, heavier thin strokes and serifs, reduced stroke contrast, as well as modified curves and angles for some designs. Another important adjustment – especially for typefaces intended for smaller sizes – is more open spacing. All of these factors serve to improve character recognition and overall readability in the non-print environment, which can include the web, e-books, e-readers, and mobile devices.
Hyperactive Link/ Hyperlink
A hyperlink is a word, phrase, or image that you can click on to jump to a new document or a new section within the current document. Hyperlinks are found in nearly all Web pages, allowing users to click their way from page to another. Text hyperlinks are normally blue and underlined by default. When you move the cursor over a hyperlink, whether it is text or an image, the arrow should change to a small hand pointing at the link.
Font Size for Screen
16-pixel text on a screen is about the same size as text printed in a book or magazine; this is accounting for reading distance. Because we read books pretty close—often only a few inches away—they are typically set at about 10 points. If you were to read them at arm’s length, you’d want at least 12 points, which is about the same size as 16 pixels on most screens.
System Fonts for Screen/ Web Safe Fonts
Each device comes with its own pre-installed font selection. Which is based largely on its operating system. The problem is that each differs a little bit. Windows-based devices might have one group. While MacOS ones pull from another. Then Google’s own Android system uses their own as well. Let’s say the designer picked some obscure, paid font family for this site’s design. If you don’t have that font already installed and it’s not pulling from a web-friendly place – more on that later – the font you see would default back to some basic variation like Times New Roman. You, as the visitor, wouldn’t necessarily know that’s what happened, though. To you, it would just look plain ugly. ‘Web safe’ ones, however, appear across all operating systems. They’re the small collection of fonts that overlap from Windows to Mac to Google.
(Safe fonts examples: Open Sans, Lato, Arial, Helvetica, Times New Roman, Times, Courier New, Courier, Verdana, Georgia, Palatino, Garamond)
Pixel Differential Between Devices
The screens used by our PCs, tablets, phones and TVs are not only different sizes, but the text you see on-screen differs in proportion too, because they have different sized pixels. 100 pixels on a laptop is very different from 100 pixels on a big 60″ HDTV. Even within a single device class there will be a lot of variation.
Static typography
Static typography has minimal characteristic in expressing words. Traditional characteristics such as bold and italic offer only a fraction of the expressive potential of dynamic properties. From billboards to posters, magazines to fliers, we encounter all forms of static typography with wide ranging purposes. Whether they are informational, promotional, formal or aspirational pieces of designs, the level of impression and impact they leave on the audience is closely knitted to their emotional connection with the viewers.
Motion Typography
Temporal media offer typographers opportunities to “dramatize” type, for letterforms to become “fluid” and “kinetic” (Woolman and Bellantoni, 1999). Film title credits present typographic information over time, often bringing it to life through animation. Motion graphics, particularly the brand identities of film and television production companies, increasingly contain animated type. Type is often overlaid onto music videos and advertisements, often set in motion following the rhythm of a soundtrack. On-screen typography has developed to become expressive, helping to establish the tone of associated content or express a set of brand values. In title sequences, typography must prepare the audience for the film by evoking a certain mood.
INSTRUCTION
PROJECT 2
 |
| Figure 1.1 Progression |
 |
| Figure 1.2 Outline of the final
This is the outline look of my final. Before saving this, I made sure that the background is clear, without and paths left behind, only I proceeded.
|
 |
| Figure 1.3 Outcome 1 (First attempt) |
After letting Mr Vinod checked my final outcome, he said I have to redo because he said he still can see the characteristics of Myriad Font which I used for reference. So, below are my second attempt.
 |
| Figure 1.4 Progress 1 (Second attempt) |
 |
| Figure 1.5 Final Outcome (Second attempt) |
 |
| Figure 1.6 Research On FontLab VI |
Figure 1.8 Process 1
Figure 1.9 Process 2
FEEDBACK
Week 9: Today, Mr Vinod gave us a small talk about design and the attitude and behavior we design students/designers should have. From what he told us, I really understood what he wanted to deliver. Basically, he wanted us to understand that being a designers, we should be more open minded and accept the feedback from everyone. We should have a positive mindset and the heart of learning whenever we came to being critiqued. That is how a great successful designer grows. Afterwards, we were given a project on designing fonts for Taylor's logo by using Adobe Illustrator.
Week 10: There was no class for this week due to public holiday.
Week 11: Mr Vinod said we were too passive. We and the lecture should be having interaction and communication in the lecture.
Week 11: Mr Vinod said we were too passive. We and the lecture should be having interaction and communication in the lecture.
REFLECTION
Experience
Week 9: I understand that being a designers, we should be more open minded and accept the feedback from everyone. We should have a positive mindset and the heart of learning whenever we came to being critiqued. That is how a great successful designer grows.
Week 11: I understood that how important is a lecture with students interaction. This could let the lecturer know what we don't understand.
Observation
Week 9: I observed that when we are designing a font, there are lots of details we always tend to miss out and those details might be affect the features of the font.
Week 11: I have observed that we were quite quiet during the lecture, and Mr Shamsul might not know if we were really understand what he was delivering to the us.
Findings
Week 9: Great designer can be trained by doing a basic which is be open minded, To elaborate, accepting comments or feedback from people.
Week 11: I found out that type sizes are so important not only on graphic but also on screen and web. I learned about the differences between static and motion typography and the pixels and the size of fonts presenting on a different screen.
FURTHER READING (Week 9 - week 11)
Week 9 - week 10
 |
| Figure 2.1 Front Cover and Back Cover |
 |
| Figure 2.2 |
 |
| Figure 2.3 |
 |
| Figure 2.4 |
 |
| Figure 2.5 |
 |
| Figure 2.6 |
 |
| Figure 2.7 |
 |
| Figure 2.8 |
An in-Depth Guide to the Art & Techniques of Contemporary Typography by Tova Rabinowitz
Type in Digital Environment:
- The highly detail-oriented nature of traditional typographic design is wasted on computer screens because the poor resolution cannot reproduce the intricate nuances of type designs
- Legibility and readability have become paramount to screen typography, always keeping the reader's comfort, comprehensive, and ease of viewing in mind
- To emerge is a whole different set of "rules" for maximising screen legibility and readability
- Digital typography offers many new capabilities that let designers create dramatic and dynamic,ic designs
Notes:
The illusion of movement in film, video, and digital environment results from the sequencing of sill images at a rate is faster than the eye can register each one individually. The human brain continues to perceive what the eye sees for an instant longer than the eye actually sees it. This psychological phenomenon is called Persistence of Vision. Paired with Gestalt's psychological Law of Closure, Persistence of Vision allows the brain to fill in the missing positions to create the perception of a continuous flowing movement. A rate of 24 frames per second is sufficient to trick the human eye into perceiving a sequence of still images as one single moving image.
Comments
Post a Comment