Typography: Week #1 Exercises

25.08.2020 - 22.09.2020 (Week 1 - Week 5)
Seerat Tayyab Mukhtar Qureshi - 0345576 (BDCM)
Typography
Task 1 Exercises

Week #1 

---

1. Lectures

Lecture 0: Introduction

In our first lecture our lecturers Mr. Vinod and Mr. Shamsul taught us how to make our e-portfolios on blogger.com to keep track of our progress and some of the basics of Adobe Illustrator. We were then introduced to the basics of typography and our first task which would be text expression. 

Lecture 1: Development/timeline

We looked at the history of typography from the perspective of the western world. The first form of writing was scratching into wet clay using chisels and sticks. The tools we use to create the typography have a heavy influence on how the text turns out. 

The Greeks then invented a new way of writing known as the Boustrophedon writing style.

Fig 1: Boustrophedon writing style
SOURCE: Lecture

This meant that they didn't only change the writing style, they changed the letter orientation. You would have to read from left to right and then right to left. 

As time went on, letters started to develop more. 

Fig 1.1: Early letter development
SOURCE: Lecture

Square capitals were used by the Romans from the 3rd Century to the 10th. These can be found in their monuments. 

Fig 1.2: Square capitals
SOURCE: Lecture

A compressed version of Square capitals, known as Rustic capitals was used in the late 3rd to mid 4th century. These were used to fit more words onto a parchment and took less time to write. 

Fig 1.3: Rustic capitals
SOURCE: Lecture

These capitals however were reserved for documents of some intended performance. For everyday transactions cursive was used. Some origins of lowercase letters can be seen as a result of writing fast. 

Fig 1.4: Cursive
SOURCE: Lecture

The Uncials had elements of capital and lowercase integrated into them. Half uncials marked the beginning of formal lowercase letterforms. 

Fig 1.5: Half Uncials
SOURCE: Lecture

Charlemagne ordered for the standardisations of all writing systems. Eventually they were variations in the writing style of people across all the regions. Gutenberg marshalled the creation of pages that mimicked the work of the scribes hand. He developed the modern printing press. 
 
Onwards from then, there were various developments of various typefaces. Some modern day typefaces are named after their creators to pay homage to them. 

Textype development:

1450: Blackletter

1475: Old styles

1500: Italics

1550: Script

1750: Transitional 

1775: Modern

1825: Square serif

1900: Sans serif

1990: Serif

Lecture 2: Describing letterforms

Learning about terminology used in typography. 

Fig 1.6: Describing letterforms
SOURCE: Lecture

Stroke: Any line that defines the basic letterform

Apex/vertex: Point creating by joining two vertical stems

Arms: Short strokes extending from the stem of the letterform

Ascenders: Strokes that exceed the median line

Barb: Half serif finish on some curved strokes

Fig 1.7: The bowl
SOURCE: Lecture

Descender: Anything below the baseline

Ligature: The character formed by the combination of two or more letterforms

Stress: The orientation of the letter, determined by thin strokes in round forms

Then Mr. Vinod moved onto typefaces and type families.

Fig 1.8: Categories within a type family
SOURCE: Lecture

---

2. Instructions

Module Information Booklet

---

Exercises

Task #1

We were introduced to the module and the basic functions of Adobe Illustrator. Our first task is to use a set of words and visualise what they convey using different typefaces. My chosen words were; bang, bloom, twirl and tired. The first step was to sketch out my ideas. 

Fig 1: Sketching out my ideas

Using Adobe Illustrator

Turning the sketches into visuals in Adobe Illustrator. 

Fig 1.1: My first draft of the task
SOURCE: Screenshot from Adobe Illustrator


Fig 1.2: My revised draft after feedback from Mr. Vinod and Mr. Shamsul

In my second draft I also used a new tool Mr. Shamsul taught us which was the Type on a Path tool in Ai. I used it for both bang and bloom. 

Fig 1.3: Final piece as a JPEG

Task #2

In our next task, we had to animate one of our chosen text expressions. We needed to animate it frame by frame so I decided to sketch out my ideas first. I chose to do twirl because it's the one I received the best feedback on from my lecturers. 

My idea was for each of the letters to appear one by one in a twirling formation.

 

Fig 1.4: Each frame of my GIF

Fig 1.5: Final GIF made in Photoshop

After feedback from my lecturers, I decided to improve my GIF by adding more movement to it. 

Fig 1.6: Revised GIF

This GIF had a lot more frames than the previous one and took almost double the amount of time. However, I do like this one more as there is more movement to it. 

Task #3

The task for this week was doing text formatting on InDesign. We had to create a few examples of business cards and letterheads whilst following a tutorial by Mr. Vinod. This task was to help us to get to know InDesign better and learn about working with the margins and guides. I used Futura because it's a simple and I think it represents me the best as I like things neat and clean. 

Fig 1.7: Creating custom guides and margins in InDesign

After completing the tutorial, the final result is attached below.

Fig 1.8: Final work done in InDesign

Fig 1.9: Final work, JPEG

In class, Mr. Vinod asked us to make an attempt at cross alignment.

Fig 2.0: Trying to cross align title and text

Fig 2.1: Successful cross alignment

Fig 2.2: Final work

Fig 2.3: Final work, JPEG

Our next task was to format a long body of text using what we learnt from this lecture. We picked an article from Kreatif Beats and had to format it using InDesign. 

Fig 2.4: My grids in InDesign

Fig 2.5: My final formatted text

Fig 2.6: Final work, JPEG

3. Feedback: 

W1: Not much feedback given since we did not submit any work. 

W2: Feedback given on our text expression task. Mr. Vinod and Mr. Shamsul advised me to alter some of my design so they fit their meaning better. My bloom was a little simple and relied too much on a graphical element. 

W3: I received feedback on my text expression GIF task. Mr. Vinod said it was a bit too simple and required a little bit more movement. He suggested I experiment around with the letters W and R and move them a bit more to add some more movement. 

W4: Mr. Vinod reviewed some of our cross alignment attempts and advised us on how to proceed. 

4. Reflections:

W1: I found the idea of looking at typography through a different more visual lens quite exciting. I haven't used Adobe Illustrator before so this task was a bit challenging but a good learning experience. I genuinely look forward to learning more about how words and their visuals effect their perception. 

W2: I learnt a little bit about how sometimes the ideas that are clear in my head might not be as clear to others so I need to work on clarity in my work. This has encouraged me to look at my work a little bit more critically but I have to balance it as to not over do it and start being too picky. 

W3: The pressure of assignments is starting to set in and I have to start putting in a lot more work and effort into this module. I've realised that even though typography appears simple it requires a lot of creative thinking and critical analysis.

W4: Using InDesign was a bit of a daunting task and it took me a very ling time to format the text and I had to rewatch Mr. Vinod's lecture again and again. Eventually I think I did an okay job, however, I realised I made a beginner's mistake by using justify all for my first InDesign task. I fixed it and also learnt that it is not recommended to do that. 

5. Further Reading:

Fig 1.3: Just My Type by Simon Garfield