Motion Guidelines
OpenTable / 2021
At the end of 2020, our lead content writers created a new manifesto to guide not only design, but every inch of OpenTable.
Written by Molly Watson and Francesca Burke, for OpenTable
Inspired by the movement in the language, I knew it was time to establish brand guidelines for how OpenTable animates—not just online or on TV, but within the app as well, where possible.
I had a hunch that our motion would be steady and smooth, but needed to see restaurants moving in action to be sure.
how easing is fundamental to opentable’s motion
Scaling
Scaling with great ease adds confidence and magic, and is fundamental in showcasing various product features, or moving between scenes.
Direction
Directional movement is rooted in gravity; the effort to leave should be matched by the effort to arrive.
Morph
Rather than cutting between shapes, morphing shows off variety with ease. There should always be enough time between shapes to ease into place.
Text animation
By default, text should rise and fall with ease from the bottom, beneath a mask.
If there is more than one line, text should animate up by line rather than by word.
