TYPOGRAPHY|TASK1:EXERCISES
Ⅱ04/04/23-09/05/23(Week 1- Week 6)
Il Hu Yao Ping,0376768I Typography
Il Task 1: Exercises.
Bachelor of Design (Honours) in Creative Media
TABLE OF CONTENTS
1.
Lectures
2.
Instructions
3.
Process Work
3.1 Research
3.2 Ideation
3.3 Final Outcome
4.
Feedback
5.
Reflection
LECTURES
WEEK 1(a) / Introduction
.Typography: The art and technique of arranging type to make written language
legible, readable, and appealing when
displayed.
.Font: The individual font or weight within the
typeface.
.Typeface: The entire family of fonts/weights that share
similar characteristics/styles.
WEEK 1(b) / Development
Early Development / Timeline
.Essentially, due to the materials utilised, uppercase forms are a
simple combination of straight lines and pieces of
circles.
.Phoenicians wrote from right to left.
.The Greek wrote alternatively, from right to left, and then left to
right –
boustrophedon.
.Etruscan carvers eventually developed certain strokes as they
painted, resulting in what we refer to as
serifs.
.Over the course of about 900 years, Roman letters were developed
from Phoenician and Greek letters.
.Square capitals were developed by the use of slanted tools,
resulting in thick and thin strokes.
.Rustic capitals – a compressed version of square capitals. While
they took less time to write and occupied a smaller
space, they were more difficult to read.
.Lowercase letterforms were eventually formed while writing quickly.
.Uncials – 'small letters' (incorporated elements of both uppercase
and lowercase letters).
.Half-uncials – the first formal introduction of lowercase letters.
.To standardise text, uppercase and lowercase letters,
capitalisation, and punctuation were introduced under the
command of Charlemagne. This allowed for clearer
communication.
.Later on, different variations of the script were formed in
different parts of Europe as a result of the different
environments/tools/skill/culture/etc.
Text Type Classifications
1450 Blackletter: The earliest printing type – based on the
hand-copying styles used in books in northern
Europe at the time.
1475 Oldstyle: Based on the lowercase forms used by Italian
humanist scholars for book copying and the
uppercase letterforms found inscribed on roman ruins.
1500 Italic: Condensed and close-set (now not considered as a
separate typeface).
1550 Script: An attempt to replicate engraved calligraphic
forms.
1750 Transitional: A refinement of oldstyle forms – thick and
thin relationships were exaggerated, and brackets were
lightened.
1775 Modern: Serifs are unbracketed, and the contrast between
thick and thin are extreme.
1825 Square Serif / Slab Serif: Unbracketed with little
variation between thick and thin
strokes.
1900 Sans Serif: Eliminated serifs.
1990 Serif / Sans Serif: Includes both serif and sans serif
alphabets.
Early letterform development: Phoenician to Roman
The first method of people writing is by using a sharpened stick to scratch
into wet clay or a chisel to carve into stone.Capital letters are the only
letter form used in the past 2000 years, originating from the use of these
tools and materials. Essentially, capital letters are the basic combination of
lines and circles, reflecting the tools and materials available for early
writing methods.
Roman cursive was used during everyday transactions for speed. This is
the beginning of lowercase letterforms.
FADEBACK:
Introductory class, no sketches submitted or
feedback received
WEEK 2/BASIC:
Text/Tracking: Kerning and Letterspacing
Kerning is the automatic adjustment of space between letters
Kerning is NOT letterspacing
Tracking is the addition and removal of space in a word or sentence
Designers always letter space uppercase letters but are against
letterspacing lowercase letters within the text
Type with a generous X-height or a heavy stroke width produces a darker mass
on the page as compared to a smaller X-height or a lighter stroke
Different situations use different fonts, this picture is an example. If
it is a wedding scene, the font on the left is more consistent.
FADEBACK:
General: Mr Max taught us the basics of Adobe Illustrator and the tips
and tricks to navigate the program efficiently. He also reminded us to
complete our task in the first week and offered more counseling. I created a
total of 7 sketches for 2 words
WEEK 3/TEST:
Specific: Mr Max said that i was not following the guidelines for some of
the sketches due to it being considered as adding elements to the words.
Amongst the various sketches that were presented only 1 had more potential
to be presented for the assignment. I went back to the drawing board to
figure out how to create meaning from the words without the addition of
external elements.
Italics, bold, color, different typefaces
Only CMYK for body text
Typically reduce the font size of the highlighted text by .5 to match the
x-height of the serif typeface
All capital acronyms are also reduced by .5 to ensure visual cohesion
Quotation marks help to create a clear indent
FADEBACK:
General: Mr Max gave us the class to settle on our work and
digitize our sketches. He gave us more counseling in class. I created
additional sketches for the remaining 2 words and presented it to Mr Max
Specific: After completing the sketches for all the words, I yet again
presented the new work to Mr. More. The sketches were approved this time,
but I had a problem with creating ideas for the word “Grow” without adding
external elements. Mr suggested that I go with something simpler and
redesign the sketch to “Grow” from the word itself. 3 out of 4 words were
approved for digitizing and I yet again have to rethink a simpler and more
calligraph-based design for Grow.
WEEK 4/TEST:
.The title is very important in a typographical article, it can determine
the structure of the article, whether it is attractive to readers.
.There should also be some spacing when writing articles, so that the
paragraphs look neat and uniform.
FADEBACK:
General: Mr Max gave us a basic teaching about animating with Adobe
Illustrator and Photoshop. He instructed us to start working on animating
our designs.
Specific: I finally have all 4 sketches approved and ready for animation.
Completing my sketches in Photoshop helped save time to digitize my work. I
chose the word "burn" for my animation and was given some consultation on
how to replicate the sketch in Illustrator and animate it.
WEEK 5/LETTEER:
When letters are joined to form words, the counter form includes the
spaces between them.Simple contrasts produce numerous variations
These letters have a slight diagnostic stress, they are letters with
vertical stress, which is a transitional stage of copying into
handwriting. Remember, never use a capital letter to form a name or word.
It's a no-no.
FADEBACK:
General: Mr Max gave us a basic teaching about animating with Adobe
Illustrator and Photoshop. He instructed us to start working on animating
our designs.
Specific: I finally have all 4 sketches approved and ready for animation.
Completing my sketches in Photoshop helped save time to digitize my work. I
chose the word "burn" for my animation and was given some consultation on
how to replicate the sketch in Illustrator and animate it.
WEEK 6/TYPOGRAPHY IN DIFFERENT MEDIUM:
Rest this is not symmetrical, my usual font design takes it for granted to
design a symmetrical font, these letter forms are both harmonious and have
personality expression.It shows a unique aesthetic feeling, which also
conforms to the characteristics of font design.
INSTRUCTIONS
TASK 1/EXERCISE1-TYPE EXPRESSION
This is the draft I found based on asking the teacher for
advice. I found some similar expressions on the website as follows, and then
made it into a draft.
This is a semi-finished product I made based on the materials, my own ideas
and the teacher's suggestions. According to the meaning of the letters
burn: pull and deform the letters to form the shape of a flame
melt: pull the letters down slightly to form a melting feeling
grow: the letters can be enlarged at once, like a plant growing, or
become longer, fade: the letters can be smaller at once or
gradually faded
ANIMATION:
Next, I have to choose one of the four words to design. I chose
grow because it can simply, vividly and intuitively show the meaning of the
dynamic. I first put it in AI to create its four states.
Then I put these four different forms of grow into PS for dynamic creation
as follows
Here is the final result.
TASK 1 / EXERCISE 2 – TEXT FORMATTING:
You will be given incremental amounts of text that address different areas
within text formatting i.e. type choice, type size, leading, line-length,
paragraph spacing, forced-line-break, alignment, kerning, widows and orphans
and cross-alignment. These minor exercises (Formatting Text 1:4 to 4:4A)
will increase your familiarity and capability with the appropriate software
and develop your knowledge of information hierarchy and spatial arrangement.
The task ends with the submission of one layout in A4 size demonstrating."
Kerning and Tracking
I first practiced kerning and tracking with my name using the 10 typefaces
provided.
Layouts
Then, following the tutorials and text provided, I started working on
InDesign.
Here is the final result:
FEEDBACK:
week 1: Introductory class, no sketches submitted or feedback received
week 2:General: Mr Max taught us the basics of Adobe Illustrator and the tips and tricks to navigate the program efficiently. He also reminded us to complete our task in the first week and offered more counseling. I created a total of 7 sketches for 2 words
Specific: Mr Max said that i was not following the guidelines for some of the sketches due to it being considered as adding elements to the words. Amongst the various sketches that were presented only 1 had more potential to be presented for the assignment. I went back to the drawing board to figure out how to create meaning from the words without the addition of external elements.
week 3:General: Mr Max gave us the class to settle on our work and digitize our sketches. He gave us more counseling in class. I created additional sketches for the remaining 2 words and presented it to Mr Max
Specific: After completing the sketches for all the words, I yet again presented the new work to Mr. More. The sketches were approved this time, but I had a problem with creating ideas for the word “Grow” without adding external elements. Mr suggested that I go with something simpler and redesign the sketch to “Grow” from the word itself. 3 out of 4 words were approved for digitizing and I yet again have to rethink a simpler and more calligraph-based design for Grow.
week 4:General: Mr Max gave us a basic teaching about animating with Adobe Illustrator and Photoshop. He instructed us to start working on animating our designs.
Specific: I finally have all 4 sketches approved and ready for animation. Completing my sketches in Photoshop helped save time to digitize my work. I chose the word "burn" for my animation and was given some consultation on how to replicate the sketch in Illustrator and animate it.
week 5:General: Mr Max gave us a basic teaching about animating with Adobe Illustrator and Photoshop. He instructed us to start working on animating our designs.
Specific: I finally have all 4 sketches approved and ready for animation. Completing my sketches in Photoshop helped save time to digitize my work. I chose the word "burn" for my animation and was given some consultation on how to replicate the sketch in Illustrator and animate it.
REFLECTION:
Experience
Typography, so far, has been an enjoyable module. While it can be
challenging at times, the satisfying outcome of my Task 1 makes it all
worthwhile. I believe this task is an excellent way for us students to gain
insight into what Typography truly is.
Observation
The restrictions for this task encouraged me to think creatively. I’ve come
to appreciate that simplicity isn’t always a drawback; at times, it allows
the message to take center stage. As Mr. Vinod mentioned, the goal is to
ensure that people read the word first instead of focusing on the design, or
something along those lines, which emphasizes the importance of subtlety in
typography.
Findings
I realized that typography is far more meticulous than I’d imagined. I
already knew it required attention to detail, but I didn’t expect it to be
this precise. Every element is carefully considered and planned, down to the
smallest adjustments that most people might overlook, like avoiding 'rivers'
in text. It’s impressive how these subtle tweaks shape the entire feel and
readability of a design.
FURTHER READING:
The layout of books is page by page. Each page is composed of
different sizes of text, charts, etc. in accordance with unified technical
specifications. In the same book, regardless of its format and content, the
text must be unified size, length, line spacing, etc., to maintain the basic
consistency of the format center. Mainly deal with the relationship between
the title, page number, text, annotations and charts, so that the
composition of the layout is clear, coordinated, beautiful and easy to read.
The typesetting of books, especially the system table, is a complicated work
in typesetting technology. Operation must have skilled skills, in order to
make the output of the book beautiful, eye-catching.
The classification and composition of books, books referred to as
tables. It is an effective expression of the results of the experimental
data. There are many kinds of books, which can be classified in many ways
from different perspectives. According to its layout, books can be divided
into two categories: books and parts books. Books and periodicals such as
data sheets, statistical tables and flow tables, parts books such as
attendance sheets, payroll sheets, experience sheets, invoices and contract
sheets. According to its structure, books
can be divided into three categories: horizontal line table, wireless table
and set line table.
Books arranged with lines as column lines and line lines are called
horizontal line tables, also known as card line tables; Books separated by
space without lines are called wireless tables; The books are arranged on
different pages and then printed by overprinting the books are called
nesting tables. The most widely used in books is the horizontal line table.
Ordinary books can generally be divided into four parts: table title, table
head, table body and table note, and the names of each part.
Among them, the table title consists of the table order and the
title text, which generally adopts the boldface character row with the same
size and one smaller size. The table header is composed of each column
header, and the text in the table header is 1-2 font size smaller than the
text. The body is the content and main body of the book, composed of several
lines and columns, the content of the column has the item column, data
column and remarks column, etc., the text in each column is required to be
1-2 words smaller than the text.


Comments
Post a Comment