Motion Design Terms You Should Know

Monitor on a dark desk showing holographic motion design tools with bezier curves, keyframe timeline, and easing graph editors.

Motion design has its own vocabulary, including terms like keyframes, easing, loops, compositing, and codecs. This glossary explains each one in plain language, without requiring any animation background to understand them.

What Is a Keyframe?

A keyframe marks a specific point in time where you’ve set a value for something — position, size, opacity, rotation, whatever. If you place a keyframe with an object on the left side of the screen, then another keyframe two seconds later with it on the right side, the software fills in everything in between automatically. That “filling in” is the animation itself. Keyframes are the foundation almost every motion tool is built on.

What Is Easing in Animation?

Easing describes the speed curve of an animation — how it accelerates and decelerates over time. Real-world motion almost never moves at a constant speed; a car doesn’t jump instantly to full speed and stop instantly either. Easing mimics that.

“Ease in” means something starts slow and speeds up. “Ease out” means it starts fast and slows down. Without easing, animations feel robotic and mechanical, which is why it’s one of the first things that separates amateur motion work from polished motion work.

What Does Frame Rate (FPS) Mean?

Frame rate is how many individual images (“frames”) are shown per second to create the illusion of movement. Common rates are 24, 30, and 60 frames per second. A higher frame rate generally means smoother motion, though the “right” frame rate depends on the platform and the feel you’re going for — this is a big enough topic that it deserves (and has) its own dedicated explanation.

What Is a Loop in Motion Design?

A loop is an animation that repeats seamlessly — the last frame connects back into the first frame without any visible jump or stutter. Good loops are surprisingly hard to make well; even a tiny mismatch in position, color, or timing between the last and first frame creates a noticeable “snap” that breaks the illusion. Loops are especially valuable for social media, where content often plays on autoplay.

What Is an Alpha Channel (Transparency)?

The alpha channel controls how transparent or opaque each part of an image or video is. It’s what allows a mockup or animated element to be placed over any background without a visible box around it. This is essential for compositing multiple layers together into one final scene.

What Is Compositing?

Compositing is the process of combining multiple visual layers — backgrounds, mockups, text, effects — into a single final image or video. Think of it like stacking transparent sheets on top of each other: each one contributes something to the final picture, but they can all be adjusted independently.

What Is Aspect Ratio?

Aspect ratio is the relationship between a video or image’s width and height, usually written as a ratio like 16:9 or 9:16. It determines the overall shape of the frame — wide and horizontal, tall and vertical, or perfectly square. Choosing the right aspect ratio depends entirely on where the content will be viewed.

What Is Resolution?

Resolution refers to how many pixels make up an image or video, usually described as width × height (like 1920×1080). More pixels generally means more visible detail, but resolution and aspect ratio are not the same thing — you can have the same aspect ratio at very different resolutions.

What Is Bitrate?

Bitrate is the amount of data used per second of video. A higher bitrate generally preserves more visual detail but results in a larger file size. This becomes important when exporting content for platforms that compress video automatically, since starting with a low bitrate can make compression artifacts more noticeable.

What Is a Codec?

A codec is the method used to compress and encode video data into a file. Different codecs (like H.264, VP9, or ProRes) balance quality, file size, and compatibility differently. This is why the same video exported with different codecs can look or behave differently depending on where it’s uploaded.

What Is a Mockup?

A mockup is a realistic visual representation of a design — like an app screen shown inside a phone frame, or a logo displayed on a t-shirt — used to present work in a more tangible, real-world context. Mockups can be static images or animated (motion mockups), and they’re one of the most common tools for presenting design work professionally.

What Is a Timeline in Motion Design Software?

The timeline is the visual representation of your project over time, usually shown as a horizontal bar with markers for keyframes, layers, and duration. It’s the main workspace where the sequencing of an animation actually comes together.

What Does Render or Export Mean?

Rendering (or exporting) is the process of converting a project into a final, shareable file — a video, GIF, or image. This is the step where all your layers, keyframes, and effects get “flattened” into the finished output.

Frequently Asked Questions

What is the difference between a keyframe and a frame?

A frame is a single still image in a video. A keyframe is a point where you’ve manually set a value, like position or opacity; the software then generates the frames in between automatically.

Do I need to know these terms to use motion design tools?

Not necessarily. Template-based tools like Frametion handle keyframes, easing, and timelines behind the scenes, so you can create motion content without learning the vocabulary first.

What’s the difference between a codec and a file format?

A file format (like MP4 or WebM) is the container that holds the video data. A codec (like H.264 or VP9) is the method used to compress that data inside the container.

Why does easing matter in animation?

Without easing, motion looks robotic because it moves at a constant speed. Easing mimics how things move in the real world, accelerating and decelerating naturally.

Why This Vocabulary Is Worth Knowing

None of these terms are complicated on their own — most of them describe things you already understand intuitively from watching videos and using apps every day. Having the vocabulary just makes it easier to talk about motion work clearly, troubleshoot problems faster, and follow along with tutorials or documentation without getting stuck on unfamiliar words.

Read other posts

All posts
Vertical studio with a portrait monitor showing a 9:16 frame grid, a laptop editing vertical video with Instagram and TikTok icons, and blue accent lighting.

Why Vertical Video Wins Now

Vertical video matches how people actually watch content on phones. Learn why full-screen 9:16 video wins in feeds, and how to create vertical motion content from scratch.

Learn More
Laptop on a stand showing a dashboard grid of vertical social campaign templates beside a mouse, succulent, and steaming mug on a blue-lit concrete desk.

Motion Graphics vs Live Action

Motion graphics and live action send different signals to viewers. Learn when each format works best, when to combine them, and how to choose for your next project.

Learn More
Professional video editing workstation with an ultrawide curved monitor showing coastal driving footage on a timeline, headphones, and teal backlighting.

24fps vs 30fps vs 60fps

Frame rate changes how motion feels on screen. Compare 24fps, 30fps, and 60fps to see when each works best for cinematic clips, everyday video, and smooth UI mockups.

Learn More