What's motion design?

There's fierce competition for our attention. If you’re in the business of trying to capture attention to effectively reach and communicate with people, then motion design is a powerful and essential tool to have in your arsenal.

Bring motion in-house

Animate marketing assets in seconds with Linearity Move.

Get Started

Isn’t motion design just a fancy name for animation?

At its core, motion design is the art of bringing graphic design to life through animation.

So the line between motion design and animation is quite blurry. But let’s draw a clear distinction.

Animation, as a broader discipline, often refers to traditional animated films where characters move through time and space to tell a story. In such traditional animations, characters and their emotions take center stage. 

Motion design, on the other hand, has a different focus. It’s usually more abstract, aesthetic, or text-based, and the primary goal is to deliver a message. Motion design often supports brand communication by transforming logos, typography, or other graphic elements into dynamic, eye-catching visuals. That’s why it’s so widely used in marketing, advertising, and explainer videos.

How motion design works

The workflow of motion design differs based on whether you're involved in the creation of the initial illustrations and assets or whether you'll receive these assets to work on.

In many situations, a graphic designer or illustrator will be the person who creates the initial static illustrations, which are called style frames. 

This can be done in most graphic design software, such as Linearity Curve, Adobe Photoshop, or Adobe Illustrator. These style frames are then given to a motion designer.

The motion designer will bring these style frames into animation software like Linearity Move or Adobe After Effects, where they can be adapted and animated.

Uses of motion design

These are some of the main use cases for motion design:

Film title design

Film titles are a perfect example of motion design’s ability to elevate visuals.

Motion design transforms simple text into an experience that sets the mood for the film.

Case study: Se7en (1995)

One example is the title design for the movie Se7en, which set a new precedent for engaging viewers and improving narrative depth through motion design. 

The title sequence incorporates a series of disturbingly jittery, hand-edited shots of the antagonist, John Doe, performing various actions like meticulously inking words onto paper and removing fingerprints. 

These visuals are intertwined with frantic kinetic typography that displays the names of the cast and crew. The sequence combines live-action footage, stop-motion photography, and cutting-edge digital effects (for the time) to create a sense of unease and foreboding.

Television, sports, and news programs

In the early days of television, shows typically opened with presenters introducing the program, often accompanied by jingles and basic animated graphics. 

Today, motion design plays a much larger role, transforming visual elements into engaging experiences. It’s even a key component in music video production.

News programs still use motion design. Think of the dynamic, animated logos at the start of their broadcasts and the news ticker motion graphics when reporting live from a location.

Sports shows also superimpose motion graphics to show game scores, leaderboards, and information for fans to follow the games more easily.

Case study: ESPN’s SportsCenter rebrand (2014)

In 2014, ESPN undertook a comprehensive rebrand of its flagship program, SportsCenter, one of the most recognized sports news shows. 

This rebrand focused on integrating advanced motion design to enhance viewer engagement and modernize the show's presentation. 

The rebrand featured bold, animated typography and infographics that could be easily updated with the latest sports data. This approach ensured viewers received real-time information in a visually engaging format.

Animated logos

Animated logos are a powerful way to grab attention and make a logo more engaging.

Expressive motion graphics give a personified appeal to brands that would otherwise have been advertised as still images. This helps to build brand recognition and gives the company more personality.

Case study: Google’s animated logo evolution

Google, known for its minimalist approach and forthright innovation, has used animated logos to engage users and communicate its brand identity creatively. 

Over the years, Google has introduced various animated versions of its logo, especially through its Google Doodles, to celebrate events, anniversaries, and achievements. 

These animations transform the familiar Google logo into a storytelling tool that captures attention and conveys messages in a playful and impactful way.

Explainer videos

Explainer motion graphics help describe concepts visually. They’re an excellent way to engage audiences and help them understand simple to complex ideas.

An explainer video is usually accompanied by a narrator who talks to viewers through the motion graphics displayed on the screen.

Case study: Dropbox’s explainer video relaunch

In 2009, Dropbox, a cloud storage service, released an explainer video that played a pivotal role in the company's early user growth. 

At the time, cloud storage was a new and unfamiliar concept. Dropbox’s video used clean, flat animations and conversational narration to make cloud storage accessible, even to viewers with no prior knowledge.

The video's success highlighted the effectiveness of motion design in making complex technology accessible and engaging to a broad audience.

Education

Motion design is a game-changer for education, much like its role in explainer videos.

By combining visual language that resonates with children or students with the essential information they need to learn, motion design can craft engaging and dynamic learning experiences that enhance the overall quality of education.

Case study: Khan Academy’s use of motion design in educational content

Khan Academy, a non-profit educational organization, provides free online education to students worldwide. Its educational videos often feature motion graphics, including animated diagrams, illustrations, and text, to accompany the instructors' voice-over explanations. 

The motion design elements illustrate concepts and break down complicated ideas into manageable, visually engaging pieces of information.

Social media

Motion design is everywhere on social media, and for good reason — it’s one of the most effective ways to capture attention and engage audiences.

Static images and content on social media are far less popular and get shared at a much lower rate than moving and dynamic content. Motion design also enhances video footage to help bring across a message. This means it's great for a how-to or promotion video.

Since motion design is the movement of graphics over time, it also means that viewers stay on a page or post for longer and are less likely to scroll past if they're engaged with the animated content.

Case study: Duolingo's language learning encouragements

Duolingo, the language learning app, utilizes motion graphics in its social media strategy to motivate current users and attract new ones. 

These animations prominently feature the brand's mascot, Duo the Owl. They convey the benefits of learning a language in a fun and engaging way.

Duolingo's creative professionals depict Duo in various scenarios, from celebrating learning milestones to gently reminding users to maintain their learning streaks. Through bright colors, fun styles, and humorous scenarios, these animations convey the benefits of language learning in an entertaining way.

Advertising

Motion design excels in video advertising by creating dynamic, animated content that grabs viewers' attention and communicates marketing messages far more effectively than static images or text alone.

Motion designers create promotional graphics for a variety of formats, including digital billboards, fast-food menu boards, Google Ads, TV spots, and mobile devices.

Often, these ads are also programmed to follow your journey between screens, which explains why you tend to see the same ads repeatedly.

Case study: Spotify’s motion design in advertising

Spotify, a leading music streaming service, faces the challenge of creating universally appealing yet personalized advertising content.

To tackle this, Spotify has leveraged motion design in its advertising campaigns on platforms like Google Ads and Instagram.

Spotify's ads told stories that resonated with potential users, illustrating moments of frustration with ads on other platforms and the joy of uninterrupted listening with Premium.

Point of sale and self-service systems

Digitized systems are replacing jobs in various industries, and interactive motion graphics have become even more important for user experience in the physical world.

Malls, cinemas, banks, airports, restaurants, and drug stores are all starting to use automated ticketing systems and information desks. Some of the biggest tech companies in the world are producing POS (point-of-sale) systems and self-service kiosks, such as Oracle and Ingenico.

Image source: Online Ordering for Restaurants

Case study: Oracle’s integration of motion design in POS systems

Oracle, a database management and cloud services leader, has expanded its technology features to include advanced POS systems and self-service kiosks. 

These systems are designed for various industries, including retail, hospitality, airports, and more, aiming to streamline operations and improve customer service.

Oracle implemented motion design in its POS system and self-service kiosk interfaces to create a more beneficial, engaging user experience. The strategy used interactive motion graphics to seamlessly guide users through transactions and information queries.

Websites

Besides using popular design programs to produce motion graphics in video formats, designers can also use their programming skills to create animated elements online.

Using CSS and Javascript code for motion design is constantly developing. Previously, many animated elements on websites were embedded videos, but now you can achieve complex and interactive motion graphics using code alone.

Case study: Airbnb’s website animation

Airbnb, a popular platform for booking accommodations, utilized CSS and JavaScript to embed motion graphics and interactive elements directly into its website, moving away from the reliance on embedded videos for animation.

Airbnb reported increased engagement metrics on the website, with users spending more time exploring listings and a higher click-through rate (CTR) to booking pages.

The future of motion design

Motion design is more and more prevalent. Which means good visual communication is becoming an essential skill.

If you’re interested in becoming a motion designer and developing your skills in this area, there's no better time to begin than now.

With Linearity Move, you don't need in-depth animation knowledge to start creating your own motion graphics.

Ready to try new and innovative motion design software? Download Linearity Move for free.

Bring motion in-house

Animate marketing assets in seconds with Linearity Move.

Get Started

Frequently asked questions