principle and law of design
principle of design
1. balance
making two object alighn to each other in terms of ( size , hight , positition, color ,
brightenss , contrast , texture , ), this gives felling of confortabilty , stable , easy
to to look at
how to achive in editing
when adding text in your frame , always alighn them horizontaly or verticly
when making motion graphics , avoid adding to much movement or animation
in one side , try to add a same amount of movement in both eyes to control
veiwrs focus
how to verify this principle
Always ask yourself: “Does one side feel heavier than the other?”
If yes, adjust placement, size, or spacing to bring balance.
Example
two circle show below
balance
principle and law of design 1
unbalance
2. Contrast
making things pop by ( color , size, shape , texture , font , light/dark ) , like adding
big white text on dark black backround , it will direct viwers eye to text cause it
principle and law of design 2
has contrast
if there is 4 black circle and 1 white circle in centre the all the focus of viwer
will go on white circle
if there is 1 big text and 2 small text then the focus of viwer will go on big text
how to achive in editing
make title pop with high color or size
make shape pop by making speed deffernt of main object in animation
how to verify
Contrast creates visual interest. If everything looks the same, nothing stands out.
contrast
no contrast
principle and law of design 3
3. hierarchy
hierarcy is about arranging elements to guid viwers eyes from most important to
least important
it helps diracting viwers eye
it enhance the story in direction
how to creart hierarchy
Size: Bigger = more important.
Color: Brighter or more vibrant colors pull attention.
Position: Top or center usually feels more important.
Weight: Bold or thick fonts feel stronger.
Spacing: More breathing room around something makes it feel special.
Motion (in video): Moving elements draw attention first.
principle and law of design 4
how to use in editing
main text should be large then supporting text
( important ) subtitle is complimentry and supporting part so it should be small
yet visible ( you can make it more visible by adding drop shadow , little zoom )
in talking head your subjects face should be in centre and elements , logo,
icons should be in left or right with medium contrast so that they support the
story and not dominate the story
in motion graohics - cta like ( subscribe ) should stand out and draw attension
in fram ( you can do that by making everything excluding subscribe blur or
dark
how to use in thumbnale
Your main face or object = biggest.
Important keywords = large, bold text.
Secondary text or small elements = smaller size.
without hierarchy
your viwers get confuse where to look and where to focus , results in bad
retension
how to remeber hierachy
Always decide: "What do I want the viewer to notice FIRST?"
Design everything else to support that.
hierarchy
principle and law of design 5
no hierachy
4. alignment
principle and law of design 6
it is about arranging element in reation to ech other , so they feel visualy
connected , organised , and structed ,
it gives a sense of organization and professionalism
why it is important
it looks clean , balanced and complete
when elemnets are randomly placed in looks like ( unprofessional , messy ,
hard to read and incomplete )
You can align elements to:
Left edge
Right edge
Center
Top or bottom
All elements on a screen should “line up” with each other — even if they’re far
apart — so they feel part of one system.
in video editing
align text boxes , icons and logos
if there are 5 points in video the align them horizontly or verticaly
When adding lower thirds (nameplates), align them consistently across
different shots.
but if the story demand not aligned elements then follow the story
in thumbnale
Align text with face or objects.
Avoid scattering text at random angles unless done intentionally for style.
principle and law of design 7
tools to help alighning
grid
snaping
alighing feature in prmier pro and photoshop
you can use square mask in davinci to alighn the because there is no aligh
button in davinci
without alignment
Your design feels disorganized.
Even good contrast or hierarchy fails if things are floating randomly.
how to remeber it
Every element should have a visual connection to something else
for refrenvce
principle and law of design 8
5. proxymity
it means placing related objects like ( all the circle in frame ) closer to each other
which forms a group which help viwer understand which is part of group and
which is not
it gives feeling of stable and understadable
without it
wihthout this your frame will feels unprofessional, confusing , and scatered
viwers get confuse about relation between each element
you cant explain about multiple eliments at same time
in video editing
there are so many examles like ( group the name , discription and picture of a
man ) which create this feeling that these these three things are refering to 1
group )
principle and law of design 9
in thumbnale
Don’t scatter text all over the image.
Keep text near the related object or face.
Avoid putting the headline far from the subject’s face — this creates confusion.
how to remeber it
If elements belong together, put them close together.
6. Repetition
like it sounds , use same or similar elements multipple times throuout frames , in
simple words try to keep your ( main text , backround , theme ) colors , fonts and
design same in whole project
it create strong sense of structure brand identiry and visual and rythem .
it helps your audience to feel famielier with your style
principle and law of design 10
withou repetition your audience feel random disconnected and random
how it works
repeat fonts , colors, shapes styles , theme and animation style across your
projects
and IT DOEST MEAN EXACT DUPLICATION
repating similar icons style , text style , colors and transition makes your video
more polished and easthetic
in video editing
use similar lower thirds , and title animation across all projects
1 transition from a roll to b roll and 1 transition from a roll to motion graphics
keep the same grading and theme across video to feel connected
consistent sound effects and music style
in thumbnale
Same font style across multiple thumbnails.
Consistent color palette or background style.
Use signature props, facial expressions, or logo placement.
In Branding (very important for freelancers like you):
In Branding (very important for freelancers
like you):
Repetition builds recognition. If viewers see repeated visual elements, they
start identifying your style.
principle and law of design 11
without repetion
every frame feels different and it will make the video messy
the audience doest connect to yiur brand idenityt and content style
how to remeber it
Consistency builds trust. Repetition creates familiarity.
7. white space
white space can be defign as the open space between around desigh or
element
it doest mean unusedd or open space
eit allow elements to get proper attension
why is it imp
it improve readabilty
makes desighn more clean , elegant and professional
principle and law of design 12
it also feel premiumness , luxary and important
how it works
add little space between each character ( only suttle but depends on story )
space between line
margin around text box
only add one text in whole frame ( and all the focus will be on that text )
in editing
dont overcrowd and dont affraid of white space
also in strytelling- a pause between each line or a sudden silence ( no music ,
no sfx just vocals ( or just silence ) it helps viwer to process everythings )
when designing frames ( animated ) leave margin space around the edge
psychological
it feels ppremium and professional
principle and law of design 13
how to remeber
Less is often more. Give your elements room to breathe
8. unity
every element in your design or fram feels like it belongs to each other or they
have some kind of similarity in theme , colors , style
it create a sense or harmony
why it matters
it feels more professional , intensional and memeorable
it also make a sense of team , brand and trust
how it works
principle and law of design 14
using same font family , icon style , color pallete and animation stye acroos
videos
matching shadow , elighment , shapes that are similar to each other
it include ( repetiton + alighment + balance )
in video editing
keep lower thirds , transition and effects styled same throught video
use consistent color grading
use similar animation style ( like same animatio graph for all icon )
in thumbnale
Use the same fonts, color combos, and layout styles across all thumbnails.
Include signature graphic elements that tie your visuals back to your personal
or channel brand.
Unity ensures viewers start recognizing your style subconsciously, helping
build brand recall.
without it
frames feel disconnected
feels mismatched
no relatibility
how to remember it
Make everything feel like it belongs to the same story or family.
principle and law of design 15
8. movement
visual strategy that guids your viwers focus throug layout
creating a flow and rythem that tells a story
without it
design feels static , lifeless and doest draw focus
how to create movement
leading lines - arrows , curves , diagonals that directs the eyes to main object
repetition & rythem - pattersn and reapting elements spaced evenly can guid
the viwers eye across design in a flowwww
contrast and hierarchy - use size and colors to shift focus
white space - use white space to draw focus to tward main object
principle and law of design 16
blur, overlay & layering - bluring the backround or bluring the objects you dont
want focus but need to keep them as complimentry objects
types of movement
static - this is comman in image and layout - leading lines or overlapng guids
the the focus of eye
dynamic movement - transition , typography , paralax scroll - animation
psychological impact
fast , sharp build excitement , energy , urgency
slow , smooth flow feels calm , refind , trustworthy and prmiuim
video editing
use keyframes with easing and graphs and try to recreate how real world
physics works
apply parallax effect to creat depth ( its just like if you have a fram of mountain
then add some tree, birds, and nature stuf in 3d environment ( and with little
blur ) you will see how your stock footage is now looking real world experince
principle and law of design 17
9. proportion
proportion in desighn is about relation between elements in terms of size ,
position and color to creat a rythem for human eye to focus
it gives feeling of direction and rythem which enhanvce the story
why it matters
the human eye is naturaly gets calm from element that stand out and give a
direction of focus
when properties are well done , they creat hierarchy , clarity and visual
harmony and calm focus
how it works
principle and law of design 18
size and relationships - make the element , text or object larger if they are
important , and smaler and suttle blend into backround if they are supporting
elemenet
context & expectation - designs rely on what veiwers expect , for example , an
unusually large object among small ones creat emphasis and surprise( can be
used to introduce new character or element , mainly to draw whole focus from
whole frame to one object )
visual weight - a bold or dense element with sutle drop shadow with little glow
feels more heavier even if its size is smaller , balancing visual wieght is just as
important as actual size .
grid and ratio usage - desighners often use grids , the rule of thirds or the the
golden ration to structure proportion , like , 1:1.1618
example
golden ratio circle on a logo
principle and law of design 19
sizing contrast
in video editing
Titles & Graphics:
Make your main scene text bold and large, secondary info smaller. Consistent
relative sizing builds a clean visual flow.
principle and law of design 20
Character & Object Scale:
Ensure subjects appear naturally scaled within the frame—don’t place a
person so small they look like a background prop.
Thumbnails:
Highlight your face or object of interest prominently; smaller text or icons
support without distracting.
Motion Graphics:
Animate elements to grow or shrink based on importance. Pair that with easing
curves to make proportion shifts feel organic and polished.
how to remeber
Proportion = Visual hierarchy + harmony.
Is the most important thing the most visually prominent?” If not, adjust scale,
weight, or positioning until it feels right
11. typography
it is how you make words look nice and easy to read ,
it includes which font you pick
how big letters are
how far apart the letter and lines sits
why is it important
it helps viwer reads text clearly and feel happy
simple rues for good typography
use only few fonts - stick to 2-3 fonts , to many fonts make the desighn messy
principle and law of design 21
make fonts different but matching - pair fonts with similarity like ( serif with
sans serif )
keep text easy to read - make letters big enough to see , leave enough space
between lines and letters so they compliment each other
use good color contrast ( dark text on light backround ) so the words stand out
emphasize the imp words- make imp words bold and big ( you can add drop
shadow , little glow ) this help direct viwers eye to main subject
In Your Video Design:
Use one font for titles and a second font for smaller subtitles or info.
Make titles big and easy to spot.
Check that text is readable on both big screens and phones.
Leave space between lines and around text boxes.
Don’t stretch or squish your fonts.
how to remeber it
Make text easy and pleasant to read. Use clear fonts, good size, and enough
space.
principle and law of design 22
12. color theory
what is color wheel
its a circle with 12 colors ,
primary color - red,yellow,blue, you cannot mix these
secondry color - mix two primary colors (Red+Yellow=Orange,
Yellow+Blue=Green, Red+Blue=Purple).
Tertiary colors: mix a primary and a secondary. Like red-orange, blue-green.
why learn it
it helps you pick colors that look good and blend together , it cane make your
video, thumbnale and graphics best or worse
3 simple rules
principle and law of design 23
complimentry color - opposite on the wheel ( like blue and orange ) , they pop
when placed together
analogous colors - next to each other ( like yellow, yellow-green, green). They
look calm and smooth)
monochromatic - different shades of the same color (light blue, medium blue,
dark blue). It's simple and neat.
warm and cool colors
warm - red , orange , yellow - feel happy excited
cool - blue, green , purple - feel calm or quit
in video editing
want something to stand out - use complemetry color
want a calm feel - use analogs or monochromatic colors
use mostly one color add a bit of its opposite for a splash ( like yellow in blue
backround )
principles of desighn
gestalt principle
principle and law of design 24