The key to Facebook Reactions? Animation (of course).

If you’re one of the 1.5 billion people using Facebook, you probably noticed the recently introduced Reactions — alternatives to the old school Like button that express a broader range of emotional responses to your friend’s photos of brunch.

reactions-usecase

In a fantastic Medium post explaining the process behind the new system, Facebook Product Design Director Geoff Teehan said something that should make motion designers everywhere perk up:

Early versions were static and we knew animation would be key in making them more expressive.

Don’t worry, I won’t go overboard here. But it’s easy to take for granted just how ubiquitous animation is becoming in our digital lives. As tech continues its march towards total domination, one of animation’s key features will become increasingly important: it’s capacity for human emotion.

reactions

Just look at the elegant power of the deceptively simple animations above. A tiny flick of the eyes, a quick shake of the head — all at the scale of a few dozen pixels — is enough to conjure a surprisingly wide array of emotions.

Of course, there’s a lot more to making Reactions work than animation alone. But animation is indisputably an essential element to their success.

Check out the full Medium article if you’re interested in the design and technical processes behind Reactions. Kudos to Seth Eckert and the Facebook team for seeing this one through to the end.

Credits

Geoff Teehan – facebook.com/geoffteehan
Andy Chung – facebook.com/aaa
Brandon Walkin – facebook.com/bwalkin
Sean Lee – facebook.com/surlung
Mark Peng – facebook.com/Lozzle
Brian Frick – facebook.com/brfrick
Seth Eckert – http://www.setheckert.com/

Montage music by Wesley Slover

Tags: , , , , ,

About the author

Justin Cone

/ justincone.com
Together with Carlos El Asmar, Justin co-founded Motionographer and F5. He currently lives in Austin, Texas with is wife, son and fluffball of a dog. Before taking on Motionographer full-time, Justin worked in various capacities at Psyop, NBC-Universal, Apple, Adobe and SCAD.

Join Motionographer on Patreon!

For as little as 7 cents a day, join our Patreon community and shape Motionographer's future!

  • Øyvind Rønning

    I think the laughing one seems too evil. Maybe it should’ve had teeth?

  • schwarzgrau

    As I find the animated reactions more appealing, I don’t see why they transport the emotion better than a static version.

    • Mar Ver

      I agree