We see motion graphics every day, in both business contexts and at home, from the videos we watch on social media, to the moving text on a TV ad, to the animated explainer videos that companies frequently use. Even the rotating icon we see online when a webpage loads is a motion graphic. Most digital content these days incorporates motion, but what exactly are motion graphics and why should we use them? We spoke to the digital team here at Custodian to answer the internet’s most frequently asked questions around motion design and motion graphics.  

What are motion graphics? What are the main uses of motion graphics?

‍3D Triplet defines motion graphics as any graphics that use technology to create an illusion of motion, transformation, rotation in order to communicate messages through video and audio storytelling. Motion graphics are very simply, graphics that move. Motion graphics can be text that moves, moving images or moving graphics- they are essentially an extension of graphic design. The main purpose of motion graphics are to draw the eye, hold the viewer’s attention and add more engagement to a design.

‍
What are the advantages of motion graphics?

We think the biggest advantage of motion graphics are that they help to engage the viewer. By nature, the movement in the design is more eye-catching than a static design. They are fluid and dynamic and the viewer has to watch for longer to take all of the information in, making them more engaging and entertaining than a static design.  

Motion graphics can sometimes capture tone of voice better than written communications as you have the ability to include voiceovers. They also allow us to communicate more information in one visual component- think of how many words you can say in a 10 second video compared to how crowded a static design would be if you tried to fit all of those words onto one page.  

‍
What are the disadvantages of motion graphics?

‍They take much longer to create as you have to create the graphics first and then animate them. The design process is more tedious and time consuming, which makes them more expensive from a client’s perspective. Then with longer animations, there’s the risk of viewers clicking off before the full message has been shown- so you have to work harder to ensure that the design is entertaining enough to prevent that.
‍
‍

Talk us through the motion graphics process

• We usually start by creating a sketched storyboard or styleboard based on the client’s brief. If a script is provided, we create our storyboard based on the script. If the client doesn’t have a script, we establish the objective of the video and the intended messaging and then base our storyboard on this. The storyboard acts as a very rough prototype to give the client an idea of how the final piece will look before we start designing. This is done to help us figure out any changes to script, sequence of events etc, as it’s easier for us to amend still graphics than motion graphics. Designer Han Lung best put it:
  

"A video without a storyboard is like a house without a foundation"

• Once our storyboard has been approved by the client, we start working on the first draft. We usually make the graphics in Adobe Illustrator or Photoshop and export these into Adobe After Effects, where we can animate them.
• The graphics are animated through keyframes. Keyframes mark the properties of the graphics at different times, such as the position, rotation, and scale of the graphic. The animation is created through the changing of these properties over time. Like the example below- we set the scale of the logo to 100% at 0 seconds, and then at 2 seconds we set the scale to 300%.  Then Adobe After Effects takes care of the bit in the middle. Of course, you can add effects- one common practice in After Effects is called easing, where you can make the movement smoother, or alter the pace- for example making it move slower then gradually speed up or vice versa.  

• If there is a voiceover, our voiceover artist records the approved script. We then chop up the recording and edit it together into a good pace. We usually ask our clients to sign off on the pacing before we start to time the graphics to match the voiceover. The graphics can also be timed to match music.
• Once the first draft is sent, there’s back and forth with the client and we make amends to ensure that they are satisfied with the final piece and the message is communicated effectively.
  ‍

What software is used for motion graphics?‍

There’s lots of different software, and the list is always evolving, but the main programmes we use are:

• Adobe Illustrator to create the graphics to be animated  
• Photoshop to create the graphics to be animated
• After Effects to animate the graphics
• Adobe Animate is used when we’re creating display ads for the web
• We use an animation file format called Lottie to transfer graphics from After Effects into web browsers
• Cinema 4D is used when we’re doing 3D modelling and animation

‍

Where do you find inspiration for motion graphics?

Life! As we said earlier, motion graphics can be seen everywhere. We take inspiration from things we see on YouTube, on the internet, on TV, in cartoon shows and in films. There’s also some great design sites like Behance and Dribbble which have lots of examples of motion graphics.  

‍
Have you noticed any trends in motion graphics?

Motion graphic trends can be dictated by trends in graphic design. For example, in the past few years, there’s been a graphic design trend towards creating disproportionate characters, which affects the style of animation. You see a lot of motion graphics where there’s a person with oversized arms and legs and a tiny head and this lends itself to a very bouncy style of animation.  
Kinetic typography has also been very popular in the past few years, with videos consisting entirely of moving text. We’ve noticed line animations going viral online and animations that run in an infinite loop.  There’s also been a trend in “fake” 3D, where designers change the path of a graphic to make it look 3D.
Brutalism is quite popular at the moment, which is an aesthetic style of motion design that focuses on textures and monochromatic colour palettes and makes the designs look grungy and raw. We’re also seeing more animated logos on company websites.  ‍

‍

‍
What’s the future for motion graphics?

We think they’ll grow even more popular, as consumers’ attention span shortens, and it gets harder to win their attention. The animation software that exists keeps improving, which means the process will get easier. At the moment, we have to use Lottie to render motion graphics for web browsers, but this will probably evolve into a simpler process. We also think the software will become more accessible to consumers and take less technical skill.
‍

What’s your favourite part of being a motion designer?  

We enjoy the creativity and the freedom that comes with motion design. It also creates different challenges with every project and takes a lot of problem solving to figure out how to get the graphics from point A to point B smoothly while still conveying the client’s message effectively. This means each project is diverse and interesting and we’re always learning new techniques.  

As architect and psychologist Bryan Lawson said;

“Design is as much a matter of finding problems as it is solving them”

‍

From a client’s perspective, when do you need to use motion design?

If you want any part of your final design piece to be moving, then you need to request motion design. At Custodian, we have a skilled team of motion designers who can help bring your brand to life.  

Still have questions? We’re here to help.  Get in touch to chat about how our motion designers can work with you to introduce motion into your advertisements.