From the Design Team

Feb 27, 2020

Finding the Overlap Between Motion Graphics and User Experience

Scott Jones
By Scott Jones

I was asked to share a presentation with the Salt Lake Motion Graphics Group. The event was hosted by Adobe on Thursday, February 27th, 2020. Below is a short transcript of that presentation.

Hi, I'm Scott Jones. I work as a product designer with all these people at an agency named Underbelly.

I was asked to present my thoughts on the overlap of motion design and user experience. So, let me introduce you to your new title.

Pretty neat, huh?

But to be honest, in my mind, there doesn't seem to be a whole lot of overlap between the two fields. When I think of motion graphics, I think of stuff like demon hands bleeding gold, scary cartoon eyes, and punk rock. You know, stuff like this…

Motion is weird: it has attitude and is very vibrant. Now, on the other hand, we have UX, and UX is not weird at all. It's very straightforward. It's analytical, it's data-driven, and it's sometimes boring. When I work on a UX project, a lot of my time is spent doing this…

Now, not to completely downplay the detail-oriented work that is user experience design, but I draw a lot of boxes and arrows. And I think it's understandable why these seem like two drastically different worlds to me.

But I do want to show you a project where we were able to have the best of both worlds. We used motion to elevate our user experience and found opportunities to do more exciting motion work.

This project started like any other: a few boxes here and a few arrows there. But it was our motion studies that started bringing our flows to life. It's pretty easy to understand a flow when you're looking at all the screens laid out on artboards. But when somebody is actually using that app, the flow needs to look and move the right way.

MUX Slide 05

So, what should move? And how should it move?

When I'm looking for answers to questions like these, I usually turn to prototyping. By now we've established our objectives and we have an idea of what the UI could look like, but now we need to understand its behavior as well. So, here's the part where we explore and see what's possible.

Subtle motion can make drastic changes in your composition. So, it's important to think of your motion critically: Does this motion bring clarity to the flow? Does this motion need to be apparent or subtle? That's really all it takes. Ask some questions and play around until you have answers.

After that, it's all about sharing.

During a project, your motion studies will help you solve questions. But after a project, those motion studies can help you prove your craft.

You've already put in the work to build prototypes, study motion, and find solutions. So, do yourself a favor and organize those thoughts for display. Because if you want people to know you do something, you gotta show ‘em.

MUX Slide 08

When I first started working on this project, it was purely as a user experience designer. We were mostly just reworking a survey system and dashboard. But the team I was working with ended up going through a merge with another team.

During this time, they became excited to share their new team vision. As we discussed how to share our enthusiasm, I thought that a video would be a compelling solution. So, I showed them what I could do, and we decided to animate a short video.

Facebook Survey Video Progress

In my mind, this is an absolute win. Teaming up with other Underbelly-ians, we quickly scripted, illustrated, recorded, and animated a video explaining the mission of the People Experience's team.

PEX Mission Video Preview Frame
Combined Shape

I hope you were able to enjoy my ramblings and learn something new. If nothing else, I hope to leave you with two thoughts:

  1. Things Move
  2. Tell People

Speaking of telling people, I also do a lot of motion graphic experiments for my band, My Boyfriend's Terrible Band. Give us a listen sometime.