Hanif Rashid (0333455)
Typography and Hypertextuality
Exercise
Lecture Notes
Week 1
Our lecture start off as Mr. Vinod introduce himself and mention that another of our typography lecturer is on medical leave which is Mr. Shamsul. Then he ask us to join the typography and hypertextuality at Facebook and afterward we were ask to create a eportfolio using Blogspot as platform. It is compulsory for all of us to create and document all of our work progress in the correct format guide.
He roughly show us few good example of eporfolio from previous semester student and ask the classes to refer the blog for guide. After the initial step is completed, started to show us the module outline and show us a few example of previous semester assignment. Which is to do a calligraphy writing. But before we all start doing the calligraphy writing, me must do the fundamental of it which is Horizontal, Vertical lines and a Circle.
 |
| Figure 1.1 samples work from previous semester. |
In addition to the eporfolio, he then told us to make a folder to document every process of work that have anything related to manual process into 1 folder and again there's a guideline to the porfolio folder. Before he end the class, he told us to borrow any books from the library. It will be better if the books is design studies related, read it and document it on eporfolio.
Week 2
For this week class, the 1st part of the lecture is a summary of typography history. Definition of typography is basically a is essentially the style and appearance of printer matter. Typography can be a method to deliver a message, organizing and decorated. One of the important point that Mr. Vinod mention is during the old era before type machine existed, good writing indicate a good education and only wealthy people can afford a book due to expensive value. The reason is during that era books are created from a manual hand written thus the expansive value and only the wealthy people can afford it.
Here's 3 Terminology of typography :
- Font - individual style of font (HelveticaWorld-Italic, HelveticaWorld-Bold)
- Typeface : Family of Font (Helvetica, Georgia, Times)
- Typefamily : different type of weight inside a typeface (Arno Pro, Arno Pro Caption)
Week 3
There's no lecture for this week.
Week 4
We start our class by Mr.Vinod give us a brief of basic typography into 3 section which is :
- Describing letterforms
- The font
- Comparing typefaces
- M (em) is the widest letter form, hence is been used as typographic measurements.
- Ligature in typography, a ligature occurs where two or more graphemes or letters are joined as a single glyph.
- Expert Set, a typical expert set might contain small caps, oldstyle figures, and a full set of f-ligatures. Only Georgia have Expert Set.
- Georgia font is only used for Screen which means only to be view on electronic device.
- Italic is basically a font that try to mimic a hand writing. The font is Serif.
- Oblique is another mimic hand writing but for Sans-serif.
- Force line Breaker symbol.
Work Processes
Exercise 1 - Week 1 - (Calligraphy 1)
Requirements:
- A4 size graph paper and white blank paper
- 3.0 Calligraphic pen
- Portfolio A4
- Name, Student ID, Date label on every paper.
 |
| figure 2.1 Left Horizontal, horizontal, Vertical and Circle |
 |
| Figure 2.2 Horizontal Line |
 |
| Figure 2.3 Vertical Lines |
 |
| Figure 2.4 Circle |
 |
| Figure 2.5 Correction for Horizontal, Vertical and Circle |
 |
| Figure 2.6 From top, Horizontal, Circle and Vertical |
 |
| Figure 2.7 From top Vertical and Circle |
For the 2nd exercise, after the Horizontal, Vertical and Circle line we were move to writing an alphabet from A-Z and a few lines of any quotes in Calligraphy using the Calligraphy hand that we choose and my personal choice is Blackletter from Ward Dunham's.
 |
| Figure 3.1 one of the work by Ward Dunham;s |
 |
| Figure 3.2 |
 |
| Figure 3.3 |
 |
| Figure 3.4 |
 |
| Figure 3.5 |
 |
| Figure 3.6 |
 |
| Figure 3.7 |
 |
| Figure 3.8 |
 |
| Figure 3.9 |
 |
| Figure 3.10 |
 |
| 2nd attempt of Alphabet A-Z |
 |
| Tester sheet |
 |
| letter A,B,C |
 |
| letter D,E,F |
 |
| letter G,H,I |
 |
| letter J,K,L |
 |
| letter M,N,O |
 |
| letter P,Q,R |
 |
| letter P,Q,R |
 |
| letter S,T,U |
 |
| letter V,W,X |
 |
| letter Y,Z |
 |
| Final 1.1 |
 |
| Final 1.2 |
Requirements:
For the 3rd week exercise, we were required to make a font using our name or nickname and expressed the font to represent our self in animated version GIF. For my name, i went with the 4th choice which is my name is been used as a shooting target. The reason behind this idea is my loved towards First-person Shooter. Playing FPS is a way for me to relieve and unwind myself from the stress.
 |
| A variety of idea representing my name 'HANIF'. The proceed is with the marking in red. |
 |
| refined sketches idea from the 4th Choice. |
After Finalized the idea from sketch, we need to transfer the sketch to digitized using software Adobe Illustrator and Animate it on Adobe Photoshop.
 |
| Digitized version on Adobe Illustrator. |
 |
| Final digitalized font. |
 |
| Timeline for the animated GIF using Illustrator Artboard. |
After finish process using Illustrator, next step is to animated the font using Adobe Photoshop frame to frame using the artboard and created GIF.
 |
| Animated Process using Adobe Photoshop Timeline |
 | ||
| Final HANIF Logotype with animated. |
The Final output with animated GIF, Hanif logo type represent the font used as target shooting. Reference First-person Shooter.
Exercise 4 - Week 4 - (Type Expression for 6 Lettering)
Requirements:
For this week exercise we were required to express this 6 words using only typography. The words are :
- Jumbo
- Noisy
- Crooked
- Hollow
- Deep
- Dig
 |
| Fig 3.1 1st attempt express the 6 Lettering. |
After a few rounds of critic and comment by Mr. Vinod and Mr. Shamsul, i did produce 2nd draft and some of the word express the meaning of the words, but Mr. Vinod ask me to re-work on the certain words such as Jumbo, Deep and Dig.
 |
| Fig 3.2 Second round after comment from Mr. Vinod and Mr. Shamsul. |
And finally after tweaking base on the comment and critic, i came up with the 3rd draft. It's not perfect as word Deep and Dig is basically mimic other's student. But in the end the word that i proceed is the word Jumbo.
 |
| Fig. 3.3 The 3rd outcome after go trough critic and comments. |
As for the 1st draft of animation, the idea behind it is was the word Jumbo expanding all together fill up the space as it mimicking a balloon. But i realized this idea is not really convincing the word JUMBO as this animation is more represent and expressing the words expanding.
 |
| 1st version Animation Artboard process. |
 |
| Fig 3.4 The word Jumbo expanding mimicking a Balloon. |
I came up with the 2nd version of animation the word Jumbo which is represent a big slow movement such as Elephant passing trough.
 |
| 2nd version of Artboard process. |
 |
| Fig 3.5 2nd version of gif version word Jumbo |
Feedback
Week 1 :
First all the Vertical, Horizontal and Circle lines exercise are in the incorrect format thus Mr. Vinod ask me to do correction for all 3 but only used 1 sheet of paper and divide the section by 3 rows. Secondly the way i hold the calligraphy pen is wrong, it should be tilt 45 degree angle referring to my selected calligraphy hands. And finally let a little pressure off from pen the as i put too much pressure especially on the Circle exercise. Mr. Vinod happy with my Horizontal correction but ask me to practice more on the Vertical and Circle correction. It's tough to do but Mr. Vinod emphasize it is important to keep practicing.
Week 2 :
For Caligraphy feedback is to improve more on the lettering size, control the stroke especially vertical line and control on the pen pressure. Mr. Vinod ask me to practice more since i didn't succeed the lettering especially the size of the letter. Overall Mr. Vinod say good effort even though he didn't yet satisfy with the work.
For Lettering exercise, Mr. Vinod told me to make the font simple and make the animation standout. During the process, i decided to use more Photoshop to make the animation not on illustrator due to my timetable conflicted. Mr. Vinod told me the purpose of this exercise is to solve problem on that particular software not find a shortcut on other parties but did manage to finish the exercise and show to Mr. Vinod before i leave the class, and he satisfy with the final output ''Awesome''
Week 3 :
For 6 Lettering feedback, my JUMBO, CROOKED, HOLLOW, DEEP and DIG need to re-work again as is not represent the meaning of the words. Only Letter NOISY is acceptable and still need to developed more. Another specific comment is try to used the space accordingly, play out the space carefully. After the 2nd attempt and go trough rounds of comment and critics with Mr. Vinod and Mr. Shamsul, Mr. Shamsul recommend me to choose Jumbo, and i finaly decide to choose Jumbo and after animated the words, Mr. Vinod told me to develop more on the animated part as is not convincing.
Week 4 :
1. All my typography photo is over expose partially. Mr. Vinod ask me to retake all the photo. I need to distance a little bit from the windows as it will creates softer exposure.
2. If we didn't have lecture given by a lecturer, i should state on the blog that there's no lecture on that week and only put an instruction was given.
3. Need to properly label the image, make it friendly as possible and properly spacing the context.
4. Write a feedback on every exercise and reflection.
5. I need to take out the Final Submission 1st as this section gonna used during final semester.
for Portfolio - Print out the final for Name Lettering and Type Expression.
Reflection
Throughout the 4 week of Exercise, it had show me how an eye-opener Typography subject is from the basic modern type to the fundamental of typeface and especially calligraphy. The in-depth of how massive the topic of typography is quite impressive for me and i believe i need a proper more than 4 weeks to understand truly the fundamental of typography.
Book of the Week
 |
| What is Typography by David Jury |
Comments
Post a Comment