Delightful UI animations
by understanding the brain
Senior Frontend Developer @ginettateam
@brunnolou
github.com/brunnolou
material.io/design/motion
Don't
Do!
What is animation?
The technique of producing
the illusion of movement
by displaying a series of images
the illusion of movement
Illusion
Wrong perception of a sensory experience
The vision has more to do with the
brain than with the eyes
MT
Experiment
Smooth Pursuit
Vectors
Global-motion perception
Do!
Don't
Do!
Don't
Don't
Do!
Spatial navigation
Animations can make people sick! 😢
Vestibular disorder
Avoid
- Animating big portions of the screen
- Big rotations
- Long translations
- Allow the user to turn off
Smooth Pursuit
Vectors
Global Motion
Spatial Navigation
Know more!
Neurobiologist
Prof. Bill Newsome
Designing Interface Animation
by Val Head
Animate more!
Thank you!
@brunnolou
github.com/brunnolou
Delightful UI animations
By Bruno Lourenço
Delightful UI animations
by understanding the brain
