Embed Size (px)
DESCRIPTION
Citation preview
Designing Motion
Make Animation On The Web Extra Awesome!
I CSS
Content Layer
Style Layer
Behaviour Layer
Content
Presentation
Behaviour
Experience
These changing times
Experience is now the material, not ceramic or plastic.
“”
Liz Danzico, SVA
Transformitionamations
easelinearease-inease-outease-in-out
easelinearease-inease-outease-in-out cubic-bezier
A B
{...}
Animation for UI
Animation for storytelling
MetaphorWhat are you imitating?
Weight & PhysicsLight as a feather. Stiff as a board.
Transference
The idea that various aspects of the character’s attributes come together to just feel “right”.
Appeal
“... it’s easy to forget that when you’re building a game you’re not just building a set of rules or a pile of content. You’re crafting and experience...
Animation happens to be my weapon of choice to achieve this”
[Mika Mobile blog post]
Internet != Cartoon
Are we there yet?“Point B” isn’t static.
Semantics MatterWe care about that codestuffs
The DOM
New Things!!yay?
Fallbacks+browsers, devices, the future, oh my!
Multiples & Workflow
Content Layer
Style Layer
Behaviour Layer
Limitationsthink of them as your friend. for real.
Go Play! Experiment. Make things. Have fun.
