Information Design - Motion Graphics Practical

6 Jan 2022 - 14 Feb 2022 (Week 1 - Week 7)
Zetie Binti Bahaman / 0351297 / BDCM
Information Design
Motion Graphics - Practical

---

LECTURES & INSTRUCTIONS

Week 1
Mr. Martin gave us a brief introduction to motion graphics. This is because we will be using it in a few of our assignments, but mainly the Final Project. I am already familiar with the term so this felt like a refresher course to me. 

Fig 1.0 Lecture Notes, Week 1

I was interested in the storyboarding process. I think this step is key in the pre-production stage to before we delve into creating the scenes.

Fig 1.1 Lecture Notes, Week 1

Fig 1.2 Lecture Notes, Week 1

According to his reference, there were 6 steps to motion graphic storyboarding.

1. Creative Brief
2. Moodboard

3. Preliminary Shot List
4. Sketched Storyboard
5. Digital Storyboard
6. Animator Hand-Off


Week 2
This week we were more hands-on as Mr. Martin guided us through a series of motion graphics exercises on After Effects. He showed us some tips and tricks using the Animate button instead of manually using Scale/Position/Rotation/Opacity.

Fig 1.3 Lecture Notes, Week 2

Week 3
We learned about data visualization this week. As we all know, data can be boring and hard to digest through the basic rows and columns. One way we can present them visually is through charts, and to make things more interesting.. motion graphic charts! It's catchy and straight to the point.

Fig 1.4 Lecture Notes, Week 3

Week 4
This week, we learned about vector character animation. Mr. Martin gave us some exercises to practice our motion graphic skills. This would help us with our Sex Education animation later on.

Fig 1.5 Lecture Notes, Week 4

Week 5 - Week 8
Task progressions and consultations

---

WEEKLY TASKS

Week 1

Fig 1.6 Instructions from Lecture Notes, Week 1

Individual Task
-3 Suggested Professional Motion Graphics
We are to watch and find the animation style of videos that we want to use for our Final Project.

Video 1

  

Fig 1.7 Vagisil from OURSHACK on Vimeo

I found this video off Vimeo and found it an interesting commercial for a vagina moisturizer. The color scheme that they used was in line with the product/brand. Using a vector art character and the supporting elements through line art was interesting. It emphasizes the main character of the video and how the product benefits her. Short, simple, and straight to the point.FigX Vagisil /Intimate moisturizer from OURSHACK on Vimeo.


Video 2

Fig 1.8 Oh My Sheep on Youtube 

I picked out this video ultimately because of the catchy background music. "Oh my sheep, oh my sheep". Again, the color scheme is all using sweet pastel colors, which I think I want to incorporate in the final project. It also made the topic menstrual care more fun through the visuals and using the sheep as the main character.


Video 3

Fig 1.9 How IVF works by Ted-Ed on Youtube

I love Ted-Ed videos, they are just beautifully made and this was no exception. The animation as well as the narration was smooth. The colors that they used were suitable for the story as well as the textured graphics. This inspired me to produce something like this one day. 


Group Task
-Moodboard
We took screencaps from the videos that we have watched and compiled them together using Canva.

Fig 2.0 Moodboard

-Style Frames
The most challenging scenes that the group discussed were frames 2, 5 and 13.

Fig 2.1 Style Frames

Week 2
Individual Task

Fig 2.2 Text Animation Practice, Week 2 (11/1/2022) 

The video tutorial was longer than usual but it was a great tutorial. It was easy to follow and I learned new things. Using the Animate tool, we're able to animate in multiple ways and it is pretty flexible as long as you keep yourself organized. One of the things that were new to me was using the Enable Per Character 3D. This feature allows us to animate them as if they're 3D objects.

Group Task
- Split lyrics for text animation

Fig 2.3 Butter Lyrics Split, Week 2 (11/1/2022)

- Script Breakdown of Final Project: Sex Ed 101

Fig 2.4 Script Breakdown, Week 2 (11/1/2022)

Individual Task
-Kinetic Type Exercise: So What by P!NK

Mr. Martin showed us how to use null layers and parenting in After Effects. Here is the final outcome of the exercise.

Fig 2.5 Kinetic Type - So What Exercise,  Week 2 (13/1/2022)

Week 3
Individual Task

Fig 2.6 Line Chart Experiment in After Effects, Week 3 (20/1/2022)

This exercise was fun, I went into it thinking it would be hard. I played around and added in Wave Warp effect into the lines. I also added in a kinetic type of a looping text written 'Line Chart'.

Fig 2.7 Line Chart Motion Graphic Practice, Week 3 (20/1/2022)

Initially, I only thought of this as a practice. However, later on Mr. Martin announced that he would grade this as our Project 2: Exercise 4. This is the actual line chart motion graphic. Read up on the process here.

Fig 2.8 Project 2: Exercise 4 - Line Chart Motion Graphic

Group Task
1. Our kinetic typography music video have been finalized. The final kinetic typography to this lyric video is here.

2. Final Project Storyboarding - All sketches are uploaded on the group Google Drive here.

Week 4
Individual Task

- Vector Character Animation: (D)

This week, we learned to animate vector characters from Adobe Illustrator and animate them into After Effects. Mr. Martin has given us the vector files and we have our assigned AI files to practice on.

Fig 2.9 Separating the layers in AI

Fig 3.0 Basic Transform Properties 

Fig 3.1 Applying Null Layer

Fig 3.2 Puppet Tool

Fig 3.3 Vector Animation Practice, Week 4 (29/1/2022)

Group Task
-Final Project Animatic

Fig 3.4 Final Project: Sex Ed 101 - Animatics

Read up on the full process of our final project here.

---

REFLECTIONS

The practical exercises have been helpful for me to apply in my individual, as well as, group projects. The only thing confusing me is arranging our tasks in our respective e-portfolios. Is this a trick from the lecturers? Since all we learned about was information delivery..hence, they're expecting us to best organize the flow of each task's blogpost in the best possible way. 

Nevertheless, I have separated each blog post because my mind feels cluttered looking at them all in one blog post. It also helps me track my work for Mr. Martin's weekly tasks, and for me to track what I have practiced in more detail.