Information Design — Project 2

Information Design — Project 2


INFORMATION DESIGN

2/2/2026 - 22/3/2026| Week 01 - Week 7

LONG BOJIANG/ 0375362 / Bachelor of Design (Honours) in Creative Media

Information Design / Taylor's University

 

Table of Content :


INSTRUCTIONS

PROJECT 2 

·EXERCISE 3 :KINETIC TYPOGRAPHIC

·EXERCISE 4 :BAR CHART

·EXERCISE 5 :VECTOR ANIMATION

REFLECTION

 INSTRUCTIONS

 

PROJECT 2 

EXERCISE 3 :KINETIC TYPOGRAPHIC

Project 2’s kinetic typography was a group effort—our main task was to use After Effects to create a lyrics video, putting into practice the text animation skills we’d learned.

At first, we picked the song “I GOTTA HAVE YOU” by The Weepies, thinking it would work well. But after checking in with Mr. Kannan, he suggested we switch to a faster-paced song to better showcase our animation skills. We took his advice and settled on Meghan Trainor’s “ME TOO”—its upbeat rhythm was perfect for translating into dynamic text animations, which made the project more engaging.


Fig 2.1The first lyric


My lyrics

Ow!
Who's that sexy thing l see over there?
That's me, standin' in the mirror
What's that icy thing hanging 'round my neck?
Um, that's gold, show me some respect, oh

I partially completed it by drawing on some examples from YouTube in order to achieve a better result.

Fig 2.2 Verse Animation Processing

Next, I’ll create animation effects for this long lyric section, which happens to be the opening of the song. So I intentionally didn’t use overly striking effects and kept the overall style minimalistic. I designed it this way to create a contrast with the upcoming climax, making the visual impact of the later climax stand out more. For the production, I adopted a form where the lyrics appear slowly in layers, with the rhythm strictly matching the duration of the song beat for beat. I also incorporated animation effects like rotation, gradient, scaling and distortion to add more visual layers.

Fig 2.3 Verse Animation Processing
Fig 2.4 Verse Animation Processing

Exercise 3 Final outcome

 


Exercise 4: Animation Charts (10%)

 This exercise taught us to animate various data charts in After Effects, like pie charts, bar charts and line graphs—all to use motion graphics for clearer info presentation and more engaging data visualization.

Each of us got a specific letter matching a chart type to recreate, and I was assigned the bar chart. I followed the tutorial to make it in After Effects, animating it with keyframes so the data would pop up gradually, making it way easier for viewers to follow and understand.
For my bar chart, I used data on college students’ overall stress levels. I animated the bars to rise up from the baseline, which visually showed the different stress levels among students. This animation highlighted the category differences and made the data more dynamic and visually appealing. Through this exercise, I mastered using shapes, timing and keyframe animation in After Effects to turn static data into a clear, engaging motion infographic.



Fig 3.0 Donut chart 

Based on the lecture content of Week 3 by the teacher, I made a Bar chart.


Fig 3.1 Donut chart 

Exercise 4 Final outcome

 

Exercise 5: Vector Animation (10%)

In this exercise, I explored the basic principles of vector animation by transforming static vector graphics into dynamic motion using Adobe After Effects. The goal was to understand how simple visual elements can be animated to create more engaging and visually appealing outcomes.

Vector animation is commonly applied in motion graphics, advertising, and digital content due to its clean appearance and flexibility. Since vector graphics are resolution-independent, they can be scaled to different sizes without losing quality, making them highly effective for professional design projects.

Throughout this process, I learned how movement can improve visual communication. Even subtle changes, such as adjusting position, scale, or opacity, can influence how the audience understands and experiences the content. This exercise also helped me begin thinking about important animation concepts like timing, pacing, and visual flow.

To start the project, I first obtained the animation file assigned to me under Category A, which served as the foundation for developing my animation.

Fig 3.2 Vector Animation Illustration

I will layer the positions of the animations to be created. I plan to use the animations of the car and these two people for vector animations.

Fig 3.3 Group the icons
When creating in AE, adding animations, my idea is that it should come from the left side. The actions of the two main characters are as follows: the man should make his hand with the thumb up move up and down, while the woman should move the sign left and right, and lift her legs.


Fig 3.4 After Effect Process

Exercise 5 Final Animation

 

REFLECTION

Experience

Across the three exercises—kinetic typography, animated charts, and vector animation—I developed a stronger understanding of how motion can improve visual communication. Each task required both technical skills in Adobe After Effects and thoughtful design decisions.

In Exercise 3, I focused on animating typography in sync with music, which made me consider rhythm, timing, and emotion. Matching text with audio was challenging at first and required multiple adjustments to achieve a smooth and natural flow.

In Exercise 4, the focus shifted to information design. Creating a Donut chart helped me understand how motion can enhance clarity rather than just visual appeal. I paid more attention to hierarchy, readability, and controlled timing.

In Exercise 5, I brought static vector illustrations to life by adding subtle movements such as floating and small car animations. This process also required better layer organization and anchor point control. Overall, these exercises improved my confidence and understanding of motion as part of design.


Observation

I realized that effective animation is not about using excessive movement, but about applying motion with purpose. In kinetic typography, overly complex effects could distract from the message, while simpler animations made the content clearer. Timing played an important role in guiding attention.

For the animated chart, clarity was the priority. Step-by-step animation helped present data more effectively, and visual hierarchy and colour made the information easier to understand.

In vector animation, I observed that small details matter. Subtle movements created a more natural and engaging result, while proper layer setup and anchor points improved both workflow and final quality.


Findings

These exercises showed me that planning is essential in motion design. Having a clear concept and timing before starting makes the process more efficient.

I also learned that different animation types serve different purposes: kinetic typography focuses on emotion, animated charts emphasize clarity, and vector animation combines creativity with technical control.

Most importantly, mastering the basics—such as keyframes, timing, easing, and layer organization—is crucial. These fundamentals are the foundation for more advanced work, and I aim to continue improving them to create more effective and meaningful animations.


Comments

Popular posts from this blog

Advanced Typography-task2

Advanced Typography-1