Information Design / Flip Class
04.02.26 - 22.03.26 (Week 1-7)
PAN RUINING (0378138)
INFORMATION DESIGN / Bachelor of Design (Honours) in Creative Media
FLIP CLASS
CONTENT LIST
LECTURES
WEEK 1 (4/2/2026):
In first class, Mr. Kannan introduced the exercises and assignment
brief. We were arranged into groups, and I am one of the members in the
Pink Group of Group A.
We were assigned a group exercise and asked to prepare a presentation
on "What is Infographic?" within an hour, and some groups presented
their presentations.
Below are our group's presentation slides:
The next exercise is an individual task:
- Exercise 1: Quantify & Visualize Data
- Exercise 2: Re-design a poorly constructed infographic using a free online tools
WEEK 2 (9/2/2026):
Today in class, we created a slideshow in groups comparing "Bad
infographic vs Good infographic" and presented it after 30 minutes. We
also discussed Project 2, deciding which song to choose for our
kinetic typography animation. Afterwards, sir uploaded an After
Effects tutorial for us to learn.
Below are our group's presentation slides:
WEEK 2 (11/2/2026):
Today, Mr. Cannan demonstrated how to create kinetic typography using
Adobe After Effects, explaining the basic process of animating text,
controlling timing, and creating movement. He also shared examples of
previous students' work, helping us to reference and understand
different styles. Then, we worked in groups to create slides on the
"LATCH Principle" and explain how to organize information in a clear
and structured way.
Below are our group's presentation slides:
WEEK 3 (16/2/2026):
In today's class, Mr. Kannan taught us about motion graphic animation
for charts, demonstrating how to use After Effects to design a static
chart. Then, we started to do our Project 2 exercise 2.
Below are lecture slides:
WEEK 4 (23/2/2026):
Today, Mr. Kannan taught us about "Vector/Character Animation". We do
an exercise of a simple vector animation using Adobe Illustration
& After Effects.
Below are lecture slides:
WEEK 4 (25/2/2026):
In today's lecture, sir explained Miller's Law, which states that
human short-term memory can typically hold 7 ± 2 pieces of information
at a time. After that, we were given half an hour to work in groups to
create slides demonstrating how to apply Miller's Law to different
situations, and then we presented our findings in groups.
Below are our group's presentation slides:
Then, we were assigned to do our Project 1: Instructable Poster.
WEEK 5 (4/3/2026):
Today, sir explained "Manuel Lima's 9 Directives Manifesto" to us,
and then gave us an hour to work in groups to complete and present a
slide about "Manuel Lima's 9 Directives Manifesto".
Below are our group's presentation slides:
WEEK 6 (9/3/2026):
This week we have consultation with Mr. Kannon on our project.
WEEK 7 (16/3/2026):
Last week we continued to have consultation with Mr. Kannon for our final project and he gave us feedback.
INSTRUCTION
PRACTICES
Week 1: Infographic Redesign Project
Re-design one poorly constructed infographic poster with CANVA, post
it in blog.
I chose a poster about Dog Brain Games” as the subject for the
redesign.
Fig 1.1 Poster of "Dog Brain Games"
The reasons why I choose this poster:
1. Confused information hierarchy
- Title is clear, but other content lacks priority
- Reading order is unclear
- Icons and text are crowded together
2. Excessive information & poor readability
- Too much text in each section
- Not suitable for quick understanding
- Tight spacing makes layout look cluttered
3. No clear visual narrative
- No arrows or numbering to guide reading
- Flow from “why → how → safety” is unclear
- Key steps and safety info not highlighted
FINAL REDESIGN POSTER
Fig 1.2 Final redesign poster
Week 4: Vector Animation Exercise
Steps:
- Separate different characters layers in AI (1920x1080)
- Import "composition" into After Effects
- Add keyframes in timeline (Position, scale, rotation)
- Adjust anchor point for scale
- Apply motion blur & Easy Ease
- Create "Palm" layer > Parent "palm" layer to "man stand"
- Adjust anchor point > "Alt" Rotation Stopwatch > Wiggle (0.5,20)
- Puppet position pin tool > Pin the woman
FINAL OUTCOME
Fig 2.1 Final outcome
REFLECTION
Experiences:
This semester, I learned many new things in class. In almost every lesson, we were required to present the knowledge we learned in the form of group slides and presentations. This approach helped us understand the concepts more thoroughly through examples, and it also trained us to complete slides and presentations within a short period of time.
I learned a great deal about different design principles and how they are applied in practice. For example, I learned about the LATCH principle, Miller’s Law, and Manuel Lima’s nine design principles. During the Week 4 class exercise, sir guided us step by step on how to separate downloaded layers in AI and then use them in AE to create animations. There were some difficulties during the process, but sir was very patient and helped us check the problems one by one. Through this experience, I realized the importance of understanding layer organization. If the AI file is messy, the animation process will also become confusing. Overall, I still found the process very interesting and enjoyable.
Observation:
I observed that when designing an infographic poster, it is not always about making it look very aesthetically pleasing. More importantly, the information should be presented in a clear and understandable way, with a simple and comfortable layout for the viewer. If the data and charts are messy and disorganized, the key points cannot be highlighted, which results in a failed design.
In addition, before creating an animation, all the layers should be properly organized and categorized. Otherwise, it will become difficult to manage during the post-production process, and some elements or materials may be easily overlooked.
Findings:
I found that the LATCH principle is an essential guideline when designing an infographic poster. If it is not followed, the content can easily appear messy and difficult to understand. And also for both static and dynamic information design, it is important to spend time thinking about and organizing the content before starting the design, so that the information can be presented more effectively.
Comments
Post a Comment