Leader: Mary Grace Borras
Instructor:
Mr. John Isidro J.
Members:
Antic
Gabriel Florentino
Naden Althea E.
Shanley Espaldon
BACKGROUND DESIGN AND
COMPOSITION
Presented By: Naden Althea A. Eustaquio
Course/Section: BSIE-ICT 2A
MOTIVATIONAL
ACTIVITY:
INSTRUCTION:
I will show you jumbled letters related to background
design and composition.
Unscramble the letters to form the correct word!
DRGUBKCAON
BACKGROUND
INTIPOSOMCO
COMPOSITION
RCOLO
COLOR
CTRSPEPEVI
PERSPECTIVE
TXERUTE
TEXTURE
OBJECTIVE
The student must be able to....
[Link] the key principles of background design and
composition in animation.
[Link] the importance of well-designed backgrounds in
enhancing the storytelling experience.
[Link] and compose a visually appealing background that fits
the theme and mood of an animation scene.
INTRODUCTION
Background design and composition are
important parts of the animation and post-
production process. It sets the mood, supports
the story, and brings life to the scenes. A well-
designed background helps the audience focus
on the characters and actions without being
distracted, while composition ensures that
everything looks balanced and appealing on
screen.
WHAT IS BACKGROUND
DESIGN AND
COMPOSITION?
In 2D animation, background design refers to the creation of the
scenery or environment where the animation takes place. It includes
designing elements like landscapes, rooms, or any other setting that
helps establish the location and mood of the scene. Background artists
use colors, textures, and perspective to create depth and make the
world feel believable.
Composition, on the other hand, is how all the visual elements
(characters, objects, backgrounds) are arranged within the frame. It
focuses on the balance, positioning, and flow of the image. Good
composition helps guide the viewer’s eye to important parts of the
scene and ensures that the animation looks cohesive.
KEY PRINCIPLES OF
BACKGROUND DESIGN AND
COMPOSITION
PERSPECTIVE
Perspective helps create the illusion of
depth in a scene, making it look more
realistic and dynamic.
COLOR THEORY
Color is used to set the mood or emotion
of a scene, contributing to the overall
tone of the animation.
COMPOSITION
Composition refers to the arrangement
of elements within the frame to create
the right focus and balance, guiding the
viewer's attention effectively.
LIGHTING AND SHADOWS
Lighting and shadows are used to add
realistic effects and depth to the scene,
making the environment more three-
dimensional and immersive.
DETAILS AND TEXTURE
Details and textures enhance the visual
richness of the scene, giving it depth and
making the environment feel more
believable and engaging.
VISUAL HIERARCHY
Visual hierarchy helps to direct the viewer’s
attention to important parts of the scene,
ensuring that the main focus is clear.
FRAMING
Framing is used to direct the focus of the
viewer and support the action or story,
ensuring that key elements are highlighted
while the background complements the
scene.
ASSIGNMENT
Answer the following questions in your own words. Be sure to
provide explanations and examples to support your answers:
[Link] is background design important in animation, and how
does it enhance the storytelling?
[Link] does the composition of a scene in animation affect the
viewer's focus and overall visual experience?
REFERENCE
How to make background for 2D animation Stories - EP.
COMPOSITION. (n.d.). [Video]. CLIP STUDIO TIPS. [Link]
[Link]/en-us/articles/9227
Wilson, C. (2025, April 8). The role of background in art composition.
Chris Wilson. [Link]
Perhiniak, S. (2021, March 16). Composition Techniques & Design
Principles for graphic Designers. Yes I’m a Designer.
[Link]
techniques/#:~:text=Key%20Term%20%3A%20Compositions%20(also%
20referred,elements%20on%20a%20blank%20page.
THANK
YOU
INGOUDE COMPANY
LIGHTING
AND COLOR
GRADING
Presenter:
Florentino, Gabriel Raz.
LESSON OBJECTIVES
At the end of this lesson the learners are able to:
1. Define the lighting and color grading
2. Identify how often is lighting and color grading is use in animating.
3. Study the differences of lighting and color grading in using it.
MOTIVATION
(Words Behind the Pictures)
Instruction:
Read the sentence and observe the pictures above to
identify what word is behind in the pictures.
It is an attribute of visual perception in which a source
appears to be radiating/reflecting light.
Brightness
It is the difference between two or more elements
that makes them stand out from each other.
Contrast
It refers to its intensity of the color and
lightness of how dark or light the color is.
Saturation
It refers to a smooth, gradual transition
between two or more colors.
Gradient
INTRODUCTION
In 2D animation post-production, lighting and
color grading are crucial for achieving the
desired visual style and mood. Lighting is often
simulated through layering and color grading,
while color grading involves adjusting colors,
brightness, contrast, saturation and gradient
to create a consistent and impactful look.
LIGHTING IN
POST
PRODUCTION
Source and Direction
In 2D animation, post-production is the
phase where all the elements come
together to create the final product.
This stage involves several critical
processes that ensure the animation is
polished and ready for distribution.
ProRealTech+3
Shading and Highlights
In 2D animation post-production,
shading and highlights are pivotal in
enhancing visual depth, mood, and
realism. These elements are
meticulously crafted to guide the
viewer's attention and evoke specific
emotional responses.
Ambient Lighting
In 2D animation post-production,
ambient lighting plays a crucial role in
establishing the overall mood, depth,
and realism of a scene. Unlike direct
lighting, which highlights specific
areas, ambient lighting provides a soft,
non-directional illumination that fills
the scene evenly. This technique is
essential for creating a cohesive
atmosphere and enhancing the
emotional tone of the animation.
COLOR GRADING
IN POST
PRODUCTION
Color Correction
In 2D animation post-production, color
correction is a critical process that
ensures visual consistency, enhances
storytelling, and aligns the animation
with its intended mood and
atmosphere.
Creative Color Effects
In 2D animation post-production,
creative color effects are pivotal in
enhancing storytelling, establishing
mood, and adding visual flair. These
effects go beyond traditional color
correction, introducing dynamic and
expressive elements that engage
viewers and convey deeper narrative
layers.
Tools and Techniques
In 2D animation post-production,
various tools and techniques are
employed to refine and enhance the
final product. These processes ensure
that the animation aligns with the
intended artistic vision and is ready for
distribution.
Layer Masks and
Keyframes
In 2D animation post-production, layer
masks and keyframes are essential
tools for refining visuals and controlling
motion. Here's an overview of each,
along with their applications and
industry-standard tools.
Final Touches
In 2D animation post-production, the
final touches are crucial for
transforming raw footage into a
polished and engaging piece. This phase
involves refining various elements to
ensure the animation is cohesive,
visually appealing, and emotionally
resonant.
Generalization
Lighting and color grading are vital post-production tools in
animation that impact how viewers perceive the world within
the story. Lighting brings the scenes to life by defining
shadows, highlights, and focal points, while color grading
provides the finishing touch by ensuring visual harmony and
emotional resonance throughout the animation. Both are
intertwined processes that, when done effectively, elevate
the entire viewing experience.
References:
What are the best techniques for color grading animation in post-production? (2023, September 15).
Katatikarn, J., & Tanzillo, M. (2015). Lighting for animation: The art of visual storytelling. CRC Press.
Qu, D. (2022). Storytelling with mood and atmosphere in visual development for animation (Master's thesis, Savannah
College of Art and Design).
CG Wire. (n.d.). Animation post-production: Definition, process & challenges. Retrieved from
Hudon, M., Pagés, R., Grogan, M., & Ondrej, J. (2018). 2D Shading for Cel Animation. Expressive 2018.
[Link]
Toxigon. (2023). Mastering Lighting Techniques in Animation. Retrieved from [Link]
techniques-in-animation
Frameboxx. (2022). Color Theory in Visual Effects Animation. Retrieved from [Link]
theory-visual-effects-animation/20227
Wikipedia contributors. (2025). Rotoscoping. Wikipedia. Retrieved from [Link]
Adobe. (n.d.). Keyframing animation | What is keyframing. Retrieved from
[Link]
Daisie Team. (2023, August 11). Perfecting Animation: 5 Final Touches Before Rendering. Daisie. Retrieved from
[Link]
Thank You for
Listening!
EXPORTING AND
RENDERING ANIMATION
By: MARY GRACE BORRAS
MOTIVATIONAL
ACTIVITY
INSTRUCTION:
I will show you jumbled letters related to background design and composition.
Unscramble the letters to form the correct word!
RDNREERE
The software or engine that processes your 3D
scene into a 2D image or video.
renderer
SPOTXE
The process of saving or outputting your
finished animation in a usable file format like
MP4, MOV, or image sequences.
export
HETGNSIT
Configurations that control how your animation is
rendered, such as resolution, frame rate, and
sampling quality.
SETTINGS
TMAEINFRO
The type of file your animation is saved as—
video (MP4, MOV) or image sequence (PNG,
EXR), which affects quality and compatibility.
FORMAT
SRNEOCLIUTO
The dimensions of your output (e.g.,
1920x1080); higher resolution means sharper
image but longer render times.
resolution
MRIFNAEG
The composition of the scene within the
camera’s view—controls what the audience
sees and how it’s visually arranged.
FRAMING
objective
The exporting and rendering animation in 2D animation
is to enable students to understand and apply the
processes involved in converting animated scenes into
final video formats. This includes optimizing file
settings, maintaining visual quality, and preparing
animations for various platforms, ensuring that the
final output meets technical and artistic standards
for presentation or distribution.
Introduction
In 2D animation, rendering and exportation are
critical phases that define the final version of an
animated work. After creating the individual frames
or illustrations, the rendering process converts them
into seamless and fluid motion by handling all the
visual elements and transitions. Exportation then
comes next, where the completed animation is saved in
a compatible file format for distribution,
presentation, or use across different digital
platforms.
What is exporting and
rendering animation
Exporting animation refers to the process
of saving or converting an animated
project into a final playable video or
file format, such as MP4 or AVI, for
sharing or distribution.
Rendering animation involves generating
the final visual output by processing all
elements like models, textures, lighting,
and effects frame by frame.
rendering
Rendering is the final stage in the
animation production process where
all the visual elements/models,
textures, lighting, motion, and
effects—are processed and converted
into a finished image or sequence of
images.
export
Exporting in 2D animation is a step in the
animation production pipeline, where all the
creative work put into animating, designing, and
composing the scenes is transformed into a final,
shareable format. The process of exporting ensures
that the animation is in the right format and
quality for its intended purpose, whether it’s for
web, television, or film.
settings
In 2D animation, settings refer to
the environment, background, and
overall visual elements that provide
context to the animated story or
[Link] process of designing
and utilizing settings effectively
plays a pivotal role in bringing the
animation to life.
format
2D animation has been a staple in the
animation industry for decades, and its
formats are integral to the production,
distribution, and presentation of
animated content. The format in which 2D
animation is created and presented plays
a significant role in the artistic
outcome and the medium's overall
effectiveness.
resolution
Resolution is a critical aspect in 2D animation,
as it determines the quality, clarity, and level
of detail in the final animated product. The
resolution essentially defines the number of
pixels that make up an image, which influences
how it appears on different screens or platforms.
Whether you're working on hand-drawn, digital, or
hybrid 2D animation, understanding resolution is
key to ensuring that the animation looks crisp
and professional.
references
text[Link]
nder/[Link]
[Link]
e: [Link]
v=zyXBy2U1txU
[Link]
effects/using/[Link]
: [Link]
for-animation
[Link]
v=zyXBy2U1txU
thank you
Project Goals
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua.
Project Goals
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua.
Virtual Instruments
and Synthesizers
Software-based instruments and synthesizers
provide a vast array of sounds and effects,
allowing musicians to experiment and create
without physical limitations.
The Rise of
Home Studios
Advances in affordable recording
equipment have made it possible for artists
to set up professional-quality studios at
home, democratizing music production.
Online Various platforms enable musicians to
collaborate remotely, sharing projects and
Collaboration ideas in real-time, regardless of
geographical location.
Tools
Artificial Intelligence
in Music Production
AI tools assist in composing, mixing,
and mastering tracks, enhancing the
creative process and providing new
possibilities for music creation.
Streaming
and Distribution
Services have changed how music is distributed
and consumed, offering global reach and instant
access to vast music libraries.
Virtual Reality and
Live Performances
VR technology is creating immersive live concert
experiences, enabling fans to attend virtual performances
and interact with artists in new ways.
Thank you for
your attention
THYNK
MUSIC
PAGE 1
MUSIC
PRESENTATION
INTRODUCTION TO
THYNK MUSIC
Welcome to Thynk Music, your gateway to a world of sound innovation and
creativity. We are passionate about crafting music that resonates with the soul,
pushing the boundaries of musical expression. Join us on this journey as we
explore the core of what makes Thynk Music unique.
PAGE 2
OUR
VISION
At Thynk Music, our vision is to create a harmonious blend of technology and
artistry. We aim to redefine how people experience music by leveraging cutting-
edge technology while preserving the human touch that makes music so
powerful.
PAGE 3
PAGE 4
THE
TEAM
Thynk Music is driven by a diverse team of
talented musicians, producers, and
technologists. Our collective experience in
the music industry, combined with our
innovative approach, allows us to produce
music that is both original and impactful.
Meet the minds behind the magic.
OUR
PAGE 5
MUSIC STYLE
Our music is a fusion of genres, blending elements
of electronic, classical, jazz, and contemporary
styles. We believe in pushing the envelope and
experimenting with sounds to create something
entirely new. Thynk Music is where tradition meets
innovation, resulting in a unique auditory
experience.
TECHNOLOGY IN
MUSIC PRODUCTION
At Thynk Music, we embrace the latest
technologies to enhance our production
process. From AI-driven composition tools to
state-of-the-art recording equipment, our use
of technology ensures that our music is of the
PAGE 6
highest quality. Discover how we integrate
tech into our creative process.
COLLABORATIONS
AND PARTNERSHIPS
Collaboration is at the heart of what we do. Thynk Music has partnered with
artists, producers, and other music companies around the globe to bring fresh
perspectives to our work. These collaborations allow us to expand our horizons
and produce music that is rich in diversity and creativity.
PAGE 7
PAGE 9
COMMUNITY
ENGAGEMENT
We believe in giving back to the community that supports us.
Thynk Music is involved in various outreach programs,
workshops, and educational initiatives to inspire the next
generation of musicians. Our community engagement efforts
reflect our dedication to nurturing talent and fostering a love for
music.
OUR
DISCOGRAPHY
Explore the catalog of Thynk Music's releases.
From our debut album to our latest singles, each PAGE 8
piece of music tells a story and reflects our
journey as a company. Our discography showcases
our evolution as artists and our commitment to
delivering high-quality music to our listeners.
FUTURE OF
THYNK MUSIC
The future is bright for Thynk Music. We are continuously exploring new
avenues for growth, including expanding our music library, enhancing our
technological capabilities, and reaching new audiences worldwide. Join us
as we shape the future of music together.
PAGE 10
FUTURE OF
THYNK MUSIC
The future is bright for Thynk Music. We are continuously exploring new
avenues for growth, including expanding our music library, enhancing our
technological capabilities, and reaching new audiences worldwide. Join us
as we shape the future of music together.
PAGE 10
Guess that
voice
You just need to
Guess that guess the voice
voice of the
cartoon/agent
it’s that easy.
01
Mickey
Mouse
01
01
SPongebob
Square
pants
01
01
Sage 01
01
Brim 01
01
Jett 01
Sound design and
voice
synchronization
What is Sound Design?
Sound design is the art and practice of creating, recording, and manipulating audio
elements to enhance the audience's experience in various media, such as films, television
shows, video games, animations, and theater productions.
The goal of sound design is to make the world of the production feel real, immersive, and
emotionally [Link] designers use various tools such as microphones, synthesizers,
audio editing software, and libraries of recorded sounds to create the perfect audio
landscape.
Good sound design is often subtle but plays a critical role in storytelling. Without it, visual
scenes can feel flat or disconnected. In interactive media like video games, sound design
also includes creating responsive audio elements that react to a player’s actions, making
the experience even more engaging.
02
What is Voice Synchronization?
Voice synchronization, often referred to as "lip synchronization" or "lip-sync," is the process
of matching recorded dialogue with the movements of a character’s mouth or an actor’s
lips.
The process ensures that when a character speaks, their mouth movements accurately
correspond to the spoken words, syllables, and emotions being [Link] dubbing, voice
actors must deliver their lines in a way that fits the timing and rhythm of the original
performance, even when translating into a different language. This requires precise editing
and often adjusting dialogue slightly to fit the mouth movements.
Voice synchronization is essential not just for realism but also for emotional expression. A
character’s tone, timing, and facial movements must all align perfectly with their voice to
create a believable performance that connects with the audience.
02
types of Sound Design
> Foley Sound
Recording real-world sounds to match actions on screen (e.g., footsteps, door creaks, cloth rustling).
> Ambience (Background Sound)
Sounds that set the environment or mood (e.g., birds chirping in a forest, cars in a city).
> Sound Effects (SFX)
Special sounds that highlight actions or events (e.g., explosions, magic spells, gunfire).
> Creature and Character Sound Creation
Inventing unique sounds for non-human characters or fantasy elements (e.g., alien roars, dragon wings).
> Musical Sound Design
Sound elements that blend with or create music (e.g., rhythmic hits, synthetic textures).
> Environmental Sound Design
Sounds that simulate how audio behaves in spaces (e.g., echo in a cave, muffled sounds through walls).
04
types of Sound Design
Lip-Syncing in Animation
> Matching a character’s mouth movements frame-by-frame to dialogue (like in Pixar or Disney
films).
Dubbing (ADR - Automated Dialogue Replacement)
> Replacing original spoken lines with new ones, often in a different language (e.g., English dub of a
Japanese anime).
Performance Capture (Mo-Cap)
> Capturing an actor’s facial expressions and syncing it with their voice to create realistic
characters (used in games like The Last of Us).
Real-Time Voice Sync
> In multiplayer games or live shows, syncing voice lines immediately to animated characters (e.g.,
live VR performances).
04
Let’s Break it all down
Sound design Voice synchronization
– It's the process of creating, recording, and
– It's matching a character’s mouth movements
manipulating audio elements for a project. (in an animation, video game, dubbed movie,
– This could be sound effects (like footsteps, etc.) with the spoken dialogue.
explosions, wind sounds), ambient – This ensures that when a character talks, their
background noises, or even specially made lips move in a way that looks natural and timed
sounds for things that don’t exist in real life perfectly to the words you hear. – It's super
(like a spaceship hum). important for making animations, cartoons, or
– Sound designers make sure that all the dubbed foreign films look believable and
non-spoken sounds you hear in movies, professional.
games, animations, or theater feel realistic
and enhance the mood or storytelling.
05
THANK
YOU!
