Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I am a motion graphics designer (previously: motion graphics for TV, games, etc), but more recently, I worked on prototyping UI motion for an app - which I really enjoyed!

I have mainly used After Effects up until this point and have read that quite a few UI/UX designers use this to prototype transitions and interactions.

As I move into this field, for those already working in it, do you see a use for someone to come in, like myself, on a freelance basis to prototype motion in AE? What other tools do you find beneficial for this?

I have read about Quartz Composer, which apparently has a rather steep learning curve - but would like to learn if that would be a desirable skill to have?

share|improve this question

2 Answers 2

First, I applaud anyone showing an interest in focusing on the interaction side of design. In corporate UX groups, I find that the one thing that often does fall through the cracks is the interaction design (often due to waterfall development processes). The UI may look stunning, the back end, tight and responsive, but then you put them together and things still feel clunky because no thought was put into the transitions, or hovers, or animated reveals, etc.

So, any UX team that would have you, would be an excellent UX team to be a part of as there is clearly consideration for this.

As for what tool to use, that's where I get a little more skeptical of anything but the actual medium one is working in. I'm a strong advocate that if you're working on prototyping motion for a web app, use the medium of HTML, CSS, and JS to do it. If it's a native iOS app, grab Quartz Composer and use native animations.

That's not to say After Effects isn't a great tool, though. Ultimately, it's the person behind the tool that's key. That said, when only the tool is used, teams can get overly reliant on the interactions that exist only within that tool. For example, a team that only uses Axure may end up unknowingly creating web sites that simply feel like default Axure interactions.

SharePoint is another good example...it takes a herculean effort to build a SharePoint site that doesn't 'feel' like SharePoint because you're stuck within the medium of SharePoint.

In summary:

do you see a use for someone to come in, like myself, on a freelance basis to prototype motion in AE?

Do I? Absolutely! And hopefully other UX teams do as well.

What other tools do you find beneficial for this?

I'd start playing with jQuery. Get your hands dirty with some JS and CSS3. Even if you don't ultimately work in that, it will give a lot of great context to take back to better create your After Effects work.

Other popular tools that include different forms of interaction prototyping that UX teams use:

  • Axure
  • iRise
  • Muse
  • InVision
  • and (again) HTML, CSS and JS.
share|improve this answer

DA01's answer was fantastic and thorough. I'd like to applaud you for making the transition as well!

Getting comfortable with the code itself is incredibly valuable because it will allow you to understand and communicate with developers and SWEs in ways that allow your ideas to come to fruition in production. Additionally, it can decrease production time dramatically because you can exert ultimate control (and reduce the number of production code iterations) over your transitions and animations.

I'd like to note that some open-source tools like Framer have fairly low overhead and will allow you to move empower yourself to move towards more code-based design. If you're composing static mocks yourself or working with designers who like different tools (PSD, sketch, etc.), you don't need to press them to change their workflow to create polished motion designs.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.