Information Design: Project 1_ Animated Infographic Poster

October 30, 2025

Information Design: Project 1_ Animated Infographic Poster

October 30, 2025 -December 4, 2025

FANG YAOYUE (0372006)

Information Design | Bachelor of Design in Creative Media | Taylor's University

Project 1: Animated Infographic Poster

List

LECTURES

INSTRUCTIONS

FEEDBACK

REFLECTION

LECTURES

Week 6:

Manuel Lima's 9 Directives Manifesto

1. Form Follows Function:

The purpose should always be centeres on the explanation, which in turn leads to insight. 

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 information into storytelling to make it more interesting and memorable. 

5. Do Not Glorify Aesthetics:

"Should always be a consequence and never a goal."

6. Look for Relevancy:

Always pay attention on the reason of visualize the information.

7. Embrace Time:

Time management is one of the key factor to organize and achieve better results for any decision making.

8. Aspire for Knowledge:

"A core ability of Information Visualization is to translate information into knowledge."

9. Avoid Gratutious Visualizations:

"Should respond as a cognitive filter, an empowered lens of insight, and should never add more noise to the flow."

My Own Reflection:

Manuel Lima’s 9 Directives Manifesto offers essential principles for creating meaningful and effective information visualizations. Reflecting on these directives, I realize that successful design is not just about visual appeal, but about clarity, purpose, and knowledge creation. The idea that “form follows function” reminds me that every visual element should serve a communicative purpose rather than exist for decoration. Interactivity also plays a crucial role, allowing users to explore and learn through engagement rather than passive observation. I find the emphasis on narrative particularly inspiring — transforming data into stories makes information more relatable and memorable.

Moreover, Lima’s warning against glorifying aesthetics and using gratuitous visuals reinforces the importance of restraint and intentionality in design. A visualization should enhance understanding, not confuse the viewer with unnecessary complexity. Time management and relevance further remind me that context and timing can influence how effectively information is perceived. Ultimately, the manifesto encourages me to treat visualization as a tool for insight — to aspire for knowledge rather than mere presentation. Moving forward, I will apply these principles to ensure my designs balance beauty, clarity, and purpose, always leading the audience toward deeper understanding rather than distraction.

Week 7:

Constructive Workflow

A constructive workflow is a system that organizes tasks and processes to achieve a goal.

It is important to synchronzie our workflow and construct how our brain work. Once we understand how the computer langauge works, the idea would become digirally more generative. 

Here is some main takeways: 

1. Understand the question

Asking the right question is more important than the answer.

2. Construct a strategic plan

Evaluate data & information.

Identity pros and cons.

Create a content creation plan.

Understand your outcome.

Build case studies.

3. Fill in the blank

Create empty folders as a structure.

Fill in each folder with a progress.

Synchronzie all working files for each software requirements.

4. Get some ideas & inspiration

Explore existing ideas as a guide and reference.

Ensure we are on tracks with what we are doing.

5. Set a perimeter

Ideas are limitless.

Time is a constraint.

Identity our strengths.

Reference is just a benchmark.

Solution is the answer.

INSTRUCTIONS

PART 1: Infographic poster (20%)           

INSTRUCTION:

1. Choose 1 infographic poster design (that is not well design) from Internet

2. Redesign the poster into A4 size. Sketch the idea and process (5 Marks)

3. Redesign and simplify the poster based on visual hierarchy & typography (5 Marks)

4. Simplify the poster's design based on color, shape & pattern (5 Marks)

5. Attach your final poster on E-Portfolio with explanation and reflective writing (5 Marks)

PART 2: Minimal animated infographic (20%)

INSTRUCTION:

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

The following are the assignment requirements:

1. Select one infographic poster from the internet as a reference.

2. Redesign it to A4 size. Draw a sketch and document the process.

3. Re-design and simplify the poster based on visual hierarchy and layout.

Further simplify the poster design based on colors, shapes and patterns.

4. Attach the final poster to the electronic portfolio and include an explanation and reflective writing.

Reference / Sketch

As the second part requires the creation of animated posters, I have been looking for something more "dynamic" rather than static. What came to mind were deconstructed elements and interesting one-way loop animations.

Fig 1.1 Reference 1

Fig 1.2 Reference 2

Fig 1.3 Reference 3

Fig 1.4 sketch 1

Fig 1.5 sketch 2

Fig 1.6 sketch 3

The first poster I think is quite perfect. But I can make Batman more interesting based on this design. Since he is static, I plan to make him the main subject of the picture and make him move.

The second poster, in my opinion, has the advantage of comprehensive information organization, but it makes the readers feel bored. Its focus is mainly on the organization of the information. I think the information can be reduced and made more concise, and there should be more Lego elements in the pictures.

The third poster, in my view, has too little information and the colors are too bright. The Lego figure on the right steals the visual center, causing the public's vision to be biased to the right. I think the visual center should still be in the middle for it to be better.

Summary: I will take the first poster as the main reference object, combine the advantages of the three posters, and discard the disadvantages to create a Lego Batman poster that belongs to me.

Fig 1.7 Infographic poster

Compared to the previous posters, I think this one is more concise in terms of information and easier to understand. I incorporated more Batman elements and strengthened the contrast to create a more powerful visual impact.

And I have listed all the important characters in the Batman series and provided brief introductions for them, which compensates for the incomplete characters in the case poster.

Introduction to the inspiration and details of the poster：

This poster is an introductory poster centered around "The LEGO Batman Movie". The overall design combines the Lego brick style with the visual elements of the Batman universe.

I chose black and red as the main colors for the poster. In the center, there is a Batman logo and a Batman figure.

The left half is mainly in black, representing the "dark knight" aspect. The right half is based on red, symbolizing crisis, battle and the intensity of emotions.

The lower left part shows the Lego models of several main characters. The English paragraph in the upper right corner summarizes the opening plot of the movie. Through the dotted lines marking the years, it shows the chronological order of several Lego Batman-related animations or movies. 

This part explains the continuation and development of the Lego Batman series, not just as a single movie, but as a part of the entire "Lego DC Universe". 

This poster is not only a tribute to the spirit of Batman,but also a perfect showcase of Lego's creativity and humorous style.

Poster improvement：

First of all, I need to find more reference posters.

Fig 1.8 Reference poster

Fig 1.9 Reference poster

Fig 1.10Reference poster

Fig 1.1 Final Minimal Infographic Poster

After viewing the reference poster presented by Mr. Fauzi, my goal became clearer. Since I was also designing a poster for timeline information organization, I sorted out the entire timeline of the poster and studied the three reference posters above as a reference. I have completed my final poster.

Minimal animated infographic：

Minimal animated infographic

This is the improved animation I made. I shortened the duration and adjusted the size to 1080x1920. The animation time was reduced from 29 seconds to 16 seconds, and the text changed along with the animation and timeline.

Final Minimal animated infographic

INFOGRAPHIC POSTER - ANIMATION - LINK

https://youtu.be/sSdIIRivWyA

FEEDBACK

Week 6

This week, I discussed some Lego inspirations with Mr. Fauzi, and I drew a sketch for my final project. I can also find some materials online because if I had to draw everything by myself, it would be very time-consuming. I think if I can find good materials, I will use them. But if I can't, I will still choose to draw it myself. I am very grateful to Mr. Fauzi for his suggestions.

Week 7

This week, I met Mr. Fauzi shared his thoughts on the final assignment. He felt there were no issues and that I could proceed with creating my storyboard and also prepare for the upcoming poster task.

Week 8

There are no classes this week.

Week 9

This week, I discussed my poster design with Mr. Fauzi. He thought my animation was very interesting and unique. However, he requested that I create a new poster that is cleaner and neater. The theme color of the poster should not be too many. It would be better if I could find more references. I can keep this part of the design and include it in my portfolio. Then, I will also present an improved version.

Week 10

Mr. Fauzi informed me that there were no issues with my UI and poster design. However, I need to make it more animated. My timeline needs to change along with the visuals, and I need to request adjustments to the size and shorten the duration.

REFLECTION

During the production of this information design poster animation, I focused on the theme of "The History of Lego Timeline Development" and completed the integrated tasks from data collection, visual presentation to dynamic design. This entire process enabled me to have a deeper understanding of the core of information design: not only is it about conveying information, but also about making the information more readable, understandable, and memorable. 

Firstly, during the initial data collection stage, I need to break down the complex Lego history materials into key milestones, such as the brand's inception, the transition from wooden toys to plastic building blocks, the introduction of the patented building system, and the emergence of theme series. How to condense a large amount of content into a clear timeline is the first major challenge in information design. This process taught me how to determine which information must be retained and which needs to be deleted in order to maintain the smoothness of the narrative. 

During the layout design stage, I followed Mr. Fauzi's advice and replaced the complex black and red color scheme with a simple black, white, and gray color scheme. In the animation production stage, I transformed the poster content into a dynamic narrative. This process allowed me to understand the role of animation in information design - it can emphasize key points, establish a viewing sequence, and enable viewers to understand the content according to the path I have set. For example, I used a gradual appearance method to display the timeline nodes, allowing viewers to naturally understand the evolution of Lego as time progresses.

Finally, through this project, I realized that excellent information design requires constantly finding a balance among content, form, and rhythm. Information design is not simply layout; it is a new form of artistic expression. I am grateful to Mr. Fauzi for his guidance.