Motion graphic design explained

Motion graphic design, also known as motion design, is a subset of graphic design which combines design with animation and/or filmmaking, video production, and filmic techniques. Examples include kinetic typography and graphics used in film and television opening sequences, and station identification logos of some television channels.

Both design principles and animation principles are important for good motion design.[1]

Some motion designers start out as traditional graphic designers and later incorporate motion into their skillsets, while others have come from filmmaking, editing, or animation backgrounds, as these fields share a number of overlapping skills.[2]

Technology

Technological advancements during the 20th and 21st centuries have greatly impacted the field; chief among these are improvements in modern computing technology, as computer programs for the film and video industries became more powerful and more widely available during this period. Modern motion graphic design typically involves any of several computerized tools and processes.

Adobe After Effects is one of the leading computer programs used by modern motion graphic designers.[1] It allows users to create and modify graphics over time.[3]

3D software such as Cinema 4D and Blender are part of many modern motion designers' toolkits.[1]

Adobe Animate, formerly known as Flash, is a tool for 2D motion graphic design. Prior to the rise of HTML5, it was the primary tool for web animation.[4] It has also been used for creating video animations, such as the web series Homestar Runner.[5] It is still used by some motion designers, particularly for frame-by-frame, or "cel" animation.[3] [6]

Adobe Premiere Pro is often used with After Effects when combining video footage with motion graphics.[1] [7]

Prior to animation, motion designers use design tools such as Adobe Photoshop for rasterized graphics, and Adobe Illustrator for vector art.[1] Photoshop can also be used for cel animation.[8]

Motion by Apple Inc., now a part of Final Cut Studio, is another tool for motion graphics.[9]

Types of motion graphics

Motion graphic design is often used in the film industry. Openings to movies, television shows, and news programs often use photography, typography and motion graphics to create visually appealing imagery. Motion graphic design has also achieved widespread use in content marketing and advertising.

In 2018, Cisco projected that 82% of all web traffic would be video by 2022.[10] Marketers and advertisers have focused much of their efforts on the production of high-quality branded video and motion graphic content.

In addition to its myriad of uses in advertising, marketing, and branding, motion graphics are used in software, UI design, video game development, and other fields. Although motion design and animation share many commonalities, the difference between them lies in the fact that animation as a specific art form focuses more on cinematic effects and storytelling techniques to craft a narrative, whereas motion design is typically associated with setting abstract objects, text and other graphic design elements in motion. Bringing a graph, infographic or web design to life using movement is broadly speaking "animation", but more specifically, it’s a type of animation that’s called motion graphics.

Motion graphics take a variety of forms. While some are entirely animated, others incorporate live-action video and/or photography. The latter may include animation overlay, such as data visualizations, icons, illustrations, and explanatory text used to complement and enhance audiences' understanding of the content.

In content marketing contexts, there are three primary types of motion graphics which marketers choose to use depending on the goals they wish to achieve with the motion graphic. Explainer motion graphics seek to elucidate a product, process, or concept. Emotive motion graphics, meanwhile, aim to inspire a particular emotional response in audiences. And finally, promotional motion graphics are used to raise awareness about a service, product, or initiative. Because so many motion graphics are designed with particular goals in mind, it is often essential to partner with a designer or organization specializing in visual communication design to achieve a final product that conveys information in both an accurate and compelling way.[11]

UX and motion design

UX, also known as user experience, works hand in hand with motion design. For example, when designing a phone app, motion design is used to improve user experience.[12]

Motion design improves the user experience tremendously and effectively by adding animations to any screen. Motion design is not only used in phone apps; it is used in computers, tablets, smartphones, televisions, and lots more. UX designers use motion design to create their prototyping, and experience with it to determine whether it is easy to use for an average person, or if it needs enhancing.[13]

Jobs and salaries

There are a variety of career opportunities for motion designers, including animation, art direction, design, concept art, compositing, creative direction, editing, illustration, producing, and storyboarding. Some motion designers take on a range of these responsibilities, while others prefer to specialize.

Motion designers can work on a range of projects, including advertisements, branding/identity, video games, UX / UI, AR / VR and film.[14]

In the United States, the average motion designer income was $87,900 (USD) per year in 2019.[15]

Motion design skills

Skills in typography are critical to motion designers, as videos, cartoons and advertisements often include text. A good motion designer knows how to use type styles, sizes, and timing to use text to attract audiences.

Knowledge of color theory is also very important for motion designers. They must have a good understanding of the color circle, complementary colors, and color saturations. The use of color is extremely helpful in communicating moods, effects and emotions.

Motion designers must also have software experience. Some of the software includes Adobe Photoshop, Adobe Illustrator, Adobe After Effects, Adobe Premiere Pro and Adobe Substance.

Other important motion-design skills are attention to detail; and good timing sense, for things such as matching video to audio.[16]

History

Motion design began as early as the 1800s, when early animation devices such as flip-books were invented.

There were no official founders of this art form, however, Saul Bass, Pablo Ferro, and John Whitney are some of the earliest well-known motion designers.

John Whitney was one of the pioneers of computer-generated motion design. In 1960, he coined the term "motion graphics" with the foundation of his company, Motion Graphics Incorporated. He invented his own mechanical analog computer to design motion graphics for television commercials and movie title sequences.

Whitney collaborated with Saul Bass to animate one of his most famous pieces, the title sequence for Alfred Hitchcock's 1958 film Vertigo, which featured swirling graphics increasing in size.[17]

Professional education

A degree in motion design can help an aspiring designer build a foundation for a career, by developing their skills in design, animation and conceptual thinking.[18] In the United States, college-level bachelor's degree programs can cost around $200,000.[19] [20]

Since the 2010s, online learning options for motion design have become more prevalent, with resources like School of Motion,[21] Video Copilot,[22] Greyscalegorilla,[23] and an abundance of YouTube tutorials from channels like Ben Marriott,[1] EC Abrams, Eyedesyn and Mt. Mograph.[24]

Online communities like Creative COW allow motion designers to get advice and technical assistance from more experienced designers.

See also

References

[25] Willenskomer, Issara. “Motion Design in Digital Products: a White Paper.” Medium, UX in Motion, 20 June 2019

[26] Richard Williams, The Animator's Survival Kit, a manual of methods, principles and formulas.

[27] “The History of Motion Graphics - Triplet 3D: Blog.” Triplet 3D, 3 July 2015, www.triplet3d.com/the-history-of-motion-graphics.

[28] Norman, Donald A. The Design of Everyday Things. Basic Books, 2013.

Blauvelt, Andrew, et al. Graphic Design : Now in Production. 1st ed., Walker Art Center, 2011.

Krasner, Jon S. Motion Graphic Design : Applied History and Aesthetics. 2nd ed., Focal Press, 2008, https://doi.org/10.4324/9780080887326.

External links

  1. Web site: A Guide to Motion Design . . 8 May 2023 . 26 August 2022.
  2. Web site: Everything You Need to Know About Becoming a Motion Graphics Designer. www.rasmussen.edu. en. 2020-02-04.
  3. Web site: Korenman . Adam . The Ultimate Guide to Motion Graphics Software 2020 . . 12 May 2023.
  4. Web site: Gregurec . Ana . Web Animation in the Post-Flash Era . . 12 May 2023.
  5. Web site: Winkie . Luke . An Oral History of Homestar Runner, the Internet's Favorite Cartoon . . 12 May 2023 . 24 January 2017.
  6. Web site: 7 Ways to Mix Frame-By-Frame and Rigged Animation . Motionographer . 12 May 2023 . 21 March 2023.
  7. Web site: Korenman . Adam . 10 Motion Graphics Tools Video Editors Need to Know . . 12 May 2023.
  8. Web site: Ward . Caleb . Cel Animation Inspiration: Cool Hand-Drawn Motion Design . . 12 May 2023.
  9. Web site: McGregor . Lewis . 10 Apple Motion Tutorials Every Motion Designer Should Watch . . 12 May 2023 . 18 February 2022.
  10. Web site: VNI Complete Forecast Highlights . . 8 May 2023 . 2018.
  11. Thorel . Benjamin . 2012-12-14 . Graphic Design: Now in Production . Critique d'Art . 10.4000/critiquedart.3289 . 1246-8258. free .
  12. Book: Norman . Don . 5 November 2013 . The Design of Everyday Things

    Revised and Expanded Edition

    . Basic Books . 235 . 978-0465050659 .
  13. Web site: Motion design in digital products: a white paper by Issara Willenskomer UX in Motion Medium.
  14. Web site: A Look Ahead to 2022 — Industry Trends Report . . 4 May 2023 . 2021.
  15. Web site: The 2019 Motion Design Survey . . 4 May 2023 . 2019.
  16. Book: Krasner, Jon . Motion Graphic Design . 2013-01-25 . Routledge . 978-1-136-13382-4 . 0 . en . 10.4324/9780080887326.
  17. Web site: The History of Motion Graphics - Triplet 3D | Blog. 3 July 2015.
  18. Web site: How to Become a Motion Graphics Designer.
  19. Web site: Cone . Justin . 6 challenges facing motion design education . Motionographer . 8 May 2023 . 15 April 2015.
  20. Web site: Korenman . Joey . The True Cost of Your Education . . April 2015 . 8 May 2023.
  21. Web site: Donaldson . Joe . Join the movement . Motionographer . 30 April 2023 . 16 September 2019.
  22. Web site: For the 100th episode of the podcast, we turned to the person that started the fire. You may think you know him pretty well, but this MoGraph pioneer still has so much to teach us . . 8 September 2020.
  23. Web site: Potvin . Kimberly . Contributor Spotlight: Nick Campbell of Greyscalegorilla . blog.adobe.com . 30 April 2023 . 16 April 2018.
  24. Web site: May . Tom . 50 motion design resources that creatives actually use . . 30 April 2023 . 26 April 2021.
  25. Web site: Motion design in digital products: a white paper by Issara Willenskomer UX in Motion Medium.
  26. Book: 0571202284. The Animator's Survival Kit: A Manual of Methods, Principles and Formulas for Classical, Computer, Games, Stop Motion and Internet Animators. Williams. Richard. 7 January 2002.
  27. Web site: The History of Motion Graphics - Triplet 3D | Blog. 3 July 2015.
  28. https://github.com/Vondark/books/blob/master/docs/src/Misc/The-Design-of-Everyday-Things-Revised-and-Expanded-Edition.pdf