Typography - Task 1:Exercise

on
April21,2025

TYPOGRAPHY｜Task 1:Exercises

||  17/04/25 – 30/05/25 (Week 1-Week 6) 
||  Low Xin Er, 0374596
||  Typography
||  Exercises / Type Expression & Type Formatting. 

TABLE OF CONTENTS
3.5 Digitalize  



1.Instruction



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


2.0 LECTURES

2.1 Introduction and Typo_1_Development

Early letterform development: Phoenician to Roman 


Fig. Initially writing meant scratching into wet clay with sharpened stick or carving into stone with a chisel.


The development of letterforms has been significantly influenced by the tools employed in writing. From using chisels for stone to brushes for ink, each tool shaped the aesthetic and structural qualities of the fonts that emerged. This evolution highlights the relationship between technology and design, indicating that innovation in tools directly impacts creative output.


The Greeks changed the direction of writing. 



Phoenicians, like other Semitic peoples, wrote from right to left. The Greek developed a style of writing called 'boustrophedon' (how the ox ploughs), which meant that the lines of text read alternately from right to left and left to right.As they change the direction of reading they also changed the orientation of the letterforms:







Hand script from 3rd - 10th century C.E.


4th or 5th century: Square Capitals
Square capitals were the written version that can be found in Roman monuments. These letterforms have serifs added to the finish of the main strokes. The variety of stroke width was achieved by the reed pen held at an angle of approximately 60° off the perpendicular.




Late 3rd - mid 4th century: Rustic capitals
A compressed version of square capitals, rustic capitals allowed for twice as many words on a sheet of parchment and took far less time to write. The pen or brush was held at an angle of approximately 30° off the perpendicular. Although rustic capitals were faster and easier to, they were slightly harder to read due to their compressed nature.


4th century: Roman cursive
Both square and rustic capitals were typically reserved for documents of some intended performance. Everyday transactions, however were typically written in cursive hand in which forms were simplified for speed. We can see here the beginning of what we refer to as lowercase letterforms.


4th - 5th century: Uncials
Uncials incorporated some aspects of the Roman cursive hand, especially in the shape of the A, D, E, H, M, U and Q. 'Uncia' is Latin for a twelfth of anything; as a result, some scholars think that uncials refer to letters that are one inch (one twelfth of foot) high. It might be more accurate to think of uncials simply as small letters.The broad forms of uncials are more readable at small sizes than rustic capitals.



C.500; Half-uncials
A further formalization of the cursive hand, half-uncials mark the formal beginning of lowercase letterforms, replete with ascenders and descenders, 2000 years after the origin of the Phoenician alphabet.





C. 925: Caloline miniscule
Charlemagne, the first unifier of Europe since the Romans, issued an edict in 789 to standardize all ecclesiastical texts. He entrusted this task to Alcuin of York, Abbot of St Martin of Tours. The monks rewrote the texts using both majuscules (uppercase), miniscule, capitalization and punctuation which set the standard for calligraphy for a century.




Blackletter to Gutenberg's type 


c. 1300: Blackletter (Textura)
With the dissolution of Charlemagne's empire came regional variations upon Alcuin's script. In northern Europe, a condense strongly vertical letterform know as Blackletter or textura gained popularity. In the south, a rounder more open hand gained popularity, called 'rotunda'. The humanistic script in Italy is based on Alcuin's miniscule.



c. 1455: 42 line bible, Johann Gutenberg, Mainz.
Gutenberg's skills included engineering, metalsmithing, and chemistry. He marshaled them all to build pages that accurately mimicked the work of the scribe's hand - Blackletter of northern Europe. His type mold required a different brass matrix, or negative impression, for each letterform.









1450 Blackletter

The earliest printing type, its forms were based upon the hand-copying styles that were then used for books in northern Europe.

Examples: Cloister Black • Goudy Text





1475 Oldstyle


Based upon the lowercase forms used by Italian humanist scholars for book copying (themselves based upon the ninth-century Caroline minisule) and the uppercase letterforms found inscribed on Roman ruins, the forms evolved away from their calligraphic origins over 200 years, as they migrated across europe, from Italy to England.

Examples: Bembo • Casion • Dante • Garamond • Janson • Jenson •Palatino



1500 Italic


Echoing contemporary Italian handwriting, the first italics were condensed and close-set, allowing more words per page. Although originally considered their own class of type, italics were soon cast to complement roman forms. Since the sixteenth century, virtually all text typefaces have been designed with accompanying italic forms.




1550 Script


Originally and attempt to replicate engraved calligraphic forms, this class of type is not entirely appropriate in lengthy text settings. In shorter applications, however, it has always enjoyed wide acceptance. Forms now range from the formal and traditional to the casual and contemporary.

Examples: Kuenstler Srcipt • Mistral • Snell Roundhand




1750 Transitional

A refinement of oldstyle forms, this style was achieved in part because of advances in casting and printing. Thick to thin relationships were exaggerated, and brackets were lightened.

Examples: Baskerville • Bulmer • Century • Time Roman





1775 Modern


This style represents a further rationalization of oldstyle letterforms.

Serifs were unbracketed, and the contrast between thick and thin strokes extreme. English versions (like Bell) are also known as Scotch Romans and more closely resemble transitional forms

Examples: Bell • Bodoni • Caledonia • Didot • Walbaum


1825 Square Serif / Slab Serif

Originally heavily bracketed serif, with little variation between thick and thin strokes, these faces responded to the newly developed needs of advertising for heavy type in commercial printing. As hey evolved, the brackets were dropped.

Examples: Clarendon • Memphis • Rockwell • Serifa





1900 Sans Serif


As their name implies, these typefaces eliminated serifs alltogether.

Although the forms were first introduced by William Caslon IV in 1816, its use did not become wide-spread until the beginning of the the twentieth century. Variation tended toward either humanist forms (Gill Sans) or rigidly geometric (Futura). Occasionally, strokes were flared to suggest the calligraphic origins of the form (Optima). Sans serif is also referred to as grotesque (from the German word grotesk) and Gothic.

Examples: Akzidenz Grotesk • Grotesk • Gill Sans • Franklin Gothic • Frutiger • Futura • Helvetica • Meta • News Gothic • Optima • Syntax• Trade Gothic • Univers





1990 Serif/Sans Serif


A recent development, this style enlarges the notion of a family of typefaces to include both serif and sans serif alphabets (and often stages between the two).

Examples: Rotis • Scala • Stone







2.2 Typo_3 Text part 1



Kerning: space between two alphabet

Tracking: balance space between every alphabet in word


3 ways:

  • Option +left arrow key
  • Preference> type> unit& increments >reduce kerning/tracking：20to5 >move more slower to adjust
  • Command shift < or >to adjust word’s size


Fig. Tight tracking is easier to read.


Uppercase letterforms: strong resistance,stand on their own

Lowercase letterforms: maintain the line of reading



Alignment 

  • Flush left: ragging to right
  • Centered: symmetry,prefer small amounts of copy
  • Flush right: ragging to left,exp:situation,caption 
  • Justified: expanding spaces between words(careful attention to line breaks),exp:reflection

Fig. If you see the type before you see the words,change the type.


Text/Texture

It is important to understand how different typefaces feel as text and suit different messages.


Text layout




Larger x-height easier to read


Fig. Thickness of stroke,too much contrast will affect reading.


Type size: Large enough to be read easily at arms length


Leading

  • Too tight: Vertical eye movements
  • Too loose: Creates striped patterns to distract the reader from the materials
  • Line length: A good rule of thumb is to keep line length between 55-65 characters.
  • Size:10/12 is standard color of text for reading comfortable.


Type specimen book


Fig. Shows samples of typefaces in various different sizes:type size,type leading,type line length etc.


Compositional requirement:

  • Occupy a page or a screen
  • Having a middle gray value
  • Not a series of stripes


“Nothing replaces looking closely at an actual print out of your work.”

"Typography is all about details."




2.3 Typo 4-text part2

Indicating Paragraphs (paragraph space)


Pilcrow: a holdover from medieval manuscripts seldom use today





Line space(leading) :space size pt same with paragraph size.

Exp:

  • Text point is 10,leading should be 12 or larger
  • Text point is 12,leading should be 12 to be balance (in two column)

Cross align

Exp 

  • Text 10pt /leading 13pt
  • Select all the paragraph, click pilcrow and set it into 13 pt
  • Second column content will perfectly cross align

Line vs leading


Standard indentation

Fig. Indentation should using justified alignment

Avoid mistakes

  • 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



Solution

  • widow: rebreak the line endings throughout the paragraph so the last line of any paragraph is not noticeably short.
  • orphan: make sure no column of text starts with the last line of the preceding paragraph.

Highlighting text


Fig. Italics / bold



Fig. Change type family / colour (black,cyan,magenta and yellow)



Reduce size
Sans serif font is usually bigger than other font, need to reduce 0.5 to match the x-height of the serif type.

Fig. Good designer will reduce the number size 0.5pt to avoid it stand out.


Field of colour at the back of the text

Fig.Maintaining the left reading axis(right example) of the text ensures readability is at its best.


Typographic elements

Fig. outside or inside the axis

Quotation marks

Bullets: create clear indent




Heading within text

Fig. A type of heading


Fig. B type of heading


Fig. C type of heading


Hierarchy: putting together a sequence of subheads(variety ways)

Cross alignment: reinforces the architectural sense of the page

Fig. exp leading20,headline24pt=make alignment of headline and paragraph to be the same.




2.4 Typo 2 Basic

Describing letterforms

  • Baseline: imaginary line the visual base of letterforms
  • Median: defining the x-height of letterforms
  • X-height: height in any typeface of the lowercase”x”


Stroke: defines the basic letterform

Apex/Vertex: the point created by joining two diagonal stems


Fig. apex=above,vertex=below


Arm: short strokes off the stem of the letterform




Ascender: portion of the stem of a lowercase letterform that projects above the median.

Barb: the half-serif finish on some curved stroke

Rest of type notes:























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


The font

  • uppercase: capital letters,certain accented vowels
  • lowercase: include same characters as uppercase


Small capitals
Uppercase letterforms draw to the x=height of the typeface, primarily found in serif fonts as part of expert set.




Uppercase numerals

  • Lining figures,same height as uppercase letters,set to the same kerning width.
  • Successfully used with tabular material or any uppercase letters.


Lowercase numerals

  • Old style figures or text figures,set to x-height with ascenders and descenders.
  • Best used when ever use upper and lowercase letterform.
  • Far less common in sans serif type-faces than in serif.



Italic: Oblique are typically based on the roman form of the typeface.



Italic vs Roman


Punctuation.miscellaneous characters

Fig. change by typefaces

Ornaments: flourishes in invitations or certificates


Fig. Adobe Calson Pro contain ornamental fonts as part of the entire typeface family.


Roman


Simple design of typography can make it suited to a variety of purposes but too charactics will shorten its survival.

"You can’t be a good typographer, if you aren’t a good reader. " -Stephen Cole




2.5 Typo 5 Understanding

Letters/Understanding letterforms

  • Uppercase letter forms below suggest symmetry but in fact it is not symmetrical.Two stroke weights of Baskerville stroke are different and each bracket connecting the serif to the stem has a unique arc.


  • Close examination shows that the width of the left slope is thinner than the right stroke, making it harmonious and individually expressive.




  • Helvetica and Univers.Comparison of how the stems of the letterforms finish and the bowls meet the stems quickly reveals the palpable difference in character between the two.

 



Maintaining x-height

  • Curved strokes such as in ‘s’ must rise above the median(or sink below the baseline) in order to appear to be the same size (visual) as the vertical and horizontal strokes they adjoin.


Counterform

  • Important as recognizing specific letterforms is developing a sensitivity to the counterform (or counter).The space is described and often contained by the strokes of the form.When letters are joined to form words,the counterform includes the spaces between them.
  • How well you handle the counters when set type determines how easily people read what’s been set.


  • Examining letters in close detail provides a good feel for how the balance between form and counter is achieved, a palpable sense of letterform’s unique characteristics and a glimpse into the process of letter-making.


  • The sense of the ‘S’ holds at each stage of enlargement while the ‘g’ tends to lose its identity as individual elements are examined without the context of the entire letterform.

Contrast

  • The most powerful dynamic in design-as applied to type based on a formal devised by Rudi Ruegg.
  • Simple contrast produces numerous variations:small+organic/large+machined; small+dark/large+light…




2.6 Typo 6 Screen & Print

Different medium

 


  • In the past,typography was viewed as living only when it reached paper.Once a publication was edited,typeset and printed,it was done and nothing changed after that.Good typography and readability were the result of skilled typesetters and designers.
  • Today,typography exists not only on paper but on a multitude of screens that are subject to many unknown and fluctuating parameters:operating system,system fonts,the device,screen itself,the viewport and more.Our experience of typography today changes based on how the page is rendered because typesetting happens on the browser.

Print type vs screen type


Type for print:

  • Designed for reading from print long before we read from screen.Must ensure that the text is smooth,flowing and pleasant to read.
  • Common typefaces: Caslon,garamond,Baskerville
  • Their characteristics are elegant and intellectual but also highly readable when set at small font size.Exp brand Burberry

Type for screen:

  • Intended for use on the web are optimized and often modified to enhance readability and performance on screen in a variety of digital environments.Include a taller x-height (reduced ascenders/descenders),wider letterforms,more open counters,heavier thin strokes and serifs,and modified curves and angles for some designs.
  • Type for screen: Georgia,Verdana

  • Typefaces intended for smaller sizes are more open spacing.It improves character recognition and overall readability in the non-print environment,which can include the web,e-book,e-readers and mobile devices.


Hyperactive Link/hyperlink

  • A word/phrase/image that can click on to jump to a new document/section within the current documents. It allows users to click their way from one page to another.
  • Text hyperlink are normally blue and underlined by default.When moving the cursor over a hyperlink,whether it is text or an image,the arrow should change to a small hand pointing at the link.

Font for screen

  • 16-pixel text on a screen is about the same size as text printed in a book or magazine;this is accounting for reading distance.
  • Text printed is typically set at about 10 points. If you want to read them at arm's-length, you need at least 12 points, which is the same size as 16 pixels on most screens.

System Fonts for screen/web safe fonts

  • Each device comes with a different pre-installed font selection. If you don't have that font installed and it’s not pulling from a web-friendly place,the font would default back to some basic variation like Times New Roman and it would just look plain ugly.

‘Web safe’ ones appear across all operating systems.They’re the small collection of fonts that overlap from window/mac/google.


  • Open Sans
  • Lato
  • Arial
  • Helvetica
  • Times New Roman
  • Times
  • Courier New
  • Courier
  • verdana
  • Georgia
  • Palatino
  • Garamond

Pixel differential between devices

  • The screens used by our devices are different in size and proportion because they have different sized pixels.100 pixels on a laptop is very different from 100 pixels on a big 60’’ HDTV.
  • (even within a single device class there will be a lot of variation)
  • (But don't just choose using safe mode to design on screen)

Static vs Motion


Static:Expressing words,offer a fraction of the expressive potential of dynamic properties by using bold and italic.


Motion: Dramatize type for letterforms to become ‘fluid’ and ‘kinetic’.motion graphics particularly the brand identities of film and television production companies increasingly contain animated type.

  • Exp:music videos,advertisements,following the rhythm of a soundtrack.
  • Aim:establish the tone of associated content or express a set of brand values.
  • Note:must prepare the audience for the film by evoking a certain mood.

“A great designer knows how to work with text not just as content,he treats text as a user interface.” - Oliver Reichenstein



 3.Process of work

Task 1 - Design 4 words typographically

JUMP / CHILL / MELT / ROLL

3.1 Research & Ideation Board


Fig.Roll & Jump references.


Fig. Chill & Melt references.


3.2 Explore & Sketch


Fig. Exploration of sketches


     
Fig. Clear line art for 4 design for each word

3.2.1 Feedback from lecture:
  1. Can combine JUMP ver1 and ver4 = Step motion & bounce motion
  2. Cheese melt and butter melt express is really interesting no need adjustment,will be assist for digitalise and animate later.
  3. CHILL words can't get the feels of relax.should change the meaning of it to be cold and design it in a new perspective.
  4. ROLL ver2 & ver3 is good.ver 2 is rare while ver3 can adjust to make the circle falling down from capital letter of R so the animation will be interesting.

3.3 Adjustment

Fig. JUMP design & ROLL design.


Fig. CHILL new design to express cold.



3.4 Final Sketch Designs:

Fig. Typography of 01.JUMP / 02.ROLL / 03.CHILL / 04.MELT 


3.5 Digitalize
 3.5.1 Feedback from lecture:
CHILL looks like speed but not cold freeze.the sketch has better expression is because its looks like ice buck but digitalize one too sparkylooks like speed.need to adjust the ice bucks.

3.6 Final Digital Design


3.7 Animation - JUMP

Draft：The direction of the stair-like upward jump is determined.
  
Fig.draft

Adjustment1：Add bounce and squeeze dynamic effects.
Fig.Adjustment 1


Final Animation：Improve the smoothness of the bouncing effect and the M-shaped dynamic line.

Fig. Final Animation



Adobe Illustration Notes (tutorials)

Introduction to the basic operation of Adobe Illustrate software.
(Common units: inch, cm, mm)

1.Introduction to the basic toolbar
  • Option bar is at the top
  • Control bar is at the second top, needs to be opened manually from the window

2.Different mouses have different functions
  • Black arrow changes the size of the element
  • White direct arrow directly controls the point of the square, only changes one point

3.Change the shape of the text
  • Select the text you want and right-click Create Outline to turn your text into a shape
  • Keyboard A shows a controllable point (white mouse) to change the shape of the text.
  • - After turning the text into a shape, it cannot be changed back to an editable font
  • - You can click on individual letters in the layer to move and change

4.Open multiple artboards in the same file to create different versions of the work
  • Create a new artboard in the lower right corner of the artboard
  • You can unlock the layer to prevent accidental touch and move

5.Download fonts, install font methods
  • Unzip the file first
  • Android: Select all files, right-click install
  • iOS: Open the file otf, click to open and download the font from fontbook

6.Quick copy method
  1. Click option to drag the element to be copied
  2. Ctrl+Ctrl F to ensure that the copied element is in the same line/grid

7.Type tool writing function

7.1.Normal typing
    • Click to type infinitely long until the enter key is pressed
    • Features: You can drag the grid to enlarge the font

7.2.Section writting
    • Create a grid, and the paragraph will only appear in the grid with automatic blank lines
    • Features: You cannot drag the grid to enlarge the font

8.Font design method

8.1.Touch type tool (shift t)
    • Click the letter you want to change to display a box, and change the position, size and rotation at will
    • Features: You can still edit the font

8.2.Manual method- Window > type > character

    • The window that pops up can view the font type, and you can manually adjust the rotation angle and shape.
    • Curning controls the space between individual letters
    • Tracking controls the space between all letters

9.Shortcuts for adjusting letter spacing
  • Select text option Click the keyboard to the right = expand
  • You can select individual letters to control

10.Shape tool

10.1.Shape builder tool (shift M)
    • Select all shapes, select and drag to link all shapes, and adjust the edges

10.2.Freetransform tool
    • Perspective control points change the perspective design

10.3.Wap tool
    • Turn the text into a shape first, wap option bend, and you can freely adjust the nodes

Animation Tutorials (AI+PS)

1.Adobe illustrator
  1. create artboard as frame
  2. use ctrl+c and ctrl+f to make sure elements is aligned
  3. more frame the animation more smooth
  4. export as all artboard>jpeg>72ppi

2.Adobe Photoshop
  1. file > scripts > load files...> browse > select all the jpeg > wait import
  2. window > timeline > (below) create frame > add frame as amount as we need
  3. click frame 2 > close layer 1 to show frame 2 > repeat until last frame
  4. adjust duration of frame under each frame
  5. erase the extra elements by using eraser/white brush/select and delete
  6. export as > web > gif > screen 72ppi


3.8 Kerning,Tracking and Leading


Fig.layout with different font using Adobe Indesign
_________________________________________________________________________

3.9 Text Formatting

1.One of the design:

HEAD LINE
Typeface: Bembo Std
Font/s: Bembo Std Bold
Type Size/s: 72 pt
Leading: 36 pt
Paragraph spacing: 0

BODY
Typeface: Bembo Std
Font/s: Bembo Std
Type Size/s: 9 pt
Leading: 11 pt
Paragraph spacing: 11 pt
Characters per-line: 57
Alignment: left justified
Margins: 123 mm top, 26 mm left + right + bottom
Columns: 2 
Gutter: 10 mm

2. Things to look out for when completing Task 1, Exercise 2 Text Formatting:
• Font size (8–12)
• Line Length (55–65/50–60 characters)
• Text Leading (2, 2.5, 3 points larger than font size)
• Paragraph spacing (follows the leading)
• Ragging (left alignment) / Rivers (Left Justification)
• Cross Alignment 
• No Widows / Orphans

Materials

A.Formatting Text:

Fig.Task1 exe2: Formatting Text pdf
B.Pictures:

 
Fig.Pictures choose from online


3.10 References 

   
 
Fig.references of formatting & grid layout.

3.11 Explorations & Drafts


  

  

  

  
Fig.12 type of style in layout design


3.12 Top 5 of selections



Fig.top 5 of selections for discuss with profesor to pick the best layout

3.13 Final Design

Fig. The special design of the title is the part of the formatting design that the professor is most satisfied with.


Fig.Final Formatting Design in pdf

HEAD LINE
Typeface: Hiragino Kaku Gothic Std
Font/s: W8
Type Size/s: 39 pt
Leading: 38 pt
Paragraph spacing: 0

Typeface: Bembo Std
Font/s: Bold Italic
Type Size/s: 22 pt
Leading: 29 pt
Paragraph spacing: 0

BODY
Typeface: Bembo Std
Font/s: Regular
Type Size/s: 9 pt
Leading: 11 pt
Paragraph space after: 3mm
First Line Left indent: 3mm
Characters per-line: 53
Alignment: left justified
Margins: 51 mm top, 52 mm left + 43 mm right + 20 mm bottom
Columns: 2 
Gutter: 6 mm

4. FEEDBACK

Week 1 
General feedback: 
Provide and explain the course outline, teaching methods and specific homework steps in detail.Provide teaching materials that can be reviewed repeatedly.Since sufficient teaching materials and a high degree of freedom in learning methods are provided, each student can arrange courses and homework more flexibly according to their own habits.

Week 2 
General feedback: 
Based on the current assignment, the basic usage of illustrator is explained in detail, including useful shortcut keys, so that students can master the functions while completing the assignment. Any unused functions are intentionally not mentioned so that students do not have too much pressure to familiarize themselves with the new software.
Specific feedback:
Objectively explain the rarity of the design. Frankly, in addition to good designs, the rarer the design, the better the score. Integrate the current design of the student to better utilize all the design features of the student. Ensure that teaching is provided to assist students in the lack of software application so as to complete the digitization of the work.

Week 3 
General feedback: 
The steps for exporting the work and using photoshop to create animations are explained clearly and concisely, without any extra steps to mislead students. In order to ensure that each student gets a fair amount of time for the interview, each interview is set at 3 minutes to avoid students in need not having the opportunity to interview.
Specific feedback:
In addition to the work that meets expectations, suggestions for improvement are also made for some designs that are lacking in details, rather than simply pointing out the problems. Efficient and good expression skills allow students to clearly understand the requirements of the assignment, saving a lot of time.

Week 4
General feedback: 
The course shows that students can understand the content outline of the next assignment on their own and start in advance, such as preparing InDesign software and explaining where the instructions for the next assignment can be found, ensuring that all students can keep up with the progress.
Specific feedback:
After there were no problems with the font design, the professor was quite satisfied with the animation design from draft to revision and improvement, and reminded us that we could start preparing for the next assignment.


Week 5 :
General feedback: A detailed explanation of the final optimization steps of the layout design is given, and there is also a reminder to record the steps for the next layout design to be calibrated one by one. The content description is started for the next assignment, and students are assisted in preparing the file format of the next assignment in advance to match the learning progress of each student.
Specific feedback:The professor praised the overall layout and title design, and there was no big problem with the layout design. After explaining the details of the layout design in class, he suggested that we first select a few optimal solutions and then make detailed adjustments to save time.
5. REFLECTIONS

Week 1：
At the beginning, I received a lot of file information from Teams, which was a bit difficult for me to handle. The professor in the YouTube link also made me worry whether the accent in class would make it difficult for me, who is not a native English speaker, to get used to it immediately. However, when I met Professor Mr. Goh, he was very friendly. The rhythm and pronunciation of the class made me feel very efficient and comfortable. After the detailed course explanation, I relaxed a lot. Therefore, I am very grateful to the professor for his patient explanation.


Week 2：
Although I have not obtained the school's permission to use the software for the teaching of Adobe Illustration, the professor's step-by-step explanation was enough for me to take notes in advance to prepare for the operation of the software later. What I appreciate most is that the professor did not introduce functions other than those needed for this assignment, so I can remember fewer steps. The notes are more targeted at the assignment to record shortcut key operation methods, etc., saving me a lot of energy and memory.


Week 3 :
I always feel uneasy and hope that I can be more efficient and faster, no matter what subject, but the professor's equally efficient explanation makes me feel that I have mastered the course. Although there are online courses on YouTube, I still prefer the professor's teaching in class while explaining the operation, which definitely saves a lot of time and is easy to understand. I gradually understand the history and some characteristics of text design. I was originally interested in text design, but now I have a different level of interest, including mastering the software until I can successfully create the design in my mind.


Week 4 :
I gradually became familiar with the learning mode of keeping progress in homework. I understood that although the professor was advancing the teaching of task 1, students could go back and adjust the previous steps at any time as long as the deadline had not yet arrived. Making short animations also gave me a sense of accomplishment. I modified several versions myself and then showed my process and results to the professor. The results met the professor's needs. I constantly adjusted and tried and failed during the production process, just to express the most ideal dynamic effect. I enjoyed the process.


Week 5 :
Before the class started, I completed about 12 layout designs for the professor to review. The professor was very satisfied with my special design for the title, and there were no major problems with the layout. However, the final details still needed to be processed, so I made final adjustments to my layout design based on the content of the class later. In the process of perfecting the details, I also eliminated several unworkable layout designs. In the end, the professor made the best decision based on the two options selected by the professor and three additional options.

6. FURTHER READING


IDEAS Computer Typography Basics

Computer Typography Basics - I.d.e.a.s.
  


This is an entry-level textbook on computer fonts. In addition to a concise introduction to commonly used fonts, it also provides a set of rules that can be used to review and adjust font works. I personally think that although these rules may effectively improve the reading comfort and may be repeatedly certified as effective rules over the years, there is no need to cram all the rules into the work. Designers should adjust their works based on their own purposes instead of just following the rules and then stopping. In this way, the works in the world will remain unchanged without differentiated fun.





Typography Design-Form and Communication

Typographic Design: Form and Communication, 6th Edition | Wiley

This is a reference book about the history of type design. It provides a detailed timeline that shows how typefaces evolved with the progress of civilization and key historical events. The closer we get to modern times, the more type design becomes widespread and applied to publications and entertainment products.In addition, it explains concepts like type anatomy, legibility, and so on. There are common, widely accepted principles for how to design typefaces, and ultimately, the goal is always to communicate information more effectively.With technological advancements, people have also created typefaces specifically for screens, further enhancing visual impact and even bringing typography into the realm of motion design.

For me, this book feels like a history book about typography itself. It tells the story of how our ancestors refined type design all the way to today’s era of diverse styles and creative freedom.


Comments

Post a Comment