Join the conversation: #smarterUI
Animate a Smarter UI: Tips for Motion on the Web
Gabe Martin (@gabemartin) & Robby Grant (@fourgrant)
Some of the mp4 examples are here: http://d.pr/f/xUx6/4DjJHI5t (not all but some)
Description:
You’ve seen them. The blinking, pulsing eyesores. Animations used by developers and designers who think “Because I can” is a good excuse.
It’s not.
On the web, there should be a reason for everything. Every transition, triggered event, and state change needs a purpose.
In this session, we’ll cover the only 5 reasons to ever use web animations:
1. Focus
2. Notify
3. Hint
4. React
5. Orient
(Plus one bonus — but it’s a secret.)
We’ll break down each category, looking at what works and what doesn’t — and why. You’ll see some brilliant uses of UI animation. And some terrible displays of superfluous bouncies.
Then, we’ll dig into some real code and give a live demo of creating some simple, purposeful animations with a little personality.
You’ll leave with a few new tricks up your sleeve and a fresh outlook on animations on the web.
http://schedule.sxsw.com/2014/events/event_IAP23559