Design Technology and Motion Design team

Do you need help with a project you’re working on? Do you want to bring concepts to life using motion design? The design technology and motion design team is here to help!

A design technologist defines and delivers technology-inspired and customer-driven experiences. By bringing designs to life through code, design technologists help bridge the gap between possibility and actuality.

Design technologists lead the organization in pixel-perfect attention to detail in our experiences, and produce high-fidelity prototypes and UI code for the purposes of visual storytelling and gathering rich customer insights.

Resources

Motion Gallery

The Motion Gallery is a place to collect and search past motion projects. You can filter via team or tags to find examples or inspiration for your next project. Each project contains a link to the Box folder where you can download After Effects files, specs, and Lottie assets.

Resources

Lottie Playbook

We put together a playbook that shows how to implement Lottie animations. Lottie is a library that plays After Effects animations exported as a JSON file (via the Bodymovin plugin) and renders them natively on mobile and web. We have multiple code templates created where you can add interactive functionality and dynamic animations to your iOS, Android, and web project.

Resources

QuickBooks Animation Library

The QuickBooks Animation Library is a solution for adding motion to your product, page, or feature. This library allows you to easily apply pre-made transitions to common interactions using CSS or SCSS.

Resources

Features:

  • Ready-to-use QuickBooks motion styles that can be applied with CSS classes or SCSS mixins
  • Semantic mappings that make it clearer which animations to use and provide a path to updating specific animations by updating the library
  • Detailed examples show exactly what animations look like to help designers and developers collaborate

Celebration Framework

Celebrations are moments that recognize customers’ achievements, from first steps to major milestones. They connect customers to big-picture benefits so they feel the payoff from the start — and more and more over time.

Resources

Continue reading

Motion principles

Motion brings design to life by creating feelings of passion and optimism, while helping focus and proactively guide through a process.

Read more

Types of motion

There are two types of motion we apply to our experiences – micro-motion and storytelling.

Read more

  • Was this Helpful?
  •