Information Design - Final Project
Ruchira Nowreen || 0347111
Major: Bachelor of Software Engineering || Minor: Creative Media Design
|| Taylor's University
Information Design GCD 60504 || Section 2
Week 1 - Week 7 || 05/02/24 - 29/03/24
Final Project: Animated Infographics
Group 2
TABLE OF CONTENTS
Final Project: Animated Infographics
Task
- Week 1
- Week 2
- Week 3 - 4
- Week 5 - 7
- Week 8
- Working Process (My Part)
- Part by Part Animated Videos
- Final Outcome
Figure 1: Module Information
LECTURE
In the first week of our module, our lecturers presented us with a
comprehensive lecture and provided detailed briefings on all the
tasks we will be undertaking throughout the course. They outlined
the objectives, expectations, and timelines for each task, ensuring
that we have a clear understanding of the requirements and how to
approach them. This initial briefing was crucial in setting the
foundation for our learning journey, helping us to organize our time
effectively and prepare for the upcoming challenges.
Figure 2: Lecture Slide - Exercise & Assignment brief
FINAL PROJECT: ANIMATED INFOGRAPHICS
Project Overview
For the final project, we were instructed to select one topic from the
four provided options. Then, we were required to conduct research on the
chosen topic in our group and break down the information into parts for
a narrative and visualization to educate viewers about the issue. We
were asked to incorporate questions like 'What, why, where, when, who,
and how' into our narrative before transferring the information onto our
storyboard.
Our expected outcome is an animated infographic informing the audience
about the given topic in a 1.5 to 3 minutes video. The infographic must
include some form of data or statistics and must use the questioning
technique to provide answers.
Group Overview
I am a member of group 2, along with Chen Xian Ning, Kim Abin, Kek Han
Shin, and Areeya Foo Xue Ting, making us a group of five. Our group was
highly effective and successful due to our strong teamwork and
collaboration. Each member brought unique skills and perspectives to the
project, allowing us to approach challenges from various angles and
develop comprehensive solutions. We maintained open communication
channels, ensuring that everyone was on the same page and able to
contribute effectively. Additionally, we were proactive in addressing
issues and managing our time efficiently, which enabled us to meet
deadlines and deliver high-quality work. Our use of WhatsApp as a
communication platform further enhanced our collaboration, enabling
quick updates, discussions, and decision-making regardless of our
physical locations. Overall, our group's cohesion, communication, and
commitment to the project were key factors in its success.
TASK
WEEK 1
TOPIC 3: THE IMPACT OF SOCIAL MEDIA ON SOCIETY
We chose "Topic 3: The Impact of Social Media on Society" due to its
relevance and significance in today's world. Social media has become an
integral part of daily life for many, influencing how people communicate,
share information, and perceive the world around them. We were intrigued
by the potential positive effects of social media, such as enabling
connections across the globe and providing a platform for diverse voices.
However, we were also concerned about its negative impacts, including
issues related to mental health, privacy, and the spread of
misinformation. We believe that exploring this topic will not only enhance
our understanding of the role of social media in society but also raise
awareness about its effects and encourage critical thinking about its
usage.
RESEARCH
In week 1, we began our project by conducting research on the chosen
topic to gain a deeper and more comprehensive understanding.
Figure 3: Research on 'The Impact of Social Media on Society' - pdf
TASK DISTRIBUTION
Next, we distributed the tasks equally among ourselves. Below, I will
display our task distribution document.
Figure 4: Task distribution - pdf
VISUAL REFERENCES
We also conducted visual research by watching infographic videos on YouTube
to get an idea of the direction we were heading in. Below, I will attach the
videos that initially inspired us.
Figure 5: Visual Reference #1
Figure 6: Visual Reference #2
WEEK 2:
SCRIPT BREAKDOWN
In week 2, each team member wrote detailed scripts for their respective
parts. These scripts included assumptions about timing and dialogues for the
animation, aiming to facilitate easy breakdown and the working process.
Below, I present our initial script breakdown. However, due to the time
constraint of the animated video being a maximum of 3 minutes, we couldn't
continue with this elaborated script.
Figure 7: Initial Script Breakdown - pdf
We created another summarized version of the script and finalized it to
fit our timeline. While it wasn't possible to follow the scripts exactly,
breaking them down helped organize the work more effectively. Below is the
final breakdown of our script.
Figure 8: Final Script Breakdown - pdf
During this week, we also finalized our visual style by creating two
mood boards on Miro. These boards served as a hub for collecting our
ideas and design inspirations, helping us solidify our approach for the
project.
|
| Figure 9: Initial moodboard on Miro |
|
|
Figure 10: Summarized moodboard on Miro |
Next, we completed our storyboard, including sketches, scenes, and
script. Abin primarily contributed to most of the sketches for the
project, but I had to make some changes and include my sketches for the
parts that needed correction in the script, as discussed under weeks 3-4.
This preparation phase ensured that we had a clear direction and vision
for our project before moving forward with the
illustrations. However, this storyboard was not the final version for
our animation. In week 3, we had to make some adjustments to the sketches
and scenes, adding some elements and deleting others to improve the
overall flow and clarity of the animation. Below is the initial storyboard done on week 2.
Figure 11: Initial Storyboard Google Slides
WEEK 3 - WEEK 4
In week 3, we dedicated our efforts to modifying and finalizing our
storyboard frames/sketches. This step was crucial as it laid the
foundation for our entire project. We carefully reviewed each scene,
making necessary adjustments to ensure that the storyboard accurately
reflected our vision for the animation. This process involved adding new
elements, refining existing scenes, and deleting any unnecessary parts. By
the end of the week, we had a finalized storyboard that served as a
detailed roadmap for our asset illustration phase, providing us with a
clear direction and ensuring that everyone in the team was on the same
page. Here, I have replaced some of Abin's sketches for the previously
decided scenes with my new sketches for my part (negative impacts) to
match my modified script. The slide below presents our finalized
storyboard frames.
Figure 12: Finalized Storyboard Google Slides
In week 4, our focus shifted entirely to the illustration of assets using
Adobe Illustrator. This stage was critical as it involved bringing our
storyboard to life visually. Each team member worked diligently on their
assigned assets, paying close attention to detail to ensure that the
illustrations aligned with the overall visual style and moodboard we had
previously established. This phase required creativity, precision, and a
keen eye for design to create high-quality illustrations that would later
be animated. Despite the challenges, we remained committed to producing
the best possible work, knowing that the illustrations were the foundation
of our animation project. The slide below showcases the assets
illustrated by each team member individually.
Figure 13: Illustration Assets Google Slides
WEEK 5 - WEEK 7
From week 5 to 7, we dedicated our time to animating our project.
Since none of us were experts in animation, it took us a
considerable amount of time to learn and apply the techniques
effectively. Each team member used different platforms for
animation; some used Adobe After Effects, some used Premiere Pro,
and others used Adobe Animate. Personally, I used Adobe Animate and
Canva for my part. Below, I have attached a Google Slide presenting
animated items and process screenshots from each team member.
Figure 14: Animation Assets Google Slides
WEEK 8 (EXTENDED WEEK)
In week 8, five of us uploaded our individual animated videos along with
sound effects and voiceover to the group's Google Drive for the
final compilation. For the final compilation, Areeya used Adobe Premiere
Pro. After the compilation, Xian added subtitles using Clipchamp.
Lastly, I made some adjustments and corrections to the final video to
ensure consistency and added background music (BGM Link) using Clipchamp. Below, I have attached a Google Slide showing
screenshots of the working process for week 8.
Figure 15: Final Compilation Google Slides
WORKING PROCESS (MY PART)
In this section, I will delve into the detailed process of developing my
segment of the animation, which centered around the subtopic of the "Negative Impacts of Social Media."
In my segment of the script, I focused on two key subtopics: depression
and addiction. These themes were essential as they highlighted some of
the most significant negative impacts of social media on mental health
and well-being. Here is a glimpse of the content I covered in the
section below.
|
| Figure 16: Script for Negative Impacts of Social Media |
I began by illustrating the graphics for each frame and organizing them into separate Illustrator files. Each element was placed on its own layer to facilitate part-by-part animations. Below, I will display the different illustrations I created.
|
| Figure 17: Overall asset illustrations using Adobe Illustrator |
|
| Figure 18: Separated illustrator file for 'Depression' |
|
| Figure 19: Layer separation for 'Depression' |
|
| Figure 20: Separated illustrator file for 'Addiction' |
|
|
Figure 21: Layer separation for 'Addiction' |
After separating the illustration files, I decided to continue my
part-by-part animations using Adobe Animate. For animating in
Adobe Illustrator, I didn't have much knowledge or experience as I
had only used it once for my Project 2. So, I watched animation
tutorials using Adobe Animate on YouTube. Below, I will attach a
video that helped me the most.
After watching a few tutorials, I began animating my part using
Adobe Animate. Below, I will showcase the animation layout for
each step.
|
|
Figure 23: 'Depression' Layout on Adobe Animate |
|
|
Figure 24: 'Addiction' Layout on Adobe Animate |
Next, following the approach I used in my Project 2, I chose to
use Canva for the rest of the video compilation. Mr. Fauzi had
liked my Project 2 work and advised me to stick to the idea of
using Adobe Animate with Canva for ease in animation. Canva
provided the functionality I required to combine the animations
seamlessly into a slideshow format. Its intuitive interface and
diverse range of features made it well-suited for this task.
With Canva, I could easily arrange and synchronize the
animations to create a polished and professional-looking
slideshow presentation.
|
|
Figure 25: Slide compilation using Canva |
|
| Figure 26: Animation of Instagram scene using Canva |
|
|
Figure 27: Animation of Pie Chart using Canva |
With the video compilation complete, I focused on
enhancing it with sound effects. While Canva allows the
addition of one soundtrack, I aimed to incorporate
additional sound effects alongside the voiceover, which
was already recorded by my teammate Areeya, to enrich
the audio experience. To accomplish this, I turned to
another user-friendly web application called Clipchamp.
Clipchamp provided the necessary tools to seamlessly
integrate various sound effects into the video,
complementing the visuals and enhancing overall
engagement.
|
|
Figure 28: Adding sound effects + voiceover
using Clipchamp |
PART BY PART ANIMATED VIDEOS
In this section, I will showcase the individual animated parts created
by each of us. With five members in our group, we divided the video into
five parts. Each member scripted, illustrated, animated, and compiled
their part individually before we uploaded them to our Google Drive.
Additionally, we added the sound effects and voiceovers for each of our
parts individually.
INTRODUCTION (by Areeya)
Figure 29: Animated Video Part 1
GROWTH & INFLUENCE (by Hanshin)
Figure 30: Animated Video Part 2
POSITIVE IMPACT (by Abin)
Figure 31: Animated Video Part 3
NEGATIVE IMPACT (by Ruchira)
Figure 32: Animated Video Part 4
CONCLUSION (by Xianning)
Figure 33: Animated Video Part 5
FINAL OUTCOME
After compiling all the individual animated parts using Premiere Pro and
adding subtitles and background music with Clipchamp, our final animation on
"The Impact of Social Media on Society" was completed. Following the module
instructions, I uploaded the video on YouTube upon completion. Here is the
link to our completed animated video:
Figure 34: Final Animated Infographics - Group 2
After presenting our final animated infographics to Mr. Fauzi for his final
review and feedback, he expressed his approval, indicating that everything
was good.
FEEDBACK
WEEK 5
- Prioritize information over animation complexity.
- Keep the animation simple; focus on the script first.
- Use After Effects or preferred animation apps.
WEEK 6
- Combine animations in Premiere Pro for convenience.
- You may also use Adobe Animate + Canva for a smooth outcome like you did in your Project 2.
- Include text along with graphics in the video.
- Add all three, voice-over, sound effects, and background music, for better grades.
WEEK 7
- Include subtitles.
WEEK 8
- Everything looks good, you may submit.
REFLECTIONS
Working on the final project, focusing on the negative impacts of
social media, was a challenging yet rewarding experience. It allowed
me to apply and further develop my skills in animation, graphic
design, and storytelling. Collaborating with my group members was a
highlight of the project, as we all brought different strengths and
perspectives to the table. This diversity enriched our discussions and
decision-making processes, leading to a more comprehensive and
impactful final product.
One of the key observations from this project was the power of visual
storytelling in conveying complex ideas. By combining animation,
graphics, and narrative, we were able to create a compelling narrative
that effectively communicated the negative impacts of social media.
Additionally, I observed the importance of time management and
communication in a group project. Regular updates and discussions
ensured that everyone was on the same page and that we could address
any issues or challenges promptly.
Through our research and creative process, we uncovered several key
findings regarding the negative impacts of social media. We found that
excessive social media use can lead to feelings of isolation,
depression, and low self-esteem. Additionally, we discovered that
social media addiction is a real phenomenon, with many people
experiencing compulsive behaviors related to their social media use.
These findings highlighted the need for greater awareness and
education around responsible social media usage.
Overall, working on this project was a valuable learning experience
that allowed me to hone my skills, collaborate effectively with
others, and gain a deeper understanding of the impact of social media
on society.
Comments
Post a Comment