Information design /Project 1: Animated Infographic Poster

Start from 20.2.2025

17/2/2025 - 3/3/2025 (Week 3 - Week 5)
Kong Cai Yi / 0363862 
Information Design / Bachelor of Design (Hons) in Creative Media 
Exercise 1/ Animated Infographic Poster 

---

LECTURES

Week 3/ Miller's Law

Today's lecture was about the Miller's Law. Miller's Law is a psychological theory that states the average person can hold about seven items in their short-term memory. We then watched a video to further understand the theory. (Click here for video) 

• Introduction to Miller's Law: Miller's Law establishes that the average number of discrete items or bits of information that can be held in our working memory is approximately seven, plus or minus two. This theory helps to explain the limitations of human memory and how we can better structure information for easier recall. 
• The Magical Number 7: The concept of the 'magical number 7' refers to the tendency of people to remember about seven chunks of information.
• Application in Productivity: Understanding Miller's Law can enhance productivity by encouraging the organization of information into manageable chunks, which aids memory retention and recall. This principle is applicable in areas such as content creation, data presentation, and collaborative work environments.
• Implications for Learning: Miller's research outlines strategies for educators and trainers to present information in a way that aligns with our cognitive limitations. By segmenting information into smaller, digestible units, learners can process and retain more effectively.

Fig 1.1 Miller's Law (17.2.2025 -Week 3)

Week 4/ 

Manuel Lima's 9 Directives Manifest

As usual we started off this week with a lecture followed by the FLIP presentation.

Manuel Lima's 9 Directives Manifesto:

1. Form Follows Function: The initial stages of a project should always start with a question. Make the objectives the main focus, leading to further discovery.
2. Interactivity is Key: Allows for investigation and learning through discovery.
3. Cite your Source: Always disclose where your data originated.
4. The Power of Narrative: Elaborate your information into storytelling to make it more interesting and memorable.
5. Do not Glorify Aesthetics: Aesthetics is important but it should not be too heavy-handed. We still need to focus on the purpose of the infographic itself.
6. Look for Relevancy: "Why are you visualizing the information?" Keep in check the relevance of what is being done to what the final outcome is. 
7. Embrace Time: Time management is one of the key factor to organize and achieve better results for any decision making, Set a parameter. 
8. Aspire for Knowledge: Visualization is to translate information into knowledge. Every project should make the information even easier to understand.
9. Avoid Gratuitous Visualtisation: Simplified designs are the best, don't make anything too complicated. Avoid unnecessary or uncalled for visuals.

Fig 1.2 Manuel Lima's 9 Directives Manifesto (24.2.2025 -Week 3)

Week 5/ Constructive Workflow

This week lecture is about constructive workflow, click here to access the link of constructive workflow. Adopting a Constructive Workflow can lead to more productive and creative outcomes by integrating structured methods with intuitive digital processes.

Constructive Workflow: 

• A Constructive Workflow helps align your thinking with digital tools, making work easier and more efficient.

Mind-Workflow：

• SynchronizationStructuring tasks to match natural cognitive processes.
• Reducing friction between thinking and execution.

Digital Fluency：

• Mastering digital tools to improve efficiency.
• Understanding computational logic to enhance creativity.

Balanced Cognition：

• Utilizing both analytical and creative thinking.
• Avoiding cognitive overload by optimizing workflow.

BenefitsImproved Focus: 

• Less mental strain in task management.
• Increased Creativity: Seamless transition between ideation and execution.
• Efficiency Boost: Optimized workflow reduces wasted effort.

---

INSTRUCTIONS

REQUIREMENT:

• Your main intention is to analyse the “delivery mechanism’s” that affect the outcomes of your infographics.
• Though content is important, however the aim of this presentation is too look at what makes an infographic presentation work or does not work. This includes content but only as one of the many components of an infographic:

INSTRUCTION:
PART 1: Infographic poster 
1. Choose 1 infographic poster reference from Internet (Please consult before proceed)
2. Redesign the poster into A4 size. Sketch the idea and process
3. Redesign and simplify the poster based on visual hierarchy & typography
4. Simplify the poster's design based on color, shape & pattern
5. Attach your final poster on E-Portfolio with explanation and reflective writing

PART 2: Minimal animated infographic
1. Animate your infographic poster into one static loop animation page
2. Loop duration in between 15-30 second
3. Size: 1080 x 1920 px (Vertical Video) upload to your own Youtube channel

SUBMISSION:
1. Digital upload into your Google Drive.
2. Online posts in your E-Portfolio and your reflective writing.

Part 1: Research

I found two infographic posters on Pinterest, but they contain too much information, making it hard to highlight the key points. So, I decided to redesign them with a clearer focus on how to make a strawberry cake.

Fig 2.1 Research (24.2.2025 -Week 3)

Part 1: Sketch

I found many strawberry cake tutorial posters online, but most of them felt messy and overloaded with information. I really love the art style of this theme, so I decided to redesign the poster. I started by sketching out some initial ideas.

Fig 2.2 Sketch (24.2.2025 -Week 3)

Part 1: Infographic poster progress

I separated the layers of my strawberry cake to make it easier to animate and help viewers understand the layer details more clearly.

Fig 2.3 Illustration  (3.3.2025 -Week 4)

 

Fig 2.4 Creating Poster  (3.3.2025 -Week 4)

Final Redesign Poster

• Exploded View – The layers of the cake are separated, making it easy to understand.
• Labeled Components – Each part of the cake is clearly labeled, making it informative.
• Visually Appealing – The colors and structure align with infographic design principles.
• Title Included – The title clearly states "How to Make a Strawberry Cake."

Fig 2.5 Add Info  (3.3.2025 -Week 4)

Mr. Fauzi said we all had to simplify our posters and animate them. We also had to change the size of it. I have added some watercolor ingredients element, let it be more matching with my poster style.

First Attempt

Fig 2.6 First Attempt (3.3.2025 -Week 4)

Second Attempt

Fig 2.6 Second Attempt   (3.3.2025 -Week 4)

PART 2: Minimal animated infographic

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

Fig 3.1 Progress in AE   (3.3.2025 -Week 4)

Fig 3.2 Animated Infographic (Full Version)   (7.3.2025 -Week 4)

Fig 3.3 Animated Infographic (Loop)   (7.3.2025 -Week 4)

FINAL SUBMISSION

Google Drive

Fig 3.3 Final Animated Infographic Poster  (7.3.2025 -Week 4)

 

---

REFLECTIONS

Throughout this project, I learned a lot about how to present information effectively using infographics. Initially, I found many infographic posters online, but most of them were overloaded with details, making them hard to follow. This helped me realize the importance of simplifying content while maintaining clarity and visual appeal.

For my infographic poster, I chose to redesign a "How to Make a Strawberry Cake" tutorial. I focused on breaking down the steps clearly and making the visuals more engaging. By using an exploded view, I separated the cake layers, making it easier to understand. I also labeled each component clearly and used a soft watercolor style to match the theme.

After receiving feedback from Mr. Fauzi, I simplified my design further and adjusted the layout for better readability. I also prepared the design for animation by separating the layers, which made the transition to the animated infographic smoother.

Animating my infographic was another learning experience. I had to ensure that the movement was simple yet effective, making the information easy to follow. Keeping the loop between 15-30 seconds was a challenge, but it helped me focus on the most essential parts of the tutorial.

Overall, this project taught me valuable lessons about visual hierarchy, typography, and animation in infographic design. I now understand how important it is to balance aesthetics with functionality to create an engaging and effective presentation.