INFORMATION DESIGN | PROJECT 1 & 2: ANIMATED INFOGRAPHIC POSTER

 21/10/25 -  24/11/25 - (Week 6 - Week 10)

Information Design / Bachelor in Design (Hons) in Creative Media / Taylor's University

Shubashini a/p Subramaniam, (0367697)


Table of Content :

1. Lectures

2. Module Information Booklet

3. Task 

4. Reflection


Lectures :

Week 


Module Information Booklet (MIB) :


Task : 

After time exploring media and learning about information design, you will now develop an infographic that presents a series of different processes as visuals rather than text.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:

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
 


Part 1 : Infographic Poster 20%

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

First, I chose a bad infographic poster to redesign :


I felt like this poster was bad because :

1. Poor Information Hierarchy

  • The title, subtitles, and body text are all close in size and style.
    → It’s hard for the viewer to tell what to read first or what’s most important.

  • “What is matcha?”, “The Fun Facts”, and “How do I prepare it?” compete visually instead of guiding the eye naturally down the page.

2. Cluttered Layout

  • Text boxes are scattered unevenly and the poster feels visually heavy in the middle.

  • There’s too much text for a poster — it reads more like a pamphlet or article.

3. Inconsistent Typography

  • There are multiple fonts and inconsistent capitalization (e.g., “How do i prepare it?” — lowercase “i”).

  • The mix of serif and sans-serif styles is not balanced, creating a slightly messy appearance.

4. Weak Color Contrast

  • The green text boxes blend too much with the beige background, making it hard to read from afar.

  • Orange and dark green compete for attention.

 5. Poor Visual Balance

  • The illustrations (matcha leaves, powder) are placed randomly and don’t support the information flow.

  • Empty spaces and crowded areas make the composition uneven.

6. Lack of Focus / LATCH Problem

If applying the LATCH principle (Location, Alphabet, Time, Category, Hierarchy):

  • The information is not organized by Category or Hierarchy clearly.

  • “Fun facts” and “Preparation” could be better grouped with visual dividers or numbered steps.


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

I decided to create a mood board and sketch on how my redesign and take on the poster would be :

                                 

 

First Poster Creation :


3. Redesign and simplify the poster based on visual hierarchy & typography (5 Marks)
4. Simplify the poster's design based on colour, shape & pattern (5 Marks)

Sir mentioned my initial poster had too still too much information and looked like it was 2 posters combined into one due to the difference in shades. He told me to pick one part of the poster and expand it and create a much more simple flow of the design.


I created three variations of the poster to see which one sir would like after following all his instructions and previous feedback. He told he preferred the first one as it looks more bright and approachable and he liked the design of the object next to the wording. Thus, I proceeded with that option and refined it.

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


PDF Version :

Rationale : 

This poster is designed to feel calm and inviting, using soft greens and friendly illustrations to show how matcha is made in a simple, approachable way. Each icon, the whisk, sieve, kettle, and tea bowl helps guide the viewer through the process without overwhelming them, while the rising steam naturally leads the eye from the steps at the top down to the final bowl at the bottom. I organised the information using the LATCH method so everything feels easy to follow: the steps flow by location, the matcha grades are grouped by category, the quality chart uses hierarchy to show high to low, and clear labelling adds a light touch of alphabetical structure. Altogether, the poster aims to teach, guide, and visually comfort at the same time.


Part 2 : Minimal Animated Infographic 20%

1. Animate your infographic poster into one static loop animation page
2. Loop duration in between 15 - 30 second

After consulting with sir about how I should go for my animated poster, I wanted to have matcha poring sequence in the side of the page. He said he agreed with the idea but he would prefer if I added little animation on the objects in my poster as  a guider for the viewer on the order of reading. I followed through and proceeded to do just that.



Youtube Trial Video Link : https://www.youtube.com/shorts/vNtIE62n2ko

3. Size: 1080 x 1920 px (Vertical Video) upload to your own Youtube channel 

Next I had to follow the guidelines for the sizing, I found that I needed to create a blank space above and below the poster to create an unblocked view in Youtube Shorts and had to adjust the design, which wasn't too hard and the loop needed to be at least 15 seconds.


Reflection :

In working on this matcha poster project, I grew in both confidence and clarity. I initially struggled to simplify the matcha process and decide what information was necessary, but reflecting on my blog helped me refine my choices. I adjusted my layout, colours, and illustrations to create a calmer, more focused design that matches the nature of matcha preparation. Using the LATCH method taught me how structure can make information easier to understand, especially through grouping, flow, and hierarchy. Through multiple revisions of icons, typography, and visual flow, I realised how small design choices, like the rising steam or the placement of tools, shape the viewer’s experience. Overall, the project showed me that effective information design is about balancing clarity with aesthetic intention.

Comments

Popular Posts