Web Animation using JavaScript: Develop and Design

3. Motion Design Theory

Utility and elegance are the goals of every great motion designer, and this chapter explores a handful of techniques for achieving them. Because the focus here is on the theory of motion design—not its implementation—there are no code examples. The techniques discussed can be broadly abstracted across all languages, devices, and platforms.

Motion design improves the user experience

Let’s examine the phrase motion design: To design motion is to decide which visual properties of an object should change, and how that change should accelerate. For example, say you want to call attention to a button by changing its color: you might change the background color from red to blue over a 1000ms duration with an easing style of ...