TYPOGRAPHY / Task 1 - Exercises 1& 2

on

23/9/2024 - 25/10/2024 / Week 1 - Week 5

Aricia Man Yi Xuan / 0375026

Typography / Bachelor of Design (Hons) in Creative Media

Task 1 : Exercises 1 & 2

TABLE OF CONTENTS

    3.1 Research
    3.2 Sketches
    3.3 Digitization
    3.4 Final Outcome
    3.5 Animation
    4.1 Text Formatting
    4.2 Final Outcome

1. LECTURES

WEEK 1 (Lecture 1) :
Today (23/9/24) is our first class on typography with Mr. Vinod. Mr. Vinod introduced us to typography and showed us the PowerPoint slide presentations. Meanwhile, we take notes during the classes and watch the tutorial on creating an e-portfolio. Then, we were given a sketching exercise of creating our own typographic compositions, which we voted together in the class. 

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.

| Pre-recorded lectures [ Development / Timeline ] :

1.1 Phoenician → Roman

Fig.1.1.1 The Greeks wrote from right to left and left to right

Fig.1.1.2 A change in weight from vertical to horizontal, a broadening of the stroke at start and finish


Fig. 1.1.3 Development of typography


Fig. 1.1.4 Text type classifications

WEEK 2 (Lecture 2) :
Today (30/9/2024) Mr. Vinod gave us the feedback of our sketches one by one after we uploaded our sketches to Facebook. After that, we were given a new task to do, which is digitalize our sketches into a Type Expression Frame using Adobe Illustration that was assigned by the teacher in the Teams. Then, Mr. Vinod explained how to do it and showed us the demonstration and let us watch the tutorial after the class. At the end of the class, we wrote feedback from this week.

| Pre-recorded lectures [ Text ] :

1.2 Typo_3_Text_P1  [ Part 1 ] 
  • Kerning and Letterspacing
Fig.1.2.4 Kerning and Letterspacing
  • Formatting Text
Fig.1.2.9 Formatting Text
  • Texture
Fig.1.2.10 Anatomy of a typeface


Fig.1.2.11 Different typefaces and gray values
  • Leading and Line Length
Type size : Text type should be large enough to be read easily at arms length.

Leading : Text that is set too tightly encourages vertical eye movement; can easily loose a reader's place. Type that is set too loosely creates striped patterns that distract the reader from the materials at hand.

Line Length: Shorter lines require less leading; longer lines more. A good rule or thumb is to keep line length between 55-56 characters.

  • Type Specimen Book
Fig.1.2.12 Sample Type Specimen Sheet

A type specimen book is to provide an accurate reference for type, type size, type leading, type line length etc.

WEEK 3 (Lecture 3) :
This week (7/10/2024) , Mr. Vinod gave us the feedback of our final typeface. After that, we were assigned to watch the YouTube (Typo_4_Text_Part 2) that has been uploaded in Team and choose one word of our type expression and animated it. 

| Pre-recorded lectures [ Text ] :

1.3 Typo_4_Text_P2  [ Part 2 ] 
  • Indicating Paragraphs
    1. Pilcrow ( ¶ ): A holdover from medieval manuscripts seldom use today.
    2. Line space ( leading*) : Between the paragraphs. If the line space is 12 → paragraph space is 12pt. This ensure cross-alignment across columns of text.
Fig.1.3.1 Line space vs Leading

Fig.1.3.2 Standard Indentation
3. Standard Indentation: Indent is the same size of the spacing / the same as the point size of your text.

Fig.1.3.3 Extended Paragraphs
4. Extended Paragraphs: It creates unusually wide columns of text. Despite these problems, there can be strong compositional or functional reasons for choosing it.
  • Widows and Orphans
1. Widow: A short line of type left alone at the end of a column of text.
2. Orphan: A short line of type left alone at the start of new column.

Fig.1.3.4 Widows and Orphans
  • Highlighting Text
Fig.1.3.5 Example of highlight text within a column of text

Fig.1.3.6 Sans Serif font (Univers)
Examples: The Sans Serif font (Univers) has been reduced by .5 to match the x-height of the serif typeface. 8 ≠ 7.5.
Fig.1.3.7 Example of Highlighting text

Examples: When highlighting text by placing a field of colour at the back of the text, maintaining the left reading axis of the text ensures readability is at its best.

Fig.1.3.8 Quotation Marks

Examples: It can create a clear indent, breaking the left reading axis.

  • Headline within Text
Fig.1.3.9 A Head
"A" Head : indicates a clear break between the topics within a section.
Fig.1.3.10 B Head

"B" Head : subordinate to A heads. It indicate a new supporting argument or example for the topic at hand. As much they should not interrupt the text as strongly as A heads do.

Fig.1.3.11 C Head
"C" Head: although not common, highlights specific facets of material within B head text. They not materially interrupt the flow of reading. C heads in this configuration are followed by at least an em space for visual separation.

Fig.1.3.12 Hierarchy in a sequence of subheads

  • Cross Alignment
Fig.1.3.13 Four lines of caption type cross-align with three lines of text type

Cross Aligning: Headlines and captions with text type reinforces the architectural sense of the page -- the structure -- while articulating the complimentary vertical rhythms.

WEEK 4 (Lecture 4):
Today (14/10/2024) , Mr. Vinod gave us feedback on our animated type expression. Then, we were given 30 minutes to do some changes to our type expressions if they were needed, and let us watch the text formatting video tutorials in class that have been uploaded in Team. Later, Mr. Vinod demonstrated how to do our new task, which is text formatting, and we were assigned a task to do.

| Pre-recorded lectures [ Basic ] :

1.4 Typo_2_Basic  [ Link ] 
  • Describing Letterforms
Fig.1.4.1 Notes of Describing letterforms - pdf
  • The Font
- Uppercase / Lowercase
- Small Capitals : Found in serif fonts as part of what is often called expert set.

- Uppercase Numerals : Also called lining figures, same height as uppercase letters and are all set to the same kerning width.

Fig.1.4.2 Uppercase Numerals

- Lowercase Numerals : Also known as old style figures or text figures, set to x-height with ascenders and descenders.

Fig.1.4.3 Lowercase Numerals

- Italic 
Fig.1.4.4 Italic

- Punctuation, miscellaneous characters

Fig.1.4.5 Punctuation, miscellaneous characters

- Ornaments : Used as flourishes in invitations or certificates.

Fig.1.4.6 Ornaments
  • Describing Typefaces
- Roman : The uppercase forms are derived from inscriptions of Roman monuments. A slightly lighter stroke in roman is known as 'Book'.

- Italic : Named for fifteenth century Italian handwriting on which the forms are based. Oblique conversely are based on roman form of typeface.

- Boldface : Characterized by a thicker stroke than a roman form. Depending upon the relative stoke widths within the typeface, it can also be called 'semi bold', 'medium', 'black', 'extra bold', or super. In some typefaces (notably Bodoni), the boldest rendition of the typeface is referred to as 'Poster'.

- Light : A lighter stroke than the roman form. Even lighter stroke are called 'Thin'.

- Condense : A version of the roman form, and extremely condense styles are often called 'compressed'.

- Extended : An extended variation of a roman font.

Fig.1.4.7 Describing Typefaces

  • Comparing Typefaces
Fig.1.4.8 Comparing typefaces

Beyond the gross differences in x-height, the forms display a wealth of variety, in line weight, relative stroke widths and in feeling. For any typographer these feelings connote specific use and expression.


WEEK 5 (Lecture 5)：
Today (21/10/2024) , Mr. Vinod gave us feedback on our text formatting and brought out the strengths and areas for improvement. Then, we were assigned a new post for Task 2 - Text Formatting and watched the tutorial video. (https://youtu.be/rPwYO3ff4e0). 

| Pre-recorded lectures [ Letters ] :

1.5 Typo_5_Understanding [ Link ]
  • Understanding Letterforms
Fig.1.5.1 Baskerville 'A'

The uppercase letter forms suggest symmetry, but it is not symmetrical. Each bracket connecting the serif to the stem has a unique arc.

Fig.1.5.2 Univers 'A'

The uppercase letter forms appear symmetrical, but a close examination shows that the width of the left slope is thinner than the right stroke. Demonstrate the meticulous care a type designer takes to create letterforms the are both internally harmonious and individually expressive.

Fig.1.5.3 Helvetica and Univers 'a'

The complexity of each individual letterform is neatly demonstrated by examining the lowercase 'a' of two seemingly similar sans-serif typefaces —— Helvetiva and Univers. A comparison of how the stems of letterforms finish and how the bowls meet the stems quickly reveals the palpable difference in character between the two.

  • Maintaining x-height
Fig.1.5.4 Median
X-height: the size of the lowercase letterforms
Curves strokes 's', must rise above the median (or sink below the baseline) in order to appear to be the same size as the vertical and horizontal strokes they adjoin.

  • Form / Counterform
Fig.1.5.5 Form / Counterform

Counterform: the space describes, and often contained, by the strokes of the form. When letters are joined to form words, the counterform includes the spaces between them.

  • Contrast
Fig.1.5.6 Contrast

Contrast: the most powerful dynamic in design


2. INSTRUCTIONS





3. PROCESS

Task 1 : Exercises 1- Type Expression

We were given a set of 10 typefaces and we need to compose the chosen 6 words (Pull, Explode, Chop, Rush, Wind, Tangle) and express its meanings.

| 3.1 Research |

Before I start my sketches, I have done some research from the Internet and Pinterest.

Fig. 3.1.1 References of the chosen 6 words / (Week 1, 25/9/2024)

| 3.2 Sketches |

These are my sketches of the ideas I came up with after doing the research.

Fig. 3.2.1 Sketch of "PULL" (Week 1, 25/9/2024)

When I see the word "pull," the picture that comes to my mind is pulling action —— like pulling a rope or grabbing something hard. The design should have a sense of motion, force and drape. The design I like the most is the first (upper left), it includes a rope that is pulling up some heavy metals, and it suits the meaning of the word "pull". 

Fig. 3.2.2 Sketch of "EXPLODE" (Week 1, 25/9/2024)

The word "explode" is literally something breaking apart with force, a bomb, scattering fragments, and chaos. To represent this explosive energy, I think the word should be blasted out and lose its shape, and maybe the alphabet "o" can be drawn as a bomb. The fourth sketch (lower right) is like a blown-out shape, in which the letters were cracks that were caused by explosion.

Fig. 3.2.3 Sketch of "CHOP" (Week 1, 25/9/2024)

These are some ideas to represent the word "chop." I think about a knife, which is sharp and quick action, like slicing something into half. As a result, my design uses a font with divided or split letters. The first design of the letter “P” is being chopped into pieces, so it doesn't look like a letter at all. In the second and fourth designs, I drew the "P" to a knife.

Fig. 3.2.4 Sketch of "RUSH" (Week 1, 26/9/2024)

The word "rush" is a rapid of movement and speed; someone is in a hurry. I drew the "R" and "h" in the first design to look like they were running in a hurry, and it's also my favorite. I drew the second design as a blur and added some streaks on the text to describe the sense of fast movement.

Fig. 3.2.5 Sketch of "WIND" (Week 1, 26/9/2024)

These are some ideas of the word "wind." I use lines to express the fluidity of wind. Moreover, I added slanted elements in the letters to express the sense of being blown.

Fig. 3.2.6 Sketch of "TANGLE" (Week 1, 26/9/2024)

"Tangle" is a complex and chaotic pattern; it evokes images of twists, entangles and hair knotted. I designed them to be twisted and connected forms, with irregular fonts and line elements.

Week 2 (After giving feedback):
Mr. Vinod gave us feedback in the class (30/9/2024), and I realized I've got a lot to improve. Then, I made adjustments and changed some details that I hadn't done well; I added the description in each sketch; #2.2 Redraw the effect to be more simple using "i,m", #3.4 "HOP" changed to a normal letter as Mr. Vinod said the original seems to be a lot of distortion; #5.2 I've changed the direction of the wind; #6.1 removed the lines inside the letters.

After Adjustment:

Fig.3.2.7 Sketches after adjustment ( Week 2, 30/9/2024)

My personal favourites of each word are "Pull #4," "Explode #4," "Chop #3," "Rush #3," "Wind #4,"Tangle #2 & #4". I think these designs are stronger and more effective expressions, and they also match the meaning of the word. After the feedback session, my final decisions are "Pull #1," "Explode #4," "Chop #3," "Rush #3," "Wind #4," "Tangle #4".

| 3.3 Digitisation |

It was quite challenging to get started with the digitisation in the beginning because I'm not familiar and proficient using Adobe Illustrator to do the work. So I've watched some tutorials and been practicing; it became much easier for me to do it.

#1 PULL

Fig.3.3.1 Digitalising of "Pull" / (Week 2, 3/10/2024)

The first sketches I choose are "Pull #1 and #2", and I suddenly came up with a new idea, which is the middle one. All of them were done with the typeface Futura Std Bold Condensed. For the #1 in Fig.3.3.1, I digitised it followed by my sketch, I used the pen tool, Curvature and Ellipse Tool to draw out the string; for the #2, I make the "l" wide, which presents a look of being pulled, and also added a gradient to it; for #3, I combined the "U and L" together. I like #1 the most, as it is more strong to express the meaning of the word "pull".

#2 EXPLODE

Fig.3.3.2 Digitalising of  "Explode" / (Week 2, 3/10/2024)

The typeface I used for "explode" is Futura Std. For the #1 and #2, I used the object (envelope distort) and let the letter make with warp (style: arc). #1: I make the "O" to be a bomb, used Ellipse and the pen tool to draw it, and I used the line segment tool to draw the lines inside the letter. I was going to make it look like it exploded, but it seems doesn't look like that. For #3 design, its a new idea, and I've changed the text design into "mixed", which is below Fig.3.3.3. Mixed.

Fig.3.3.3 Mixed

#3 RUSH

Fig.3.3.4 Digitalising of "rush" / (Week 2, 3/10/2024)

For the word Rush, I used my sketches #3 (Fig.3.2.7) with the typeface Bembo Std for the diigitisation process. I made two designs with a slightly different font of the letter "R"; #1 is the normal font, and #2 I created it into "legs" that were rushing using Direct Selection Tool. Besides, I elongated both of them and combined the letter "S and H". The top of the letter "R" has a shadow on it (opacity 50%), pretending like an afterimage when rushing. I think #2 is more likely to express the meaning of the word.

#4 CHOP

Fig.3.3.5 Digitalising of "chop" / (Week 2, 3/10/2024)

The typeface I used is Serifa Std 45 Light. I was trying to separate the letter into half to express the meaning of chop; I used the Scissors Tool to cut it. It succeeded at the letter "H" but failed at the letter "O", I can't separate "O", and I was still trying to figure out how to do it. Thus, I used different way to separate it, in which I used the Pen Tool to draw a white line in the middle of the "O", it also worked to separate it, and I also added a line in the letter "P".

#5 WIND

Fig.3.3.6 Digitalising of "wind" / (Week 2, 3/10/2024)

The typeface is Futura Std Condensed Light, #1, I elongated the letter and made it warp (style: flag) to express the feeling of being blown. #3, I used letter in all "l" and adjusted the length of each (#2 → #3). #4, I used the pen tool to draw out the word, it actually took a long time for me to adjust the curvature and the letterspacing. 

#6 TANGLE

Fig.3.3.7 Digitalising of "tangle" / (Week 2, 3/10/2024)

The typeface is Futura Std Book; the above are the processes of the word tangle. In #1, I increased the thickness of the stroke (10 pt). In #2, I moved the composition of the word up and down. In #3, I used the Direct Selection Tool to adjust the path of each letter. Lastly, in #4, I added some lines using the Paintbrush Tool (Option: Fill in brush strokes).

FIRST ATTEMPT

Fig.3.3.8 First attempt of digitised type expressions / (Week 2, 3/10/2024)

[ Pull #1, Rush #2, Chop #3, Explode #4]

Fig.3.3.9 First attempt of digitised type expressions / (Week 2, 3/10/2024)

[ Pull #1, Explode #2, Tangle #3 ]

[ Wind #4, Rush #5, Chop #6 ]



| 3.4 Final Outcome / Exercise 1: Type Expressions |

Fig.3.4.1 First attempt of Digitised Type expressions - JPEG (Week 3, 7/10/2024)

[ Pull #1, Rush #2, Chop #3, Explode #4]

After receiving feedback (Week 3, 7/10/2024) from Mr. Vinod, I came out with my final outcome below (Fig.3.4.1), in which I made some changes in every word. For the word "pull", I made the string that is pulling up the "L" to be more straight. For the "Rush", I removed the illustrator and emphasized the "R" that represents rushing and added a circle to present the people's head.. Also, for the word "chop", I removed the line in the "P" and just separated the letter "H". Lastly, for the word "explode", I removed the cracks so it doesn't look too messy.


Fig.3.4.2 Final Type Expression - PDF ( Week 3, 7/10/2024)


| 3.5 Animation |

Fig.3.5.1 Type animation demo / (Week 3, 8/10/2024)

Mr. Vinod has uploaded an example of basic type animation using Adobe Illustrator and Adobe Photoshop.

Fig.3.5.1 First Attempt at animating "Pull" / (Week 3, 8/10/2024)
I chose the word "Pull" to be animated, as I think this word is more strongly to express its meaning.
Fig.3.5.2 Final Animation Timeline (25 frames) / (Week 3, 8/10/2024)

I used 25 frames for my animation as I wanted it to be more detailed and dynamic.



| 3.6 Final Animated Type Expression |

Fig.3.6.1 Final Animated Type Expression "Pull" - gif / (Week 4, 14/10/2024)

TAP ME BACK TO TOP


4. PROCESS

Task 2 : Exercise 2 - Text Formatting

For this exercise, we are going to use Adobe InDesign to create a layout of text formatting. Before starting, there are tutorial videos provided for us to understand how to get started with this exercise and have a basic kerning and tracking knowledge.

  • Lecture 1/4 (Kerning and Tracking) :
Fig.4.1.1 Text formatting without kerning / (Week 4, 16/10/2024)

Fig.4.1.2 Text formatting with kerning / (Week 4, 16/10/2024)


Notes:
  • Font size: 8-12
  • Line length: 55-65 / 50-60 characters
  • Text Leading: 2, 2.5, 3 points larger than font size
  • Paragraph spacing: follow the leading
  • Ragging: left alignment / left justification
  • Cross alignment
  • No Widows / Orphans
Fig.4.1.1 Layout progress / (Week 4, 16/10/2024)
This is my progress on this exercise 2, and I came up with 6 different layouts. I followed the tutorial videos step by step during the progress and created my own design with it. Everything went well in the beginning, but while editing the paragraph in Adobe InDesign, I encountered an issue where I set the font size to 12pt and the leading to 14pt, but when I clicked "Align to Baseline Grid," the line spacing automatically increased, disrupting the desired layout. 

Fig.4.1.2 Mistakes with baseline grid / (Week 4, 16/10/2024)
Fortunately, I've resolved this issue by rewatching the tutorials and searching online, and I followed the steps that were provided, which are to adjust the baseline grid settings (I went to Edit > Preferences > Grids > adjust Increment Every to 14pt). Finally, I'm able to fix the issue.

Fig.4.1.3 Layout #1 (Week 4, 16/10/2024)

Fig.4.1.4 Layout #2 (Week 4, 16/10/2024)

Fig.4.1.5 Layout #3 (Week 4, 16/10/2024)

Fig.4.1.6 Layout #4 (Week 4, 16/10/2024)

Head Line
Typeface: Janson Text LT Std (#1,#3, #4), Gill Sans Std (#2)
Font/s: 75 Bold (#1,#3, #4), Bold Extra Condensed (#2)
Type Size: 26pt (#3, #4), 36pt (#1), 39pt (#3), 40pt (#4), 58pt (#1), 105pt (#2)
Leading: 30pt (#4), 42pt (#3), 60pt (#1), 108pt (#2)
Paragraph Spacing: 0

Body
Typeface: Janson Text LT Std, Univers Lt Std (#4 author)
Font/s: 55 Roman, 55 Italic (author), 55 Oblique (#4 author)
Type Size/s: 11pt (#1, #2, #3), 12pt (#4)
Leading: 14pt
Paragraph Spacing: 4mm (#3, #4), 3mm (#1, #2)
Characters per-line: 50
Alignment: left justified, left alignment
Margins: 12.7mm top + left + bottom + right
Columns: 4
Gutter: 7mm

Final Task 1 : Exercise 2 / Text Formatting


Fig.4.1.7 Final Task 1: Exercise - Text Formatting - jpeg / (Week 5, 21/10/2024)

Fig.4.1.8 Final Task 1: Exercise - Text Formatting (with grid) - jpeg / (Week 5, 21/10/2024)

Fig.4.1.9 Final Task 1: Exercise - Text Formatting - pdf / (Week 5, 21/10/2024)

Fig.4.1.10 Final Task 1: Exercise - Text Formatting (with grid) - pdf / (Week 5, 21/10/2024)

Head Line
Typeface: Gill Sans Std 
Font/s: Bold Extra Condensed 
Type Size: 105pt 
Leading: 108pt 
Paragraph Spacing: 0

Body
Typeface: Janson Text LT Std
Font/s: 55 Roman
Type Size/s: 11pt 
Leading: 14pt
Paragraph Spacing: 3mm 
Characters per-line: 50
Alignment: left justified
Margins: 12.7mm top + left + bottom + right
Columns: 4
Gutter: 7mm

TAP ME BACK TO TOP

4. FEEDBACK


Week 1: 
General feedback :
Introduction to design class, rules and modules. We were given the task of making an e-portfolio and typography sketches. YouTube video link is provided as directions for doing the task.

Week 2: 
General feedback : 
I'm a bit nervous when Mr. Vinod was giving the comment to us, but it was surprisingly better than I expected. I also referenced others's sketches; it was amazing everyone is full of creativity. Overall, I will put more effort into completing and try my best to improve my skills and performances.

Specific feedback :
It was interesting; there's a lot of graphics, and I like the effort put into the sketches. Instead of using the line like drawing, you could use different platforms to create it. The graphic can use "i, l, m". The sketch "tangle" seems to be a lot of distortion, and I don't know where's the referencing of the typefaces. The "chop" is fine. Try not to overcook your idea, which is unneeded in the expression; avoid to do that.

Week 3: 
General feedback : 
I've got feedback from Mr. Vinod and do some changes to my typefaces, Mr. Vinod demonstrated hot to make it better on my computer, and I do learn a lot.

Specific feedback :
The pull is too illustrated, it doesn't work; the rush I don't think it works as well. There's no need for an extra line in the "p" of chop. Explode is fine, I think you don't have to do it with bulge, just do it normal, if you do have cracks, just do a certain parts, instead of adding all of it.

Week 4: 
General feedback :
Unexpectedly, my final work overall is good, and I was very happy with it; just one word still needs to adjust.

Specific feedback :
Good job for the work, the animation is good, very decent, except for the Rush.

Week 5: 
General feedback :
Mr. Vinod didn't gave my work comment, so I listen to Mr. Vinod's comments on other's work. Overall, everyone did well with the cross alignment and font size. We're also given a new task to do.

Specific feedback :
Need to focus on what we have taught, especially widows and orphans, and the word spacing is too wide; change it to left alignment if you can't adjust.

5. REFLECTION

Experience:
These few weeks, I've learned a lot of knowledge about typography. When I first started using Adobe Illustrator, I almost had zero experience with the software; everything felt new and unfamiliar. Initially, it was quite challenging for me to understand how the tools work, like the layers, pen tools, paths, and so on, but through consistent practice, I began to pick up essential skills and get more familiar with them. During my type expression, I keep adjusting and adjusting as Mr. Vinod said my word used too much Illustrator, but in the end I came up with a satisfied outcome, which makes me really happy. Moreover, it's my first time to create a GIF of a word; it's really interesting. For the text formatting part, I took a lot of time to think about the layout and also came out with too many layouts, which makes it hard for me to make the final decision, but Mr. Vinod is really nice; he brought out my problem, and I finally came up with the outcome. Overall, I've gained a lot of confidence in using Illustrator, and I genuinely hope to learn more from Mr. Vinod.

Observation:
Throughout these exercises, I observed that type expression relies heavily on subtle design elements like spacing and size. Even a smaller adjustment can drastically change the emotion of a word. Furthermore, when creating the GIF, I realized that we can't just simply draw the position; we need to carefully observe the dynamics of the bounce when the word is pulled, and the timing and distance of the movement are important as well to achieving the desired effect.

Findings:
I discovered that typography is not just about choosing the right font but about shaping the overall visual message and meaning. The process of text formatting taught me how crucial alignment, spacing, and size are. 



6. FURTHER READING

WEEK 1 (24/9/2024)

Fig.6.1.1 Blogging For Dummies (6th edition) 
Written by : Amy Lupold Bair
Blogging For Dummies

Chapter 1 -  Discovering Blog Basics / page 6-28
I found out this book on the Taylors portal website, which provided a valuable insight for starting my own blog. In the first chapter of this book, the author introduces the concept of blogging and its significance of today's digital landscape. It seems writing a blog is just like writing a diary, and I've had this habit since I was a child. I found out interesting that blogging can make money too. For instance, Google AdSense displays in-page advertising relevant to our content, allowing us to earn money each time a visitor clicks on them.

[Tips to start a blog]
1. Choose a subject that interests you
2. Decide whether any topics are off limits
3. Think about your potential readers

[How to create a successful blog?]
1. Setting goals
2. Writing well
3. Posting frequently
4. Interacting with comments
It's such a useful platform to make connections with others and find ways to get involved with my hobby more deeply.

WEEK 2 (30/9/2024)

Fig.6.1.2 The New Typography in Scandinavia: Modernist Design and Print Culture (2021)
Written by: Trond Klevgaard
Link
Chapter 1: Origins and Networks / page 14-16

This chapter traces how New Typography, which originated in Central and Eastern Europe, to Scandivania, influencing local print and design culture. 

Fig.6.1.3 Poem 'Lettre-Ocean'
There is a poem in this chapter "Lettre-Ocean", which demonstrates a strong Futurist influence, using telegraphic imagery to connect to the theme of wireless communication. The visual layout of the poem breaks from traditional formats, encouraging readers to engage with all elements at once rather than in a linear fashion.

WEEK 3 (7/10/2024)

Fig.6.1.4 Typography Essentials Revised and Updated: 100 Design Principles for Working with Type (2019)
Written by: Ina Saltx
Link

I found this e-book based on the Taylor's Library, and I did some further reading with the book.

" One of the principles of durable typography is always legibility; another is something more than legibility: some earned or unearned interest that gives its living energy to the page. It takes various forms and goes by various names, including serenity, liveliness, laughter, grace and joy." —— Robert Bringhurst, The Elements of Typography Style

Chapter 1 : Using Letter as form / page 8-9 
- Each Letter is a Shape Unto Itself
Letters are more than just alphabetic symbols —— they can be treated as powerful visual elements. It can be expressive when used alone, as a simple silhouette, as an outline, or as a container for image, texture, or pattern. The beauty and power of the individual form may also be used partially: or a shape that is sliced and dices, cropped, or reversed horizontally or vertically. Here are some examples of using letter as a form.
Fig.6.1.5 Example Custom-lettered logo
This custom-lettered logo forms a discrete shape, but within its boundaries, each letter is delicate and leaf-like.

Fig.6.1.6 Example of letters
The letters comprising the logo can accommodate images, textures, and colour to reflect different aspects of the organization's identify and a variety of events. 

Fig.6.1.7 Example of letterforms

I've learned that how useful and effectively a letter can be used as a form and how it can become a powerful design element, it gives me a lot of inspiration.
 

WEEK 4 (14/10/2024)

Fig.6.1.8 The Graphic Design Reference & Specification Book: Everything Graphic Designers Need to Know Every Day (2013)
Written by: Poppy Evans, Aaris Sherin, Irina Lee
Link

This week, I've read this e-book based on the Taylor's Library. It's all about graphic design, and I'm coincidentally interested in graphic design, so I chose it to be my further reading.

Chapter 1 : Measurement Conversion Charts / page 8-9
This chapter basically focuses on essential measurements used in graphic design. It provides conversion charts for various units such as millimeters, points, picas to inches, inch decimals to inch fractions, conversion formulas, and metric to imperial equivalents. It seems like conversions are crucial for a graphic's layout and print production.

Chapter 2 : Copyright and Trademark Standards / page 10-13
This chapter talks about the copyright and trademark laws relevant to graphic designers. Copyright is very important, it's not just for designers, it protects original works including photographs, musical compositions, books, movies, and so much more. This chapter outlines what is protected under copyright, such as images, logos, and symbols, and how trademark law applies to branding elements such as names and symbols. Overall, we need to respect others' original works and understand when and how we can use or reproduce content legally within our projects.

WEEK 5 (21/10/2024)

Fig.6.1.9 Typography, Referenced: A Comprehensive Visual Guide to the Language, History, and Practice of Typography (2012)
Written by: Jason Tselentis, Allan Haley, Richard Poulin, Tony Seddon, Gerry Leonidas, Ina Saltz, Kathryn Henderson, Tyler Alterman
Link

This week, I've read this e-book based on the Taylor's Library. This book is the single most comprehensive volume covering every aspect of typography.

Type Classification and Identificition / page 52-60

There are fifteen froups of type styles:

Fig.6.1.10 Type Styles

This chapter discusses key type classifications, including Serif, Sans Serif, Script, Display, and Monospaced.





Thank you for reading me :)









Comments

Post a Comment