Typography / Task 1: Exercises

27.8.2021 - 24.9.2021 (Week 1 - Week 5)
Abigail Kartika Darmowinoto / 0350525 / Bachelor of Design in Creative Media
Typography / Taylor's University
Task 1/ Exercises

LIST

OTHER POSTS

Typography / Task 2: Typographic Exploration & Communication (Layouting)
Typography / Task 3A: Type Design & Communication (Font Design)
Typography / Task 3B: Type Design & Communication (Sticker Design)
Typography Final Compilation and Reflection
"Typography" Label

LECTURES
<back to top>

Week 1 (27/08/2021) : Introduction & Briefing
Today is the first day of the Typography Class. Typography seems like an interesting subject in BDCM. It was lectured by Mr. Vinod and Mr. Charles. The first week of the lecture, both of the lecturers give us some general information about the class. Started with Mr. Vinod explaining us about the MIB (Module Information Booklet), until we were explained about how to set up our E-portfolio blog. After that, we were briefed about what we should do for our first exercise. For this week's lectures, we were supposed to watch some youtube videos consisting of Mr. Vinod's lectures.

Week 2 (03/09/2021) :

Today is the second day of the class. Fist thing first, Mr. Vinod asked us to submit our word sketches. Then, Mr. Vinod guided us on how to export our artwork to '.jpeg'. After Mr. Vinod demonstrated how to do it, he began to give some feedbacks to some random artworks. After that, we were divided on to 10 breakout rooms, which every room consist of 4 students. We have to give some feedbacks to our friends' sketches. We were given some question as our guideline on how to give feedbacks.

Questions:
   1. Are the explorations sufficient?
   2. Does the expression match the meaning of the word?
   3. On a scale of 1–5, how strong is the idea?
   4. How can the work be improved?

Lastly, we were shown by our lecturers a E-Portfolio from our senior, which will be our guideline on how our E-Portfolio should look like.

Week 3 (10/09/2021) :

Today, Mr. Vinod gave us some feedback for our typography. After that, Mr. Vinod lectured us on how to animate our GIF using both Illustrator and Photoshop. I don't have any idea at first, but Mr. Vinod gave us a very clear lecture which finally made me understand how things work.

Week 4 (17/09/2021) :

On this day, Mr. Vinod gave us some feedback for our typo GIF. We were given some guiding questions to decide whether our GIF is ok or not:

Is the animation suitable?
Does the animation reflect or enhance the meaning of the word?
Does the animation reflect the form being expressed?
Does the animation create a smile in your mind?
How can it be improved?

Then, Mr. Vinod told us to watch some videos about text formatting. Then, we should make 2 types of thing based on the videos provided.

Week 5 (24/09/2021) :

Mr. Vinod and Mr. Charles started to mark our e-portfolio. We were asked to proceed to Task 2. We have to watch some videos on Mr. Vinod's Lecture Playlist.

LECTURE VIDEOS

"Typo_0_Introduction" (General Information about Typography)

In the first lecture video, Mr. Vinod introduce us to, what's the idea of typography, what's the function, where can we find typography, and the big picture of typography's history. Typography has evolved for 500 years; calligraphy (the writing), lettering (the drawing), typography.

Font > "Fondre" (Old French) > place that has metal. The difference between font and typeface is that, font refers to individual font / weight in the typeface (e.g. Georgia Regular, Georgia Bold, Georgia Italic, Georgia Bold Italic), while typeface refers to the entire font family (e.g. Arial, Times New Roman, Georgia, Courier).

"Typo_1_Development" (The Typography Timeline)

In this video section, Mr. Vinod first explains how the timeline of typography move, then he explained about the font classification. Here are some they:

T I M E L I N E

1. Early Letterform Development (Phoenician to Roman)

fig. 1, The Evolution of Typography, source: (https://jawaheralhajri.wordpress.com/2014/10/25/brief-history-of-the-traditional-arabic-type/), Week 1 (27/08/2021)

How people write >> scratching wet clay with stick / carving a stone with chisel.
Writing Direction >> Phoenician = right to left, Greek = right to left then left to right (boustrophedon = how the ox ploughs).

fig. 2, Boustrophedon Example, source: (https://commons.wikimedia.org/wiki/File:Boustrophedon.svg), Week 1 (27/08/2021)

In this current timeline, uppercase font were made with simple combination of straight lines and circle.
A change in weight and strokes happen because Etruscan (then Roman) carvers working in marble painter letterforms before scrubbing it. Here's the changing process;

fig. 3, The Change from Phoenician to Roman, source; lecture video, Week 1 (27/08/2021)

2. Hand Script from 3rd-10th century C.E.

Square Capitals (4th or 5th century)

Probably started to use written pen with slant that can make thick and thin stroke.
Pen held at 60°off the perpendicular
Added the serif.

fig. 4, Roman Square Capitals in Inscription, source: (https://en.wikipedia.org/wiki/Roman_square_capitals), Week 1 (27/08/2021)

Rustic Capitals (Late 3rd - mid 4th century)

Easier, faster to write, but hard to read.
Pen held at 30°off the perpendicular.
Compressed Version of square capitals.

fig. 5, Rustic Capitals Example, source: (https://en.wikipedia.org/wiki/Rustic_capitals), Week 1 (27/08/2021)

Roman Cursive (4th century)

Written in handwriting, the form were simplified for speed.

fig. 6, Roman Square Capitals in Inscription, source: (https://en.wikipedia.org/wiki/Roman_square_capitals), Week 1 (27/08/2021)

Uncials (4th - 5th century)

Incorporated some Roman cursive Hand.
Readable in small capitals rather than rustic capitals.

fig. 7, Uncials inThe Book of Kells, source: (https://en.wikipedia.org/wiki/Uncial_script), Week 1 (27/08/2021)

Half Uncials (C. 500)

Mark the formal beginning of lowercase letterform.

fig. 8, Half Uncials, source: (https://en.wikipedia.org/wiki/Uncial_script), Week 1 (27/08/2021)

Carolingian Minuscule (C. 925)

To standardised the writing system.
Alcuin of York rewrote the font texts using both majuscules, minuscule, capitalisation, and punctuation.

fig. 9, Carolingian Minuscule, source: (https://en.wikipedia.org/wiki/Carolingian_minuscule), Week 1 (27/08/2021)

Blackletter (C.1300)

Strongly vertical letter

fig. 10 Blackletter Example in One of Book in British Library, source: (https://en.wikipedia.org/wiki/Blackletter), Week 1 (27/08/2021)

42 Line Bible, Johan Guttenberg, Mainz. (C. 1455)

Guttenberg build pages that accurately mimicked the worker's of the scribe's hand.
Required different brass matrix, and negative impression.
To simplify the writing in religious books.

fig. 11 One of Page in Guttenberg's Bible, source:(https://en.wikipedia.org/wiki/Gutenberg_Bible), Week 1 (27/08/2021)

C L A S S I F I C A T I O N

Blackletter (1450)

The earliest printing type.
Based upon hand copying style in books.
Examples: Cloister Black, Goudy Text

fig. 12, Blackletter, source; lecture video, Week 1 (27/08/2021)

Oldstyle (1475)

Based upon the lowercases forms used by Italian humanist scholars for book copying, and uppercase letterforms found inscribed on Roman ruins.
Examples: Bembo, Caslon, Dante, Garamond, Janson, Jenson, Palatino

fig. 14, Oldstyle, source; lecture video, Week 1 (27/08/2021)

Italic (1500)

Replicating Italian handwritings.
Considered as their own class at first but started to complement roman forms.

fig. 15, Italic, source; lecture video, Week 1 (27/08/2021)

Script (1550)

Attempt to replicate calligraphy forms.
Not entirely appropriate in lengthy text.
Forms are ranged from formal and traditional to the casual and contemporary.
Examples: Kuenstler Script, Mistrall, Shell Roundhand

fig. 16, Script, source; lecture video, Week 1 (27/08/2021)

Transitional (1750)

Refinement of oldstyle forms.
Thick to Thin relationships were exaggerated, brackets are lightened.
Examples: Baskerville, Bulmer, Century, Time Roman

fig. 17, Transitional, source; lecture video, Week 1 (27/08/2021)

Modern (1775)

Further rationalisation of old style letterform.
The serifs aren't bracked , extreme contrast of the thick and thin stroke.
Examples: Bell, Bodoni, Caledonia, Didot, Walbaum

fig. 18, Modern, source; lecture video, Week 1 (27/08/2021)

Square Serif / Slab Serif (1825)

Originally heavily bracketed serif.
Little variation between thick and thin strokes.
Developed for advertising for heavy type commercial print needs.
Examples: Clarendon, Memphis, Rockwell, Serifa

fig. 19, Square Serif / Slab Serif, source; lecture video, Week 1 (27/08/2021)

Sans Serif (1900)

Eliminated serifs altogether.
First introduced in 1816, but become popular in 20th century.
Variation tended toward Gill Sans (humanist) and Futura (geometric).
Strokes were flared to suggest the origin, Optima.
Also referred as grotesque and gothic.
Examples: Akzidenz Grotesk, Grotesk, Gill Sans, Futura, Helvetica, Franklin Gothic

fig. 20, Sans Serif, source; lecture video, Week 1 (27/08/2021)

Serif / Sans Serif (1990)

Recent development
Include both Serif and Sans Serif alphabets family.
Examples: Rotis, Scala, Stone

fig. 21, Serif / Sans Serif, source; lecture video, Week 1 (27/08/2021)

"Typo_2_Basic" (About Typography Glossary and Anatomy)

Over the 500 years evolution, typography employs a number of technical terms. In the first 2 minutes, Mr. Vinod started the explanation by explaining the typography part. After that, he explain about some typography basic.

fig. 22, Typography Basic, source; lecture video, Week 2 (03/09/2021)

After that, Mr. Vinod explained some basic glossary for typography, they are;

fig. 23, Typography Glossary, source; (https://www.facebook.com/photo/?fbid=1066354760164532&set=p.1066354760164532), Week 2 (03/09/2021)

fig. 24, Typography Glossary II, source; (https://d2pzhy4sc0lwtr.cloudfront.net/enlargements/3/60a0c11945a9a531c38c80fce4ee360e/FS_TypeTerms_AW.pdf), Week 2 (03/09/2021)

fig. 23, Describing Letterform PDF, Week 2 (03/09/2021)

"To work successfully with type, you should make sure you that you are working with a full font and you should know know how to use it" - Mr. Vinod.

After Mr. Vinod explained about Typography Glossary of Term, he explained us about types of Fonts.

THE FONT

Uppercase (ex. see fig. 53 upper part)

Capital Letters, including ç (C-cedilla), ñ (N-tilde), Æ/æ and Œ/œ

Lowercase (ex. see fig. 53 lower part)

Same character as uppercase

fig. 24, Uppercase and Lowercase, source; lecture video, Week 2 (03/09/2021)

Small Capital

Uppercase letterform drawn to the X-height of typeface
Primarily found on serif fonts, part of the thing often called expert set

fig. 25, Small Capital, source; lecture video, Week 2 (03/09/2021)

Uppercase Numerals

Lining figures
Same height and kerning width as the uppercase letter

fig. 26, Uppercase Numerals, source; lecture video, Week 2 (03/09/2021)

Lowercase Numerals

Old style figures / Text figures
Set to x-height with ascender and descender
Less common in sans serif than serif

fig. 27, Lowercase Numerals, source; lecture video, Week 2 (03/09/2021)

Italic

The forms in Italic refers back to 15th century cursive handwriting
Small caps mostly not available with Italic

fig. 28, Italic, source; lecture video, Week 2 (03/09/2021)

Punctuation, Miscellaneous Character

Can change from typeface to typeface

fig. 29, Punctuation and Misc Character, source; lecture video, Week 2 (03/09/2021)

Ornaments

Flourishes in invitation / certificates
Sometimes provided as a font in larger typeface family
Only few typeface contain ornaments (e.g., Adobe Caslon Pro)

fig. 30, Ornaments, source; lecture video, Week 2 (03/09/2021)

"Typo_3_Text_P1" (About Letter and Paragraph Formatting)

1. Text / Tracking: Kerning and Letterspacing

Kerning = adjustment of space between letters.

Letterspacing = add space between the letters.

Tracking = addition and removal of space in a word or sentences

Uppercase letterforms are drawn to be able to stand on their own, lowercase letterforms needs counterform created between letters to maintain the line of reading.

fig. 31, Kerning, source; lecture video, Week 3 (10/09/2021)

fig. 32, Tracking, source; lecture video, Week 3 (10/09/2021)

fig. 33, Tracking in Text, source; lecture video, Week 3 (10/09/2021)

2. Formatting Text

Flush left:

Text started in left
Mirrors the asymmetrical experience of handwriting
Each line starts at the same point but ends wherever the last word on the line ends.
Spaces between words are consistent throughout the text, allowing the type to create an even gray value

Centered:

Text started in center
Imposes symmetry upon the text
Assigning equal value and weight to both ends of any line
Transforms fields of text into shapes, adding a pictorial quality to material that is non-pictorial by nature
Important to amend line breaks so that the text does not appear too jagged.

Flush right:

Text started in right
This format places emphasis on the end of a line as opposed to its start.
Useful in situations (like captions) where the relationship between text and image might be ambiguous without a strong orientation to the right.

Justified:

Imposes a symmetrical shape on the text (like centering)
Achieved by expanding or reducing spaces between words / letters.
Can occasionally produce ‘rivers’ of white space running vertically through the text.
Attention to line breaks and hyphenation is required to amend this problem whenever possible.

fig. 34, Types of Paragraph Formatting, source; lecture video, Week 3 (10/09/2021)

Note from Mr. Vinod: "If you see the type before you see the words, change the type."

3. Texture

fig. 35, Typeface Anatomy, source; lecture video, Week 3 (10/09/2021)

Different typefaces suit different messages

fig. 36, Type of Typefaces, source; lecture video, Week 3 (10/09/2021)

The goal in setting text type is to allow for easy, prolonged reading
Things to be considered:

Type size: should be large enough and easy to read
Leading: If set too loosely creates striped patterns that distract the reader from the material at hand. The appropriate is +2 - +3 from the type size
Line Length: Should be between 55-65 characters. Extremely long or short lines lengths impairs reading

fig. 37, Leading and Line Length, source; lecture video, Week 3 (10/09/2021)

4. Type Specimen Book

Shows samples of typefaces in various different sizes.
Provide an accurate reference for type, type size, type line length, etc.

fig. 38, Type Specimen Book, source; lecture video, Week 3 (10/09/2021)

"Typo_4_Text_Part2" (Paragraph Formatting Part 2)

1. Indicating Paragraphs

Pilcrow (¶): A holdover from medieval manuscripts seldom used today
Line space (leading): Gap between the paragraphs. If the line space is 12pt, then the paragraph space is 12pt. This ensures cross-alignment across columns of text.

fig. 39, Line Spacing vs Leading, source; lecture video, Week 4 (17/09/2021)

Two types of paragraph indentations; standard and extended, standard is recommended because extended create unusual wide columns:

fig. 40, Paragraph Indentations, source; lecture video, Week 4 (17/09/2021)

2. Widows and Orphans

Widow: Short line of type left alone at the end of a column of text
Orphan: Short line of type left alone at the start of a new column

fig. 41, Widows and Orphans, source; lecture video, Week 4 (17/09/2021)

Solution to widows: rebreak your line endings through out your paragraph so that the last line of any paragraph is not noticeably short.

3. Highlighting Text

There are several ways to highlight text:

Italic
Bold
Change Color
Change Typeface (note: adjust the X-height)
Fill Shape
Punctuation Marks (Bullets, Quotation Marks)

fig. 42, Highlighting Text I, source; lecture video, Week 4 (17/09/2021)

fig. 43, Highlighting Text II, source; lecture video, Week 4 (17/09/2021)

fig. 44, Highlighting Text III, source; lecture video, Week 4 (17/09/2021)

fig. 45, Highlighting Text IV, source; lecture video, Week 4 (17/09/2021)

4. Headers

Many kinds of subdivision within text of a chapters. In the following visuals these have been labeled (A, B, and C) according to the level of importance. Putting together a sequence of subheads = hierarchy.

A head:

indicates a clear break between the topics within a section.

B head:

Subordinate to A heads
Indicate a new supporting argument or example for the topic at hand
Should not interrupt the text as strongly as A heads do.

C head:

Highlight specific facets of material within B head text
Don't interrupt the flow of reading
Followed by at least an em space for visual separation

fig. 46, Heading, source; lecture video, Week 4 (17/09/2021)

5. Cross Alignment

Cross aligning headlines and captions with text type reinforces the architectural sense of the page—the structure—while articulating the complimentary vertical rhythms.

fig. 47, Proper Cross Alignment, source; lecture video, Week 4 (17/09/2021)

In the lecture, Mr. Vinod also told us some shortcut;

Kerning (opt + < / >)
Font Size (command + shift + [ ])
Hide guideline (command + ,)

What to Note:

Formatting text size must be between 2-2,5 text size
Line length must be 55-65 characters
Highlight only using black / cyan / magenta / yellow

TASK 2 LECTURE can be found here.

INSTRUCTIONS
<back to top>

<iframe src="https://drive.google.com/file/d/1_JYfWVZTe7oDL_0AAImBCEdqsEdKjEXO/preview" width="640" height="480" allow="autoplay"></iframe>

Process:
1. Identify the appropriate typeface

2. Sketch your ideas out for each word

3. Digitalise the artwork in illustrator. (See examples)

4. Make a GIF from that

Instruction per week:

Week 1: We have to make some sketches about some of the words provided
Week 2: Digitizing our 4 type expressions
Week 3: Choose one of the type expression, then proceed to make the GIF version
Week 4: Modifying our GIF based on the feedbacks given
Week 5: Submission

Words (to be decided):

fig. 48, Exercise's Word List, Week 1 (27/08/2021)

My chosen words:

1. TERROR (mandatory)
2. ABYSS
3. SPACE
4. COLOSSAL

EXERCISES

<back to top>

E X E R C I S E 1

1. Sketches

In the first section, we were provided 8 words to be chosen. The words are; terror, space, glitch, water, broken, abyss, bark, and colossal. We have to choose a minimum of four words, using the word "terror" as a mandatory word. We have to create some typography designs that express the words' meaning using one of ten typefaces provided. Before proceeding to the next section, which is digitalizing our designs, we have to create some sketches. So here are my sketches;

fig. 49, my sketches, Week 1 (27/08/2021)

The four words that I choose are terror, abyss, space, colossal. My first and third design of abyss are describing abyss as a chasm, while the second design is more to an 'abyss' in devilish form. For the word terror, I want to make something that describe something frightening for us, humans. The space in my sketches are more like a blank space in definition, not an outer space, so I choose something wit a lot of white space. For the word 'colossal', I want to make something huge, so I kind of make them look gigantic.

For me personally, I think sketch number 1 or 3 of the word 'abyss' can be digitalized. For the word 'terror,' 'space,' and 'colossal' I think sketches 1 would be good.

So, I'm trying to draw the third design of the terror and second design of colossal on a bigger paper so they can be seen clearer. Here they are;

fig. 50, terror third design, Week 1 (27/08/2021)

fig. 51, colossal second design, Week 1 (27/08/2021)

2. Digitization

The first word that I decide to make is the word "colossal". Based on Oxford Dictionary, the word "colossal" means extremely large. It's an adjective which synonyms are huge, enormous, mega, massive, gigantic. From this definition and synonyms, I want to make something that resemble "a big thing," so after creating these 3 sketches, I made some adjustment to it.

fig. 52, colossal sketches, Week 1 (27/08/2021)

When I went to the breakout room, my colleague said that my first sketch looks like a human's face, and actually I designed my second design to look like a man's face, even though it seems not visible at first glance, I guess. From those two sketches, the first idea that popped in my mind was to make them look more recognisable as a "giant/titan," and so here're my digital design;

fig. 53 colossal digital version, Week 1 (27/08/2021)

I choose the bottom left design as my last version of colossal because I want it to look like a titan with sharp and beardy jaw. I use the Futura std Book Obligue typeface because it's a sans serif type, and I want it to look simple without the half serif end.

For the word "space," I want to make a void looking outer space, and this is my original sketch;

fig. 54 empty space sketch, Week 1 (27/08/2021)

And here are my digital version;

fig. 55, space digital version, Week 2 (03/09/2021)

At first I actually want to go with my first idea, but I think it's way to simple and doesn't really describe the specific personality, so I came up with the second version, which I made The words floating as if they're in outer space, and I make them small to describe that space is a huge void, and we're all just a tiny pieces in space. After a second thought, I decided to invert my space so it looks more like an outer space. I use the typeface Gill Sans Std Light, to gain a thin visual to the word, as if the subjects are small.

fig. 56, inverted space, Week 2 (03/09/2021)

After that, I started to make my "abyss" word, I want to make it more like a deep chasm. So, this is the sketch that I choose;

fig. 57, abyss sketch, Week 1 (27/08/2021)

I was advised to make the alphabet 'y' have longer descender. So, I made it in my digitising process using Serifa std Light, to make it looked thin and withered (as if there're no lives), and so here are the results;

fig. 58, abyss digital version, Week 2 (03/09/2021)

As I surfed the interned about the word "terror," I found out that its synonyms are dread, horror, alarm, fright, and panic. For my last word, terror, I used sketch one which I want to create something that looked like "extreme fear" in its psychological terms. So, I used a compilation of lots of negative words to form the terror, and here's how it turned out;

fig. 59, terror digitised, Week 2 (03/09/2021)

I used the Univers lt std Extra Black Oblique for the word 'terror' I made, to get the big shape of the typeface so it looked as if it's a huge scary thing. It also has an italic, so I want to use it to make an endless alarm. For the typeface I used to fill the words, I used Futura std Bold Condensed Obligue. I used this typeface because it's a san serif. I also added a blood drip to make it visually more terrifying.

fig. 60, terror with blood drip, Week 2 (03/09/2021)

And so, here is my work compilation;

fig. 61, digitised version, Week 2 (03/09/2021)

After I were given some feedbacks for my typography, I were asked to make my terror black and white. Then, I should adjust my colossal a bit. So, here're my revision and final:

fig. 63, digitised version (revised), Week 3 (10/09/2021)

fig. 64, digitised version (revised), Week 3 (10/09/2021)

For the GIF, I decide to animate my space, because I got the idea to make it like flying objects in space. So, here are my process;

First, I create my artboards in Illustrator. Basically, artboard is like a "frame" in animation, so here are my artboards;

fig. 65, AI Artboards, Week 4 (17/09/2021)

After I made my artboards. I export them into JPEG so I can insert it on Photoshop as frame. I animate the typography using Photoshop. The steps explained by Mr. Vinod are by importing our JPEG, then put it on the frames, and export is as GIF. So, here it is;

fig. 66, PS Animating, Week 4 (17/09/2021)

This is how my GIF looks like;

fig. 67, GIF, Week 4 (17/09/2021)

Mr. Vinod gave me a feedback for my GIF. He said to make my GIF stop in the center not left bottom, so I did some change, and here is the final look:

fig. 68, GIF (final), Week 4 (17/09/2021)

E X E R C I S E 2

For exercise 2 we have to create 2 types of design, Kerning exercise, and layout exercise.

1. Kerning and Tracking

fig. 69, Without Kerning and Tracking, Week 5 (24/09/2021)

fig. 70, With Kerning and Tracking, Week 5 (24/09/2021)

fig. 71, With and Without Kerning and Tracking Comparison, Week 5 (24/09/2021)

2. Layout

After I did some mix and match to the text, I made 4 layouts:

fig. 72, Layout 1, Week 5 (24/09/2021)

fig. 73, Layout 2, Week 5 (24/09/2021)

fig. 74, Layout 3, Week 5 (24/09/2021)

fig. 75, Layout 4, Week 5 (24/09/2021)

fig. 76, Layout 5, Week 5 (24/09/2021)

fig. 77, Preview I, Week 5 (24/09/2021)

fig. 78, Preview II, Week 5 (24/09/2021)

Fonts: Gill Sans Std (Regular, Extra Bold, Italic, Light Italic)

Point size: 20 pt (heading), 12 pt (sub-heading), 10 pt (body text), 8 pt (captions)

Leading: 12 pt (body text), 24 pt (heading)

Line length: 55 (layout 4 and 5), 40 (layout 1, 2 and 3)

Alignment: Left align (Body), Right alignment (Heading, Sub-heading, and Caption)

fig. 79, final PDF, Week 5 (24/09/2021)

FEEDBACKS

<back to top>

WEEK 1

General Feedback :

E-Portfolio:

The blog should be arranged in appropriate format (e.g., name and ID on title, programs on description, sections, embed.)
The blog shouldn't be personalized with different colors, fonts, etc., before mid-semester (except if we really understand what we're doing).

Specific Feedback :

E-Portfolio:

The blog should be updated with embed, add (Hons) in programme, add sections.

WEEK 2

General Feedback :

Typography Sketches:

The format must be neat square.
Don't add to much distortion and illustration.

E-Portfolio Feedback:

E-Portfolio should be updated continuously.
E-Portfolio post background shouldn't use pure white colour.

Specific Feedback :

Typography Sketches:

The 'y' part of the first sketch of abyss should be longer.
The word TERROR in the first design should be added more.
The 'c' in the word Colossal should be bolder.

E-Portfolio Feedback:

Update the E-Portfolio with Further Reading.

WEEK 3

General Feedback:

Typography digitised sketch:

The artwork has to sit in the frame (within the frame)
4 artwork sitting together
Export using artboard

Specific Feedback:

Typography digitised sketch:

No colour for terror
Space and abyss can go, for the colossal need a bit modification (e.g., hierarchy or bigger specific word)

WEEK 4

General Feedback:

Typography GIF:

The animation should express the meaning well, without to much illustration
More frames added = smoother
Must only use 10 typefaces provided

Specific Feedback:

Typography GIF:

The word space can be better if not flying towards the end of left corner, better if fly until middle of the frame

WEEK 5

General Feedback :

Typography Feedback:

Final work must be clear and put in PDF

E-portfolio Feedback:

Follow the blog example that has been provided.

Specific Feedback :

Typography Feedback:

Final work not indicated for T1, Ex2. Final Exproted JPG and PDF missing

E-portfolio Feedback:

Horizontal Rule for the different section in the post (lecture, instruction...) missing

REFLECTION
<back to top>

EXPERIENCE

I thought doing typography's exercise was a very fun thing to do, but I changed my mind, because I don't have much experience on doing typography, and there're a lot of stuff to know, such as the typefaces' shapes, personalities, etc. I learnt a lot in this module, mostly from the lecture's videos.

OBSERVATION

Lots of typography have different kind of typefaces. Typography designs can also be combined with elements. As time goes, lots of unique and unpredictable ideas and inspirations appeared from my classmates. Maybe because I didn't research a lot, my design isn't to deep and describe the word's meaning.

FINDINGS

I found out that some typographies have some simple illustration to make their meaning more delivered. I also found out that serif typefaces mostly used for formal occasion, while sans serif can be used more casual. I found out that the less element we gave to the typography, the harder it became, but because of that, it can be considered as a great typography design. I also found out that typefamilies has lots of types, not only bold and italic. I found out that there are a lot of things to do with typography, not only just words and letters.

FURTHER READING

<back to top>

Early Evolution of Roman Letters 1

(https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1)

Roman Capital Letters

Elegant, commanding attention and respect
Suitable for graphic communication intended to last for millennia
Not appropriate for everyday communication (e.g., business records, technical documentation, literature, social correspondence, shopping lists)
Frequently inscribed in monuments, large, formal, bestowing important words and dates cut into the stone.
Stonecutters started to change with scribes, specialists who wrote by hand all manner of documents on papyrus or other, less durable writing surfaces, to produce ephemeral graphic communication.
Over times, the letters gain some changes, and become 3 classification, which replace formal capitals in everyday graphic communication;

Square Capitals

fig. 80, Square Capital, source (https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1), Week 1 (02/09/2021)

An attempts to approximate inscriptional letters.
To produce the most formal books and documents.
Embody gravitas: the precision and regularity of their form shows that they were drawn slowly and carefully.
Written more quickly, with a more flowing hand, than was in stone.

Rustic Capitals

fig. 81, Rustic Capital, source (https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1), Week 1 (02/09/2021)

"Simple Capital"
Narrower, to reduce the cost of producing less important books and documents
Save space, save time

Roman Cursive

fig. 82, Roman Cursive, source (https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1), Week 1 (02/09/2021)

“running” (Latin)
Enabled the writer to keep the pen running along the writing surface
Casual, ideal for recording business transactions, bookkeeping, correspondence and similar uses
The ascenders and descenders create a major differentiator from capital letterforms

WEB REFERENCE:

Early Evolution of Roman Letters 1. (n.d.). "Early Evolution of Roman Letters 1", accessed on September 2, 2021 (20.04, UTC+7), https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1

First Alphabets

(https://www.fonts.com/content/learning/fontology/level-1/type-history/first-alphabets)

fig. 83, Design Progression of Letterforms, source; (https://www.fonts.com/content/learning/fontology/level-1/type-history/first-alphabets), Week 1 (02/09/2021)

1. Symbol Alphabets

Graphic image > present something tangible
Normally very simple shapes that spoke to a rather simple vocabulary (e.g, man, woman, fire, food, tree, etc.), over time need more symbols, so they multiply it. (e.g., multiple “tree” symbols were combined to make a “forest,” and the separate symbols for man, woman, and child were consolidated into a single “family” symbol)
Life become complex (increased agriculture, politic, religion system) -> new writing system.

2. Phonograms

The first to break with the simple symbol writing tradition
First, they used “sound pictures” to represent words and syllables with the same or similar sound, then, over thousands years, they began to use “phonograms” (sound pictures) to only represent syllables.
Phonograms = strung together to create a word.
As time moved, hieroglyphics evolved into hieratic
Then Demotic script, which was widely used for academic, business and religious documents

fig. 84, Hieroglyphic to Demotic evolution, source; (https://www.egy-king.com/2021/07/demotic-script.html), Week 1 (02/09/2021)

3. Phonetic Writing

The first phonetic alphabet
Easy to read, quick to write
Purely alphabetic – one character equal one sound

4. Alphabet Emerges

The Greeks added vowels, new characters, and curves.
The Romans adopted and adjusted the Greek alphabet and developed their own style and characters based on the Greek foundation.

5. Roman Capitals

Formal letterforms that were carved into monuments and buildings, and used for important manuscripts
Have remained the classic standard of proportion and dignity for over 2,000 years

WEB REFERENCE:

First Alphabets. (n.d.). "First Alphabets", accessed on September 2, 2021 (22.14, UTC+7), https://www.fonts.com/content/learning/fontology/level-1/type-history/early-evolution-of-roman-letters-1

Search This Blog

Abigail Kartika Darmowinoto (0350525)

Typography / Task 1: Exercises

Comments

Post a Comment

Popular posts from this blog

Experiential Design / Task 1

How to Create Jump Link

Experiential Design / Task 2