TYPOGRAPHY // TASK 2
Ang Shin Er / 0355231
Bachelor Of Design (Hons) In Creative Media / Taylor's University
Typography // TASK 2
LECTURES
WEEK 6 / SCREEN AND PRINT
| Lecture of Typography 6: Typography in Different Medium
F.g.1.1 Typography in Different Medium
| Print Type Vs Screen Type :
- Type for Print
Primarily, 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.
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.
- 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 reduced 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 designer.
- 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
- System Fonts for Screen/ Web Safe Fonts
- Windows-based devices might have one group.
- 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.
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.
- Pixel Differential Between Devices
F.g.1.2 Pixel Differential Between Devices
Even within a single device class there will be a lot of variation
| Static Vs Motion
- Static Typograph
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 Typograph
WEEK 7 / PROCESS DEMO FOR TASK 2
_
INSTRUCTION
TASK 2: EDITORIAL LAYOUT
For task 2, we were asked to typographically express the content
provided by Mr. Vinod in a 2-page editorial spread. We were given 3
option of editorial text to complete this task and we were required to
use Adobe Indesign to create this.
Rules for the task that had mentioned by Mr.Vinod :
- No images are allowed
- Minor graphical elements, i.e. line, shade, etc. might be allowed.
- Use Adobe InDesign to express the text given in size 200 x 200 mm per page
- Design the headline in Adobe Illustrator is allowed.
- However, the final layout is to be completed in Adobe InDesign.
We are only allowed to use the 10 typeface that are given which
is:
1. Adobe Caslon Pro
2. Bembo Std
3. Bodoni Std
4. Futura Std
5. Gill Sans Std
6. ITC Garamond Std
7. ITC New Baskerville Std
8. Janson Text LT Std
9. Serifa Std
10. Univers LT.
The first editorial text that I had choose is "FOLLOW THE CODE" . I
came out an idea with a coding element which is " </>".
F.g.2.1 create headline for FOLLOW THE CODE by using AI 11.5.2022
F.g.2.2 distort the direction for CODE 11.5.2022
F.g.2.3 progress of doing headline 11.5.2022
The font I'm using for healine is Futura.std and for the
content I'm using Bembo Std.
F.g.2.4 adjusting the detail of the content
11.5.2022
F.g.2.5 My first design outcome 11.5.2022
Then, I would like to try another editorial text from
the option of that given by Mr. Vinod which is
"VISUALISE FOR A BETTER WORLD" . My concept of this
design is a globe with a magnifier. I use a circle
with the word "VISUALISE FOR A BETTER" to replace the alphabet "O" and to create a shape to look like a magnifier to
express visualise. The semi-circle on the word "W" also is an
element of the globe.
F.g.2.6 Progress of doing headline in Adobe
Illustrator 11.5.2022
F.g.2.7 adjusting the detail of the headline in
Adobe Illustrator 11.5.2022
The font I'm using for healine is Futura std. and for
the content I'm using Bembo Std.
F.g.2.8 adjusting the detail of the content in
Adobe Indesign 11.5.2022
F.g.2.9 My second design outcome 11.5.2022
After receiving feedback from Mr.Vinod, I decided to choose
my second design as my final submission. I had adjust the
word "W" and "R" to make it align.
F.g.1.9 Aligning the word W and R 15.5.2022
F.g.2.10 Adjusting the font 15.5.2022
I also adjust the word to make sure it is align with the paragraph and
the text.
F.g.2.11 Progress of adjusting 15.5.2022
F.g.2.12 finalize my work 15.5.2022
F.g.2.13 My final submission 15.5.2022
My final submission with grid in PDF 15.5.2022
My final submission in PDF 15.5.2022
Details:
- Font: Futura/Bembo std
- Typeface: bold/Regular
- Font size: 10/21pt (for content) 300/50pt (for headline)
- Leading: 12pt
- Paragraph Spacing: 12pt
- Characters per line: 55-65
- Margins: 21 mm top and bottom, 15mm left and right
- Columns: 2
_
FEEDBACK
WEEK 6 :
-N/A-Raya Holidays
WEEK 7 / Task2 :
| General feedback : It is really interesting, is a
good piece of work, except for the bottom part. Have a
nicelly formatted text here, might have to consider the alignment
a little bit more.
| Specific feedback :
-
Have to rethink the bottom part
- Aware the typeface that you used
- Consider the alignment, such as the part "W" and "R" can be align with one of the paragraph.
WEEK 8 :
-N/A - Independent Learning Week -
_
REFLECTION
| Experiences
After watching lecture video, I learned how to
use Indesign and for this task I can utilise the knowledge that gained in other exercise.
It helped me to experience more in Indesign.I didn't use this software before and is quite hard
to me, so, keep repeating the lecture video
and also search some tutorial video to help me
learn.💪
| Observation
I havent touch this type of design before, so
during Typography exercise, I might not have
much idea came out in my mind. I think consistency is a key for doing all typography
exercise. It is important, as if using too many can lead
to a confusing and messy look.
| Findings
During this class, I had saw a lot of
interesting design from other student and
had learned a lot of rules of text
formatting. Expecially the alignment
and the balance of the text can straight
effect the feeling of the reader. I think
being creativity is very
important. This will encourages audience engagement and
helps increase its value.
_
FURTHER STUDY
Fg3.1 The Elements of Typographic Style,Book by Robert Bringhurst
Learning Summary: From this book, I know that Typographic best practices and standards are covered for everything from the basics, like building a page, establishing hierarchy, and choosing type combinations. Ang it might also works in a creative way like using decorative elements and with different font and text formatting. This book also offers a thorough look at the history of type, its various families, and its evolution.
There is one area in which this book is lacking, though, and for some, this will be a major detractor. While Bringhurt brings a wealth of information regarding typography for print, the lack of information for screen-based typography prevents it from being one-stop source for today’s designer. In this book, I can know all the tools that I need to confidently tackle a variety of typesetting projects, whether designing a book, poster, brochure, or any other print-based project.
Reference : Print Picks: The Elements of Typographic Style, by Taylor Slattery
Comments
Post a Comment