Everything in our world has the ability to move, given enough force. Even immovable static objects, like a leaf or branch, can go from one point to another if it’s a windy enough day. 

Movement is something so ordinary, it’s easy not to notice it day-to-day. But when you see a moving graphic on a website shifting awkwardly or looking distorted, you instantly know something’s wrong.

Motion graphic designers are the experts behind the moving images in commercial graphics, app interfaces and interactive website features. It’s a challenging field to break into. But with a good grasp on movement principles and the right software, you can start creating your own motion graphic designs.

Motion Design Principles

Animating a static image in Adobe After Effects is quick and simple.
Tools like Adobe’s Creative Suite can transform your images into video. Still from Skillshare class Collage Animation: Creative Motion Graphics with Photoshop & After Effects by Carminys Guzman.

A subfield of graphic design, motion design takes the basic principles of filmmaking and combines them with static images to create animations and moving visual effects. 

Typically, motion graphics differ from animation in that they don’t follow a fixed storyline. Instead, they’re often a repetitive movement, either following a linear line from point A to point B, or looping in a circle that starts at point A and returns to point A after a series of motions. Moving logos in advertising are a common application for motion design.

Ultimately, movement is about physics. A motion designer needs to understand this and translate how real life physics works onto a flat screen. This can be one of the most difficult elements to get a good handle on, but once you crack it, you’ll notice a significant improvement in the motion graphics you make.

Sloppy animation can be particularly frustrating on an app or website user interface (UI). Everything should be designed to help the user, rather than make them work harder.

Animation Basics

Motion design production teams still follow the basic principles of animation and movement developed by world-leaders like Disney's original animators. These are:

  • Squash & Stretch
  • Anticipation
  • Staging
  • Straight Ahead Action
  • Slow In and Out
  • Arcs
  • Secondary and Layered Action
  • Timing, Spacing and Rhythm
  • Exaggeration
  • Mass and Weight
  • Appeal

The goal is to make your graphic as believable as possible. If you’re animating a ball, the dot on the screen should give the impression of having the same weight as it would in the physical world. If the ball bouncing animation moves at the same frame speed as a car graphic, your animation won’t be believable because a car is much heavier and would naturally travel slower.

Similarly, our eyes have been trained through watching real-life objects to look for arcs when something bounces, or when an object squashes into a different shape if it hits something at speed. You don’t need to incorporate every principle into each motion design you create, but understanding them and how they can be effective when making graphics is vital.

Motion Design Tools

Animation comes in all shapes and sizes so what you work on is entirely up to you. For beginner animators, motion design’s lack of storyline and simple principles make it a good place to start.

After Effects

The dashboard of Adobe After Effects is laid out in a panel-based framework.
After Effects is one of the simplest tools for beginner motion designers to use. Still from Skillshare class The Beginner’s Guide to Adobe After Effects by Jake Bartlett.

The Adobe After Effects software comes with hundreds of tools to get you going on your motion design journey. It can feel overwhelming when you first open the program, but starting with a simple 2D animation in After Effects will help you navigate some of the key features you’ll need to know if you want a career in motion design.

Using elements like the speed graph and motion graph, you’ll have full control over every aspect of your image to animate even the smallest parts quickly and easily. Duplicate motion graphic layers to create an endlessly-playing looping animation.

Like with other Adobe programs, you can connect Photoshop to After Effects to import existing static projects for conversion to animations.

Cinema 4D

Working as a 3D motion designer requires knowledge of tools like Cinema 4D.
Cinema 4D is best for 3D animation projects. Still from Skillshare class Introduction to Cinema 4D: A Beginner’s Animation Guide by Don Mupasi X Visualdon.

Once you’re more comfortable with your newfound animation skills, you can try your hand at 3D animation. Cinema 4D specializes in these kinds of motion design project ideas, with tools for modeling, rigging and simulations all built in.

Some of the world’s biggest video games and animated films have been made using this software, but Cinema 4D is for beginners as much as it is for professional motion designers. The built-in MoGraph tool is an intuitive feature which quickly turns complex designs into fully-functioning animations.

Maya

Animating a skeleton character in Maya is simple thanks to the built-in rigging tools.
Maya’s rigging suite is best for character-based animation. Still from Skillshare class Maya for Beginners: Rigging by Lucas Ridley.

One of the most popular motion design tools is Autodesk Maya. It’s certainly expensive at over $100 per month, but students may get free access through their motion design degree program. 

Given the price, it’s easy to assume Maya is only for professional motion designers. Experts on Disney’s team prefer this tool, but don’t let this put you off. Maya beginners can use it for 2D and 3D motion designs, particularly those needing character rigging setups to account for realistic movements.

Adobe Premiere Pro

Animating in Adobe Premiere Pro is best for layering simple motion graphics on existing video content.
Premiere Pro has a range of features for motion designers to use. Still from Skillshare class Advanced Video Editing with Adobe Premiere Pro by Jordy Vandeput.

While other Adobe tools are usually a better choice for intricate motion designs, Premiere Pro works well for simple animations on existing graphics.

To get started, you’ll create a new Sequence file within the software, then import your image into the program. From here, you can bring in other visual elements or presets to make your graphic move, or adjust the scale of the static image to set a keyframe, or movement time, to build a simple animation.

Adobe Illustrator and Photoshop

Adobe Photoshop has several basic animation tools to transform your motion design projects.
Photoshop allows you to import static images from Illustrator and edit them together into a single animation. Still from Skillshare class Illustrate and Animate a Christmas Snow Globe with Adobe Illustrator and Photoshop by Maja Faber.

You won’t be able to animate images directly within Adobe Illustrator, but you can use this in combination with Photoshop, Premiere Pro or After Effects to bring your graphic to life.

Within Illustrator, build multiple artboards featuring each segment of your animation. You’ll need to number these sequentially to make the animation feature work when you move over to Photoshop. 

Once you’ve imported the graphic to Photoshop, set your workspace to Motion and review the playback. Use Photoshop’s tools to adjust the speed until you’re happy with how your motion design looks.

Motion Design Roles

Working as a motion designer is an exciting and varied creative career choice. Outlook for the industry is looking good. By 2029, the global animation market is predicted to be worth nearly $500 million. If you’re looking for a challenging job which blends art and technology, motion design could be the one for you.

Television and Film

When people think about careers as a motion designer, TV and film is usually where they start. It’s not always a full feature-length animated movie or television series that requires the highly-coveted skills of a motion designer, though. 

Live action cinematography features hundreds of virtual effects, many needing to be digitally created and made to appear as if they were happening on set. 

The integration of animation and live action has also become popular in recent years, with films like The Chronicles of Narnia and Guardians of the Galaxy grossing millions at the box office thanks to their effective use of computer generated images (CGI).

Video Games

Much like with TV and film, animators working in the video game industry see a range of creative projects come across their desks. Their main role is to create a believable world for 2D or 3D characters to move through. 

Video games also follow storylines and scripts, so these motion designers will work closely with art directors, prop artists and fellow designers to create a film-like feel to the finished game.

As the user has the ability to control a character’s movement in a way that TV and film audiences don’t have, video game motion designers are often tasked with creating thousands of animation scenarios to work into each section of the game. These may or may not be shown to the end user—it all depends on what buttons they press on their console controller.

UI and UX Web Design

While motion designers have always been needed in the entertainment industry, demand for commercial animators has grown exponentially. 33 percent of businesses report using animated videos in their digital marketing, with 87 percent of marketers reporting that videos have helped them increase web traffic.

This new focus on moving content has led to an increasing need for talented UI and UX motion designers. Their primary role, though, isn’t in marketing specifically. Instead, their animations guide users around apps or websites to influence consumer behavior and decision-making. Even the smallest interactions, such as loading screens or navigational menus, are all put together by UX designers.

UI motion designers are also focused on making sure the overall design of a site or app flows well and is an intuitive process for the user.

Attracting attention through visual cues can point users in the direction of certain products or special offers a brand is promoting. UI and UX motion designers work with the marketing team to decide what needs highlighting, while striking a careful balance between promotion and distraction.

Turn Your Images Into Moving Graphics

Motion design can be a lucrative and rewarding career path to follow, or simply a fun hobby to practice at weekends. With the right tools and some patience as you develop your skills, you’ll be well on your way making moving graphics and animations of your own.

Written By

Holly Landis

  • Click here to share on Twitter
  • Click here to share on Facebook
  • Click here to share on LinkedIn
  • Click here to share on Pinterest