Monday, April 5, 2021

Typography: Exercises - Task 1

30.3.2021 - 27.4.2021  (Week 1 - Week 5)
Wendy Seto / 0348805
GCD60104 Typography / Bachelor of Design (Hons) in Creative Media / Taylor's University
Task 1 / Exercises















LECTURES

Week 1: In the first weekMr. Vinod explained briefly about our module information booklet and tutored us how to create our first post on Blogger. It is pretty complicated since we all have to follow exactly the same format on writing our blogs, but I will try my best to get used to it!

We then received a quick tour through the Typography Facebook group. I think it's very well organized, we can access our class announcements, module information and lecture playlist there. 

Week 2: Today, mostly we talked about our type expressions exercise. We were splitted into breakout rooms to give a feedback to each other's sketches. Later, Mr. Shamsul took us around Adobe Illustrator to show us the basics in creating typography. I was very clueless about the software so this session is really helpful for me, so excited to learn further!

Week 3: We spent half of the session giving each other's feedback for our digital version of the type expressions exercise. This time I got both feedbacks from my classmates and Mr. Vinod himself! In the other half, we were taught how to animate our type using Adobe Illustrator and Adobe Photoshop. We also got the chance to try doing it by ourselves during the practical session, however I am still indecisive on which word should I work on. 

At the end of the class, Mr. Vinod wants us to answer anonymously how do we feel about the class and what should he and Mr. Shamsul change in the future. I said that I feel tired sitting for 4 hours straight, very straight forward hahaha.

Week 4: Mr. Shamshul and Mr. Vinod went through our blog post today and give us feedback. They said my blog is pretty good already, it does show progression and pretty much following the instructions. However, there are still some missing parts. I need to add a reflection and further reading section at the bottom of the post. Other than that, I should make a separate section for each week's feedback as well. Also, it might be better if I wrote down the date for every progression I made.

After a short break, they started to give random feedback to our type expression GIF results. Unfortunately, I didn't receive mine. But that is totally fine, I think the only thing that matters is how I feel about my own work! Actually, we did get the chance to give and receive feedback to and from each other during the breakout session. But my teammates were so shy and quiet, they kept saying "yes, yes and yes". I don't even know if they are telling the truth or not.

After the feedback session, Mr. Vinod introduced us to a new exercise. He took us around Adobe InDesign and I was like, "I am still struggling with Photoshop and Illustrator and now we are using InDesign!?" My brain is literally going through a hard time trying to memorize all these Adobe tools and shortcut keys. Wait.. I somehow turned my blog into a diary at this point.

Week 5: As usual, we started by covering up previous class exercise. The lecturers gave some feedback to random students work and then we were splitted into breakout rooms. After that, we were given a practical break to fix and improve our type formatting layout in InDesign based on the feedback we have received. Before the class ended, Mr. Vinod gave us a brief introduction to our next task. 



INSTRUCTIONS 

Module Information Booklet



TASK 1

1.1 Type Expressions

Week 1: I kept getting disconnected from ZOOM while Mr. Vinod started to talk about our task 1 so I ended up following the lecture through his Facebook LIVE. It took me awhile, so I am really hoping that I didn't miss anything important.

At the end of the class, Mr. Vinod wants us to sketch 4 out of 7 random words to practice Type Expressions. The 7 words are:

1. Slice
2. Punch
3. Spin
4. Wave
5. Scream
6. Eat
7. Point

I haven't decided which words I am going to digitalize and which typefaces I am going to use yet, so I tried to sketch all of them and see which one goes well.

fig 1.1 First sketches of the 7 words 05/04/21


I am not that satisfied with the first sketch results. Therefore, I did my second attempt on the phone. I somehow eliminated the word "punch" from the list, which now I have 6 words left. My favourite one so far is the word "point", I think I expressed it really well.

fig 1.2 Second attempt of the sketches 05/04/21


Week 2: I didn't get the chance to receive a feedback directly from the lecturer, but I did get some from my classmates. They said most of my sketches already express the word itself strong enough. Other than that, I also received a suggestion to use grey for the dot in the word "point" instead of red, because we are not allowed to use any colour other than black, white and grey. I've thought about that as well! Lastly, they said my "scream" is too common. Everyone seems to do "scream" in the similar way, so I might just eliminate it from my list. 

Moving on, it's time to digitalize them in Adobe Illustrator. I tried to install the software later during the day and so happy it is actually working! 

There are 10 Typefaces given to us to use for this exercise:

1. Bembo Std
2. ITC Garamond Std
3. Janson Text LT Std
4. Serifa Std
5. ITC New Baskerville Std
6. Univers LT Std
7. Futura Std
8. Gill Sans Std
9. Adobe Caslon Pro
10. Bodoni Std

fig 1.3 Digitalizing on Illustrator 12/04/21

I came up with these 6 types, 2 for the word "Point". I still can't decide which 4 I am going to submit though. However, let's have a quick talk about the concept behind these 6 types.

1. Scream - I wanted to eliminate it from the list but I kinda like how it turned out. The flat surface but inclined heads, I do it on purpose (wait I am not sure if I'm saying it right but hopefully you get what I mean).

2. Eat - I modified the letter "A" to a pair of chopsticks using the pen tool. I hope this is still acceptable because I didn't actually replace it with any additional graphic element,

3. Point - I have two designs for this word because I like both ever since I first made the sketches. For the one on the top, I moved the dot of the letter "i" so it touches the i and changed the colour to grey. I want to make it look like a push pin. For the bottom design, I used only the outlines of the word. Then, I added a black filled circle in the middle of the letter "o". Let's just say it was inspired by Target's logo.

4. Wave - I really really really like the wave! Quiet surprised with how it turned out, I think this is my favourite one for now hahahah. I am using the sound wave "wave" concept to express this word instead of the ocean wave "wave" like most of the other students did.

5. Slice - Really like this one as well! I created a sliced effect on the letter "I" with the pen tool. Just basically having fun with it because I just found out how to use it after all this time. 


Week 3: My classmates said that my digital type expressions are good to go but the wave might look nicer if the direction of the letter "W" and "V" is the same as the soundwaves and I think it is much better after I un-italic the word. Really thankful for their feedback! When I was screensharing my work in the breakout room, Mr. Vinod suddenly come to our room and gives me his feedback. He said I can change the typeface for the letter "E" and "T" in the word "EAT" to a slightly thiner one so it is balance with the chopsticks width. For point, Mr. Vinod said I can try to put the grey dot in the letter "i" just in the same position as the dot should have been previously. The reason I moved it in the first place is because I wanted to make it look like a pin clip. However, after I change it the way he suggested me, I think it does look good even though I actually lost the original concept. Lastly, for "SLICE", he thinks I should make the typeface thiner (same like the word "EAT"). This time I personally think that I like the previous one more, so I will just keep it the way it is. 

fig 1.4 after receiving feedback from my classmates and Mr. Vinod 13/04/21


fig 1.5 final work 13/04/21

Moving on, now I need to animate one of my type expression and make a GIF. We were taught how to do it in today's class. At first, I want to do the word "wave" but it is really hard since I have to make the direction stay still because they are connected with the letter "w". But still, I want to try doing it if I have some spare time in near future! Later, I decided to animate the word "point" since it is my favourite one ever since I first sketched it. It took me some time to duplicate the artboards in Adobe Illustrator, not gonna lie I almost gave up hahahah. Here is the final frames I have created, the blank spaces are my deleted frames. Some of them are exactly the same as the previous frame, I think there is something wrong with me when I was doing it and just realized when I have moved to Adobe Photoshop. There are 13 frames in total. I had a problem exporting the final GIF file, luckily Mr. Shamsul helped me to solve the issue. He said I might exported a too large file from Illustrator, so I went ahead and reduced the quality.


fig 1.6 my final GIF frames in Adobe Illustrator 19/04/21


fig 1.7 creating the GIF in Adobe Photoshop 19/04/21

fig 1.8 final GIF result 19/04/21

1.2 Type Formatting

Week 4: We were told to watch the 4 pre-recorded lectures about Type Formatting in the Typography YouTube Playlist. I like the way Mr. Vinod explained everything in the videos, it is very well delivered. I managed to understand everything when watching the videos but when I tried to apply it by myself later on I forgot what to do exactly. 

The first part of the exercise is practicing letter spacing; kerning and tracking. We were asked to type our name in 10 different typefaces given and apply the kerning and tracking to each.

fig 2.1 before applying the kerning and tracking 26/04/21

fig 2.2 first draft 26/04/21


fig 2.3 final kerning and tracking application 26/04/21

From the rest of the Type Formatting pre-recordered lectures, Mr. Vinod covered pretty much about line length, leading, paragraph spacing, alignment and baseline grid. We also learned how to set margins and create columns for the layout. I love minimalist designs so these are what I came up with:


fig 2.4 first text formatting attempt 26/04/21


fig 2.5 second attempt 26/04/21

fig 2.6 third attempt 26/04/21


Week 5: I submitted the third type formatting result at the next Typography class and received some feedback both from the lecturers and my classmates. The lecturers said that my line length and ragging is well done and they liked how I break the word 'Helvetica' into half but I could try to do something similar with the 'I am' as well. They also mentioned some of the mistakes I made in this exercise. First, I am not supposed to add a paragraph spacing if I have already applied indentations on the beginning of each. I guess I did not pay much attention to the part when they are explaining about this exact rule in the previous lecture. Secondly, the cross-alignment has not been established using the baseline grids. I had a misunderstanding here, I thought cross-alignment means the body text on the left and right are supposed to look 'zig-zag'. I am wondering what the problem is so I re-watch the pre-recorded lecture and realize that both body texts should have been in the same line. Last one, I didn't place any images on the layout so they were not sure if I know how to do it. Should have submitted my second attempt then hahahah. Overall, my classmates said pretty much the same thing. Later during the practical break, I tried to improve my type formatting based on the feedbacks I received earlier.

fig 2.7 first draft after receiving feedback 27/04/21

fig 2.8 preview in InDesign since we cannot really see the white space on the blog post 27/04/21

fig 2.9 final type formatting layout 27/04/21

fig 2.10 another InDesign preview 27/04/21

type formatting layout in PDF
 

I really like how the final layout turned out, I think it is aesthetically pleasing to the eye. However, I am not sure what my lecturers will think about it. Lets just hope they are going to approve this and I didn't miss anything important.



FEEDBACK

Here is the summarize feedback I received from each week.

Week 1: It is our first class so there is no feedback given yet.

Week 2: I didn't get any feedback from the lecturers but I did get some from my classmates, they said most of my sketches already express the word itself strong enough. They also gave me one or two suggestions on how to improve my work.

Week 3: Mr. Vinod told me to try change some of the typefaces I am using. My classmates gave me more suggestions on what I can improve. 

Week 4: The lecturers went through my blog today and said that my blog is pretty good already, it does show progressions and follow the instructions. However, I need to write the reflection and further reading 
section as well. Also, they prefer a separate section for feedback. To be honest, it is more relatable to write the feedback together with the progress in my opinion. But, rules are rules, so I am sorry if there are repetitions here and there. For my GIF, I wish I received one or two words from them.

Week 5: Mr. Shamsul and Mr. Vinod said my type formatting exercise has some mistakes and missing element that I have to take care of. However, my ragging has been well controlled and the overall line-length is good to go.



REFLECTION

I think I have learnt a lot in my first month of my study in Taylor's University, especially from this class. I got to know and use the basic tools in Adobe Illustrator like I have always wanted to. I can't say that I have fully understand everything but I do feel like I have learnt a lot of new things, such as how to modify texts in Illustrator, create GIFs in Photoshop and make layout in InDesign. I believe that this will be really useful in the future and I am willing to give more try on this exercises to see how I improved from time to time. So far, I still can cope with all the lectures and assignments given, hopefully can do better in future projects (more to can survive actually lol).



FURTHER READING

I have heard about the word "typeface" before, but never really find out what it actually is. In this semester of class, the lecturers want us to use the 10 typefaces they have given to do all of our work. So I started wondering what a typeface is. Turns out, what I have known as fonts all this time are actually typefaces.


For our first exercise, we have to understand how to show emotion in our work. So I decided to read some articles about it to be able to express it well.

No comments:

Post a Comment