Exercises

Typography / Exercises 

2.4.2021-30.4.2021 (Week 1 - Week 5)
Rachel Ung Xuan Ning (0341314)
Typography / Bachelor of Mass Communication 
Task 1 / Exercises




LECTURES 

Week 1 

Introduction & Briefing 

During our first zoom meeting, Mr Vinod and Mr Shamsul introduced us to the module and briefed on the tasks we are suppose to do. We were later given detailed instructions on how to start our e-portfolio on blogspot, and we were told on what to include in our e-portfolio. 

A more in-depth explanation and introduction to typography was provided in the recorded lecture. So, what is typography? Typography could be the act of creating letters/type faces/type families and can come in any forms, such as animations or GIFs. Typography is frequently used in website designs, app designs, signage designs, books, labels, etc. 

Terminology 

Fonts - refers to the individual font or weight within a type face 

Type faces - refers to the entire family of fonts/weights that share similar characteristics/styles

Figure 1.0 Type faces

Type families - refers to the various families that do not share characteristics 

Figure 1.1 Type families 

Week 2 

Development 

Early letterform development (Phoenician to Roman)
  • Phoenician (1000 B.C.E.) > Greek (900 B.C.E.) > Roman (100 B.C.E.)
  • Initially writing meant scratching into wet clay with sharpened stick or carving into stone
  • The Greeks developed a  writing style called "boustrophedon", which meant changing the direction of writing from "right to left" to "left to right"
  • Etruscan and the Romans paint their letterforms before carving onto marbles to avoid waste and mistakes, as marbles were expensive
  • The brush strokes from the painting of letterforms then became the the serifs we know of today, and which was later developed into Roman letterforms
Hand Script from the 3rd - 10th century C.E.

Square Capitals (4th to 5th Century)
  • The written version found in Roman monuments
  • Serifs that were added to the main strokes made it a distinct characteristic of this letterform
Rustic Capitals (Late 3rd Century to Mid 4th Century) 
  • Compressed version of square capitals, allowed twice as many words on a sheet of parchment 
  • Faster and easier to write but slightly harder to read 
Roman Cursive 
  • Lowercase letterforms; forms that were simplified for speed 
Uncials 
  • Incorporated some aspects of Roman cursive, especially for A, D, E, H, M, U, Q
  • Refer to as letters that are one inch high
Half-Uncial
  • Further formalisation of cursive hand 
  • Marks the beginning of lowercase letterforms 
Charlemagne 
  • Unifier of Europe since Romans 
Blackletter to Gutenberg's Type 
  • Blackletter (1450)- earliest printing type 
  • Oldstyle (1475)- lowercase forms used by Italian humanist scholars for book copying; uppercase letterforms found inscribed on Roman ruins 
  • Italic (1500)- Italian handwriting 
  • Script (1550)- originally used to replicate engraved calligraphic forms 
  • Transitional (1750)- refinement of old style forms; thick-thin relationships were exaggerated 
  • Modern (1775)- a further rationalisation of old style forms; serifs were unbracketed; extreme contrast between thick and thin strokes 
  • Square Serifs (1825)- originally heavily bracketed serif 
  • Sans Serif (1990)- 'without' serif; these typefaces eliminated all together 
  • Serif / Sans serif (1990)
During live lecture this week, we were ask to practice digitising one of our sketch on Adobe Illustrator, and the below is my first digital attempt
Figure 1.2 First digital attempt practice

Basic

Describing Letterforms
  • Baseline- imaginary line / visual base of the letterforms 
  • Median- imaginary line defining the x-height of letterforms 
  • x-height- the height in any typeface of the lowercase "x"
  • Stroke- any line that defines the basic letterform 
  • Ascender- strokes or stems from lowercases that exceeds the median line 
  • Arm- short strokes off the stem of the letterform 
  • Barb- the half-serif finish of some carved strokes 
  • Beak- the half-serif finish of some horizontal arms 
  • Bowl- rounded form that describes a counter, can either be opened or closed 
  • Bracket- transition between serif and stem, its at the bottom/base of letterforms at the baseline 
  • Crotch- interior space where two strokes meet, e.g. "K", "V"
  • Cross Bar- horizontal stroke that connects two stem, e.g. "A", "H"
  • Cross Stroke- horizontal stroke in a letterform that joins two stem, e.g. "f", "t"
  • Descender- portion of the stem of a lowercase that is below the baseline 
  • Ear- the stroke extending out the main stem/body of the letterform, e.g. "g", "p"
  • Em- gap between words, "space bar"; space between 2 words; width of the letter "M"
  • En- half the space of an em or letter "M", "-"
  • Ligature- character formed by combination of two or more letterforms 
  • Loop- Bowl created in descender of the lowercase "g"
  • Link- strokes that connect loop and bowl
  • Spine- curved stem of the "s"
  • Stem- the significant vertical or oblique stroke 
  • Stress- orientation of the letterform, indicated by the thin stroke in round forms 
  • Swash- the flourish that extends the strokes of the letterform
  • Tail- the curved diagonal stroke at the finish of certain letterforms, e.g. "Q"
  • Terminal- self-contained finish of a stroke without serif 
The Font

Full font typeface contains more than 26 letters, to numerals, and a few punctuation marks. "Full font" refers to type family, type family of different type faces. Especially when designing a book, we must choose a type family that has many different typefaces so that we have an option of different weights, for body texts, headline, sub headlines, subtexts, etc. 
  • uppercase- capital letters, including certain accented vowels 
  • lowercase- including the same characters as uppercase 
  • linotype/typesetting/matrices- used to compose sentences and words 
  • composing box- used to compose an entire paragraph 
  • small capitals-  uppercase letterforms drawn to the x-height of the typeface; primarily found in serif fonts, expert set
  • uppercase numerals- lining figures; same height as uppercase letters 
  • lowercase numerals- old style/text figures, set to x-height with ascended and descenders; less common in sans serif typefaces than in serifs
  • Italic- 15th century Italian cursive handwriting; small caps, mostly only Roman 
  • Italic vs. Roman 
  • Punctuation, miscellaneous characters- all fonts contain standard punctuation marks; miscellaneous characters can change typeface to typeface 
  • ornaments- used as flourished in invitations/certificates, usually provided as a font in a large typeface family; only a few transitional or classical typefaces contain ornamental fonts (e.g. Adobe Caslon Pro)
Describing Typefaces 
  • Roman- uppercase letterforms derived from inscriptions of Roman monuments; slightly lighter stroke in Roman is known as "Book"
  • Italic- refer back to 15th century Italian cursive handwriting 
  • Oblique- conversely based on Roman form of typefaces
  • Boldface- characterised by thicker strokes
  • Light- lighter stroke than roman form, even lighter strokes are known as "Thin"
  • Condense- a version of the roman form, extremely condensed form is "compressed"
  • Extended- extended version of roman fonts
Week 3

Text (Part 1)

  • Kerning- refers to the automatic adjustment of space between letters
  • Letter spacing- to add space between the letters 
  • Tracking- refers to the addition and removal of space in a word or sentence 
  • Counter form- black spaces between individual letters (uppercase letter forms are able to stand on their own whereas lowercase letter forms require the counter form created between letters to maintain the line of reading) 
Figure 1.3 Examples of normal, loose and tight tracking 
(Image courtesy of Codrops)


Note- when adding letter space to a body of text or word, it may increase or reduce the readability of text 
  • Flush left- this format that most closely mirrors the asymmetrical experience of handwriting. Each line starts at the same point but ends whenever the last word on the line ends. Spaces between words are consistent throughout the text. 
  • Centred- this format imposes symmetry upon the text, assigning equal value and weight to both ends of any line. 
  • Flush right- This format places emphasis on the end of a line as opposed to its start. Useful for situations (like captions) where relationship between text and image might be ambiguous without a strong orientation to the right. 
  • Justified (like centring)- This format imposes a symmetrical shape on the text. It is achieved by expanding or reducing spaces between words and, sometimes, between letters.
Texture
- Different typefaces suit different messages, must know which typeface best suits the particular message.
- The different textures of the typefaces must be considered too.
- Type with a generous x-height or heavy stroke width produces a darker mass on the page compared to a type with a relatively smaller x-height or lighter stroke.

Leading & Line Length 
- The goal of setting text type is to allow for easy, prolonged reading. A field of type should occupy the page as much as the photograph does.
  • Type size- Text type should be large enough to be read easily at arms length 
  • Leading- Test that is set too tightly encourages vertical eye movement; a reader can easily loose his or her place. Type that is set too loosely creates striped patterns that distract the reader from the material
  • Line Length- Appropriate leading for text is as much a function of the line length, as it is related to the type size and leading. Shorter lines require less reading; longer lines more. (Good rule of thumb- keep line length between 55-65 characters)
Type Specimen Book 
can be understood as an orderly and preferably complete conspectus of the typefaces available in a particular type foundry or printing house. It may be in a single sheet or a book. 

Note- it is useful to enlarge type to 400% on the screen to get a clear look between the descenders on one line and ascenders on the line below

Text (Part 2)

Options for indicating paragraphs
  • Pilcrow- A holdover from medieval manuscripts seldom use today
  • Line space- More common way of indicating paragraphs. The line space would be the same as the paragraph space (e.g. if line space 12pt, paragraph space is also 12pt), this ensures cross alignment across columns of text. "Line space" is different from "leading", leading is the space between the descender of a line to the subsequent ascender of a line.
  • Standar indentation- the indent is the same size of the line spacing or the same as the point size of your text
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 new column
Figure 1.4 Examples of Widow and Orphan (Image courtesy of TypeEd-Rachel Elnar)

Highlighting Text 
- different kinds of emphasis require different kinds of contact 
  • Sans serif font reduced by 0.5 to match the x-height of the serif typeface
  • reduced aligned figures/numbers or all capital acronyms embedded in the text by 0.5, this ensures visual cohesion of the text
  • placing a field of colour at the back of the text, maintaining left reading axis of the text ensures readability is at its best 
  • Place certain typographic elements outside the left margin of a column of type to maintain a strong reading axis; quotation marks, e.g. bullets, creates clear indent 
Headline within Text 
  • A headers- indicates a clear break between the topics within a section; sets larger than text, in small caps and in bold
  • B headers- indicated a new supporting argument or example for the topic at hand; shown in smalls caps, italic bold serif and bold san serif
  • C headers- highlights specific facts of material within B head text, not as commonly used; with B heads, C heads are shown in small caps, italics, serif bold and san serif bold
Figure 1.5 A Headers 

Figure 1.6 B Headers 

Figure 1.7 C Headers


Cross Alignment
cross aligning headlines and captions with text type reinforces the architectural sense of the page and the structure

Week 4 

Understanding 
  • Some uppercase letters may appear symmetrical, but when we look up close, most are not symmetrical 
  • For example, the width/weights of the left stroke of an uppercase "A" is sometimes thinner than the right stroke
Figure 1.8 Baskerville "A"

Figure 1.9 Univers "A"

Maintaining x-height 
  • curved strokes, such as "s", must rise above the media or sink below the baseline, in order to appear to be the same size as the vertical and horizontal stroked they adjoin 
Figure 1.10 Examples of maintaining x-height of curved strokes 

Counterform 
  • Counterforms must be taken into consideration to ensure the that readability is maximised
  • Counterforms could also be manipulated to improve the aesthetic of letterforms

Contrast 
  • Contrast are often used to separate the differences so it becomes more apparent to the reader
  • Simple contrast can produce various variations- e.g. small+organic / large+machined; small+dark / large+light 
Figure 1.11 Examples of Contrast

Screen & Print 

Type for print
  • Type was primarily designed for reading from print before screen
  • IT designers job were to ensue that the text is smooth flowing and easy to read
Type for screen 
  • typefaces intended for use on the web are optimised and often modified to enhance readability and performance on screen in a variety of digital environments 
Hyperlink 
  • a word, phrase or image that can be clicked on, which would then redirect you to a new document or new section within the current document 
Font size for screen 
  • 16 pixel text on a screen is about the same size as the text printed in a book or magazine 
  • pixels differences between devices- screens on PCs, tablets, phones and TVs are not only different in sizes, but the text you see on screen would differs in proportion too
Static vs. Motion 

Static 
  • Static typography has minimal characteristic in expressing words
  • traditional characteristics such as bold and italic only offer a fraction of the expressive potential of dynamic properties 
  • we encounter static typography in billboard, posters, magazines, filters, etc. 

Motion 
  • for motion typography, temporary media offers typographers opportunities to "dramatise" type for letterforms to become fluid and kinetic 
  • motion typography is often overlaid onto music, videos and advertisements or set in motion with rhythm
Week 5 

This week I started watching the lecture recording on text formatting (Text formatting 1:4 to 4:4). 

Text Formatting 1:4 (Kerning & Tracking)

In the first video, we were taught on why and how to do kerning and tracking on Adobe Illustrator, with the 10 typefaces provided. 

Figure 1.12 Lecture Recording on Kerning and Tracking 

  • Focus on awkward spaces and counter spaces between the letters when we do kerning (Opt + Left or Right Arrow Key)
  • To reduce the kerning value (InDesign/Edit > Preference > Units & Increments > Kerning & Tracking: 5) 
  • Tracking (Select texts > alt/opt > Left or Right arrow Key)
We were then told to practice kerning and tracking with our names and the 10 typefaces before proceeding to our next task. 

Figure 1.13 Practice Kerning and Tracking 

Text Formatting 2:4 (Font size, Line Length, Leading & Paragraph Spacing)
  • manipulate grids/adjust margin space/introduce columns 
  • New document > Layout > Margin & Columns (can adjust margin & columns to make the layout more appealing)
  • point size for A3/A4 is generally 8-12pt 
  • line length around 55-56 (can check using "info" from window); reduce point size to change line length or characters 
  • note: drag "A-master" to create new page 
  • leading usually 2-3pt more than point size (control bar > character forming control)
  • paragraph spacing depends on leading (if point size increased, leading and paragraph spacing will need to be increased as well)
  • make sure there's evenness between the spread of white and black spaces
Text Formatting 3:4 (Connect Text Fields, Alignment & Ragging)
  • import picture (file > place/cmd D > locate jpeg > place image)
  • manipulating the external boundary box does not affect the image; direct selection tool (A) > select > adjust image within boundary box 
  • select boundary box> fill frame proportionately (control bar) / other proportion options 
  • manipulate grid system to increase margin size (open pages > select the right document > layout > margin & columns > adjust margins (to fit text field)
  • click the red "+" at the bottom of the text box if there's hidden text, and place it at the next column 
  • try to maintain the same width for all columns 
  • ragging- fix with letter spacing and kerning/tracking (Preferences > Units & Increments > kerning & tracking:5); (select text line: opt + Right or Left arrow key - at most 3 times) 
  • remove hyphens (select text > paragraph formatting controls > turn of hyphens)
  • text can be aligned left or left justified; if justified, column intervals might need to be increased from 5mm to 7mm/10mm 
  • align text box or texts to bottom or top (select text > cmd b (text frame opt) > adjust:align > OK
Text Formatting 4:4 (Cross Alignment & Layout)
  • cross alignment and baseline grids 
  • baseline grids (view > guides > show baseline grids) 
  • zoom in to see the grids or Preferences > grids > increment every (leading point) > view threshold: 50% > OK
  • for headline leading, to maintain cross alignment make sure leading is multiples of 2 (e.g. 11 becomes 22) 
  • Select texts > right click > text frame opt / cmd b > Baseline options: leading > General-Align: Top > OK 
  • text should be aligned to baseline grid, aligned to left 
  • cross alignment for headline (select headline > cmd b > baseline > offset~leading >General-Align: Top > OK); do the same for sub-headlines an captions 
  • oblique or italicise subheadlines 
During class this week, the lecturers also gave us instructions on our Task 2 / Typographic Exploration & Communication (Text Formatting and Expression). 



INSTRUCTIONS 



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

Exercises / Type Expression 

Our first task is to compose and express four words out of the seven choices (slice, scream, wave, spin, punch, eat, point). We were told to sketch out our idea before digitising our work on Adobe Illustrator. 

Figure 2.0 Rough Sketches (6/4/2021)

After sketching out my ideas roughly, I went with the following four words- point, punch, eat, scream.

Figure 2.1 Sketch 1 (8/4/2021)

After getting feedback from the lecturers and my peers in class today, I've made some amendments to sketches and came out with some new ideas. 

Figure 2.2 Sketch 2 (12/4/2021)

For week two, we were given the instructions to digitise our sketches on Adobe Illustrator. We may explore more during the process of digitising and see if we can come up with more creative ideas. 

Figure 2.3 Process of digital artwork on Adobe Illustrator (14/4/2021)

Below is my digital artwork-


Figure 2.4 Final Digital Artwork (15/4/2021)



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

Our next task is to animate our artwork and create GIFs using Adobe Illustrator and Adobe Photoshop, and try to interpret it in a way in which it would express the meaning of each word well. Below are the processes of my GIF work on Adobe Illustrator and Photoshop-  

I started by making an "eat" gif, trying to make the "e" eat the "a", and "t" is running away. However, the artwork is not as clearly communicated. 

Figure 2.5 Progress of "eat" GIF making on Adobe Illustrator (22/4/2021) 

Figure 2.6 Progress of "eat" GIF making on Adobe Photoshop (22/4/2021)

Figure 2.7 Progress of "eat" GIF making (22/4/2021)

Therefore, I started my second GIF work "point". 

Figure 2.8 Progress of "point" GIF making on Adobe Illustrator (22/4/2021)

Figure 2.9 Progress of "point" GIF making on Adobe Photoshop (22/4/2021)

Finally, I'm satisfied with my GIF artwork of "point". Below is my final GIF art work-
Figure 2.10 Final "point" GIF artwork (22/4/2021)

Exercises / Formatting Text 

For our first task or exercise for text formatting, we have to watch the videos on text formatting provided by the lecturers and practice text formatting on Adobe InDesign. 

In the first video, we learned to kern and track using the 10 different typefaces.  

Figure 2.11 Kerning & Tracking my name (29/4/2021)



Next, we will have to use the article "I am Helvetica", provided by the lecturers, for this text formatting exercise. 

Note: pay attention to margins, columns, font, point size, line length, leading, paragraph spacing, letter space, ragging, widows & orphans, and cross alignment.

Below is my progress for text formatting task- 

Figure 2.12 Text Formatting Progress (28/4/2021)

Figure 2.13 Text Formatting Progress (28/4/2021)

Figure 2.14 Text Formatting Progress - with hidden character turned on (29/4/2021)

For this task, I used the font Gill Sans, point size-11pt, leading & paragraph spacing-13pt. My first attempts for the task-

Figure 2.15 Text Formatting Task (1st Attempt) (29/4/2021)

After getting feedback from the lecturers and my peers, i made some amendments to my work (aligned the image and caption & italicised caption). 
   
Below is my amended work for text formatting task 1- 
Figure 2.16 Text Formatting Task (Final) (30/4/2021)


<iframe src="https://drive.google.com/file/d/1LqrR2GXP9TZJE-aBZZcl8dRC6q6RdkST/preview" width="640" height="480"></iframe> 



FEEDBACK

Week 2

Specific feedback- Overall sketches are fine, but "punch" can be improved, can be more expressive and show more impact on the word. My first version of the "punch" on the sketch, just has the "P" hanging half way in the air, no punch motion is shown, no impact is present to "unch". Change work to show more impact on "unch", make the "P" look more powerful, with more impact and strength. 

General feedback- Can explore more, get more ideas. Most of my ideas are very plain, similar to the majorities. Would be good to explore more, find various ideas for my sketches, some that would be more engaging and communicative. Come up with sketches that are more expressive and have more visual effects. 

Week 3

Specific feedback- "Eat" and "point" are good, compositions are impactful and engaging. Maybe could improve a little more on how it sits on the art board, but not so big of an issue according to my peers as it still does express the the words well. "Scream" and "punch" sits well on the art board, however, it does not show much impact and it is not as engaging or expressive as "eat" and "point". Try to explore more on "eat" and "point" and make the words more engaging and improve on the compositions, make it more impactful. So that the artwork will clearly express the meanings and motions of the words. 

General feedback- Don't use too much effects and don't distort it too much, while still making sure that artwork is readable. Create artwork the is still expressive, engaging and impactful, with minimal effects and distortion, remaining most of the originality of the typefaces.
 
Week 4

Specific feedback- I got feedback for both my GIFs, "eat" and "point". I was told to only pick one out of the two. For my "eat" GIF, I tried to make the "e" "eat" the "a", and have the "t" "run away" from the "e". However, I was given the feedback that the idea or concept is not good and not obvious enough, it was not expressive and clearly communicated. Whereas, the "point" is much better. Although the GIF idea and concepts are much simpler than the "eat" GIF, but it expresses the meaning of the word "point" more clearly. 

Week 5

Specific feedback- This week I got feedback for my task 1 of the text formatting exercise. The overall layout is neat, body text and headlines were well aligned. Besides, ragging was well controlled, no widows and orphans, cross-alignment was also established with baseline grids. However, a few mistakes were pointed out by my peers, for example, the two main issues is that my image was not aligned with the columns, caption was also not aligned. Other suggestions or improvements that could be made was that i could have increased the point size for my sub-heading, and maybe italicised my caption. Also, I could play around with the caption, and see if it would be better if its placed or position somewhere else (like maybe a little above) or try to right align the caption, etc.

General feedback- Make sure to pay attention to the column interval, if justified could make the column interval about 7. Try to come out with our own style and own layout, instead of following the example given by the lecturer exactly. 



REFLECTION

Week 1

Experience 
Since this is my first design module, I'm still trying to get use to how things work as everything seems quite new to me. Lectures and classes were interesting!  Maybe because its the first week of the semester, I do feel a little overwhelmed by the workload we have for this module. There's a lot that I will have to read and pick up for this module. 

Observation 
I'm quite slow when it comes to coming up with ideas and sketching them out, therefore, I wish I can stop procrastinating and speed my productivity. 

Findings 
I think its important to get out of my comfort zone and keep my creativity juices flowing, in order to excel in this module. 

Week 2

Experience 
We were taught on how to use different tools and techniques in Adobe Illustrator and practice digitising sketches on Adobe Illustrator during class this week. 

Observation 
It was really interesting learning the different techniques for Adobe Illustrator, however, there are still many essential Illustrator techniques I could learn. 

Findings 
I got feedbacks from the lecturers and my peers regarding my sketches for task 1. I think there are many areas which I could still improve on, think out of the box and explore more.

Week 3 

Experience 
During class this week, we learned to animate our artwork and create our own GIFs, using Adobe Illustrator and Photoshop. 

Observation 
Creating GIFs were fun, I really enjoyed it. But, of course, there's still a lot I have to learn and improve on. For instance, how to create a more smoother transition in a GIF. It's a process of trial and error and it takes practice to get better.

Findings 
Most of the feedbacks I got from my peers this week were much more positive. Although criticism may help me improve, but knowing that people are starting to acknowledge my efforts and liking my work, motivates me to work harder. Hopefully I'll be able to complete this module smoothly and with flying colours. 

Week 4

Experience 
This week we started on our another part of our exercise, formatting text. We also started learning on a new Adobe Software, InDesign. We started of with the basics of InDesign, since its a new software we are going to use for a new task. Adobe InDesign is different from Adobe Illustrator and Photoshop, InDesign focuses more on text layout and formatting, whereas, we do more graphics on Illustrator. We were taught on how to use Adobe InDesign for different text formatting, and how to utilise this software for our new task for the exercise. 

Observation 
I might need to take a longer period of time to familiarise with Adobe InDesign, as I have not worked with this software as much as Illustrator or Photoshop. So, it is still relatively new to me. I might have to look up more and do my research on the different functions of InDesign in order to do well for this new exercise/task. 

Findings 
I mainly got specific feedback from the lecturers this week as they are the were reviewing and checking our e-portfolio in class. I got critical feedback from the lecturers on some of my GIFs artwork, therefore, I still have a lot to work on. Will surely try my best to improve on my artwork in order to come out with one that I'd be satisfied with. 

Week 5

Experience 
This week we continued with type formatting, learning about the different types of layouts that could be done using Adobe InDesign. We also revised on some of the essential elements and details we have to pay attention to when using InDesign, such as the leading, point size, alignments, and more. We could also place an Adobe Illustrator folder in our InDesign file, to create a more impactful headline for our formatting and layout. 

Observation 
InDesign is not as easy as it seems, there are a lot more little details that we have to pay attention to. For example, paragraph spacing, leading, point size, alignment, cross alignment, ragging, widow and orphan, etc. There's still a lot that I have to learn regarding text formatting and this software. 

Findings 
This week I got feedback from my peers on my text formatting work which I did on InDesign. I got positive feedback such as my layout was neat and clean. Besides that, I also got other useful feedback for areas in which slight changes and amendments could be made. For example, I could improve on my alignments and adjust my headlines. There's still a lot in which I can improve on. Text formatting is not as easy as it seems, although most layout may look simple, but a lot of work and consideration must be put into those little details. 



FURTHER READING

Adobe Illustrator - Text Basics - Text Tool Tutorial 

Figure 3.0 Further Research on YouTube 

Here is the YouTube link about the basics of texts and type tool on Adobe Illustrator- https://www.youtube.com/watch?v=YffuAdaCnAI&t=137s 

In this video, they taught on how to create different text effects using Adobe Illustrator, starting of with an introduction on the type text tool. Then went on with some simple effects which can be done using the pen tool and direct select tool. E.g. Add anchor points on text path using the pen tool and use direct select tool to "pull" the points to create a certain effect. 

The Fundamentals of Typography 2nd Edition by Ambrose, Gavin, Harris, Paul 

Figure 3.1 The Fundamentals of Typography (cover) 

This book provides a deep insight into the history of typography, origins of type and the development of type. It also shares about typographic detailing and the use of creative typography, to add depth and content to our artwork. This book is also a good source of creative inspiration through visual exploration of typefaces over the years. 

Chapter 4 - words and paragraphs 

Figure 3.2 Chapter 4 of The Fundamentals of Typography (page 101)


Chapter 4 (page 101-127) of this book covers some of the basic elements of type used to form words and paragraphs which clearly communicates and expresses our intentions. Focusing on the ways how the spaces between words or lines can enhance our work. 
  • Relationship between the 3 elements (measure, type size, typeface)- a change or adjustment to any of the 3 elements (measure, type size and typeface) means we'll have to adjust the other elements as well 
  • Different fonts are different in size, even when set at the same type size
  • Kerning- the removal of space and letter spacing (addition of space between letters) to improve the visual look of type
  • Alignment- refers to the position of type within a text block, both vertically and horizontally 
Playing with Type by Lara McCormick 

Figure 3.3 Playing with Type (cover)

This book enforces on the principles of type and also pushes the form into new arenas. The book is divided into six different sections: letter and wordplay, project-based play, alphabet play, lettering play, playing with context and application, and playing with type. It also touches on some of the terms we learned in our lectures, e.g. x-height, leading, letter space, weight, font, baseline and more. There are different types of experiments in the book that teaches us on designing with specific fonts given. All which are very helpful for our task 1- type expression. 

I.D.E.A.S. Computer Typography Basics by David Creamer

Figure 3.4 Computer Typography Basics (cover) 

This report covers quite a number of typography rules, understanding these rules allow us to decide which rules are critical and identify our work for mistakes.

Line Spacing (page 15-17)
- refers to the amount of space between lines
- major factors to consider when deciding on how much line spacing to use: the font used, the line length, and the type size 
- type size and line spacing are normally written together as both are measured in points and are inseparable (e.g. 10/12- indicates that type size in 10pt and line spacing is 12 pt)
- normally, the percentage options or auto leading, should be avoided as it can make larger headings look too spread out

Paragraph Alignment (page 19)
- refers to the side of the page margin or column with which the text is even 
- text is even with the left side of the page margin or column is flushed left, others could be flush right, centered, justified, etc. 

Paragraph Spacing (page 20)
- refers to an automatic space between each paragraph that is applied when starting a new paragraph, can apply space either above or below the paragraph 

Paragraph Rules (page 21)
- also known as in-line rules, refers to ruled that move with the text as it is edited
- usual options include the width, style and colour of the rule 
- in-line rules can also be used for reverse-type subheads or subheads with colour rules, creating a striking contrast to the body text 
 
Formatting Styles (page 30)
2 types of styles: 
- paragraph styles (most common style used for general formatting, effect the entire paragraph, even if the entire paragraph is not selected)
- character styles (only effect text that is selected, this could be one character, one word, or multiple words, usually used for formatting a drop cap letter and for highlighting product or company names)




Comments