Accessibility
Why be so intentional about animation? User experience animation is all about movement with purpose . Unnecessary motion may be annoying for some users but potentially damaging for many.
So, on our quest to guide users through an intended experience with calculated motion, what pitfalls should we avoid?
Constant Movement
Some of our favorite sites implement constant motion to gain and maintain user attention. However, this is not best practices.
Avoid...
Shoot for...
Good example:
Motion Design Portfolio from Yaniv Fridman on Vimeo
Full-screen Movement
Large and varied movements can be difficult for many users. According to Envato, a designer should always be aware of “the relative size of movement to the screen.” A small bouncing arrow on desktop is fine and probably helpful but could become a giant nuisance and/or danger on mobile.
Mismatched Movement
It’s sudden. It’s uncalled for. It’s a no-go for accessibility. It’s scrolljacking and you should avoid it. Scrolljacking is a seemingly fun feature in web design that scrolls the page for the user. It may be theatrical and different, but it’s a nightmare for folks with atypical hand-eye coordination. This video shows a parallax scrolling infographic that has the kind of mismatched movement designers should avoid.
A Parallax Scrolling Site from Lee Christenson on Vimeo.
Though it differs from the beloved parallax scroll, it behaves similarly. Here are some ways to avoid scrolljacking with a subtle parallax effect.
What is the feature that you should avoid that scrolls the page for the user?
Here are some more resources for designing with accessibility in mind: