Information Design / Project 1&2: Animated Infographic Poster

2025.02.24 - 2025.03.07 Week 3 - Week 5

Teh Ming En/0364908

Information Design-Bachelor of Design (Honours) in Creative Media--Taylors University

Project 1 & 2: Animated Infographic Poster

---

Instructions

Lecture Note (Week 3-5)

Fig 1.1 Week 3 Lecture

Week 3: Miller’s Law of Memory

This lecture discusses Miller’s Law. The key ideas include:

• Short-term memory limitations: People struggle to retain more than 7 items and usually forget them within 30 seconds.
• The Paradox of Choice: Too many choices can overwhelm users, making decision-making harder.
• Refining Information: Breaking down information into smaller, manageable chunks improves retention and understanding.

Fig 1.2 Week 4 Lecture

Week 4:  Manuel Lima’s 9 Directives Manifesto

This lecture introduces Manuel Lima’s Information Visualization Manifesto, which provides 9 guiding principles for effective data visualization:

• Form Follows Function – The purpose should drive the design.
• Interactivity is Key – Allow users to explore data.
• Cite Your Source – Always disclose data origins.
• The Power of Narrative – Use storytelling to enhance understanding.
• Do Not Glorify Aesthetics – Design should enhance meaning, not just look good.
• Look for Relevancy – Ensure the visualization serves a real purpose.
• Embrace Time – Time-based data needs careful management.
• Aspire for Knowledge – Information should lead to deeper insights.
• Avoid Gratuitous Visualizations – Data visuals should filter noise, not add to it.

Week 5: Constructive Workflow

This week lecture focuses on Constructive Workflow, a structured approach to productivity and digital design thinking. The key points include:

• Thinking drives workflow: Synchronizing brain processes improves creative output.
• Balancing left and right brain: A mix of logical structure and creative freedom leads to better design.
• Understanding digital tools: Knowing how computers process information helps generate digital ideas efficiently.
• Empowering creativity: Applying structured workflows enhances productivity and expands business potential.

---

Project 1: Part 1 / Infographic Poster

After time exploring media and learning about information design, we need to develop an infographic that presents a series of different processes as visuals rather than text.

Requirements: 

We need to analyse the “delivery mechanisms” that affect the outcomes of our infographics. Though content is important, however, this presentation aims to look at what makes an infographic presentation work or does not work. 

Instructions:

1. Choose 1 infographic poster reference from the Internet (Need to consult before proceeding)
2. Redesign the poster into A4 size.
3. Redesign and simplify the poster based on visual hierarchy & typography.
4. Simplify the poster's design based on color, shape & pattern.

Fig 2.1 Initial / Original Poster

First, I searched for infographic poster on Pinterest and chose this as my reference. I will choose this poster because it looks messy and the content is unclear.

After consulting with Mr. Fauzi, I started working on redesigning the poster. 

Fig 2.2 Materials

First I collected a bunch of materials online to use in the poster.

Fig 2.3 Before Adding Materials

This is the first version of the design before putting the materials into the poster. I made the boxes and grouped the information into categories, trying to make them look neat and clear.

Fig 2.4 After Modifying

After that, I decided to leave some space around the boxes to make it look less crowded.

Fig 2.5 Adding Materials

After the modification, I put the collected materials into the poster one by one. Then, I changed some details and my poster was finished.

Fig 2.6 Final Poster

Project 2: Part 2 / Minimal Animated Infographic

Instructions:

1. Animate our infographic poster into a static loop animation page
2. Loop duration between 15-30 seconds
3. Size: 1080 x 1920 px (Vertical Video) upload to Youtube channel

After finishing the poster, I came to the second part. In this part, I needed to animate my poster. I decided to use Adobe After Effect to complete this part.

Fig 3.1 Animating the Girl with Pearl Earring

I have imported all of the layers from Illustrator to After Effects. After that, I started animating the layers. I downloaded various different images of the Girl with a Pearl Earring and here I want to make them slowly change.

Fig 3.2 Animating the Mouth

For the mouth, I want the three of them to keep repeating and changing in size, so that they look like they are opening and closing.

Fig 3.3 Animating the Heart 

Fig 3.4 HeartBeat Tutorial Video

In here, I want to make the heart beat so I search for tutorial on Youtube and learn it. It was interesting and easy for me to achieve. After that, the animation was completed.

Final Submission

Fig 4.1 Infographic Poster

Fig 4.2 Minimal Animated Infographic

Youtube Link: https://youtube.com/shorts/xYVliuOi44E

Google Drive Link: https://drive.google.com/drive/folders/1lV--6i6xMjNU2B96MIQB3j8CFHHT88fn?usp=drive_link

Feedback

Week 3: 

I can proceed with my poster and idea.

Reflection

Through this project, it gave me an insightful experience that deepened my understanding of information design. Initially, I was excited about the challenge of transforming raw information into a dynamic and structured animation. However, as the process unfolded, I realized that it was not as easy as I thought. Throughout the project, I also explored different animation techniques, experimenting with typography, icons, and visual hierarchy to guide viewers' attention effectively. This project not only improved my motion design skills but also reinforced the importance of user-friendly information presentation. I have understood how animated infographics can simplify complex messages while keeping the audience engaged.