AI Motion Graphics: Data, Icons and Automation

When you say "make me an animation" to artificial intelligence, what comes out is a graph that usually moves but doesn't say anything, whereas with the same tool, with the right inputs, it's possible to produce moving graphs that actually carry your content. In this article, I tell you four layers: real data, ready beings, your own visuals, and automatically graphs from the video.

Why are moving graphics credits coming up?

It's not in the animation engine, it's in the input. The "make a good animation" request doesn't give the model any limits, so it creates the default: abstract shapes, general transitions, meaningless movement.

The common feature of the good moving graph is: "The movement tells one thing. " The number grows, the process appears, the process is gradually opening up. When the movement itself is the goal, the result becomes decorative and forgettable.

Layer 1: Turning real data into animation

Here's the fastest profit. If you have concrete numbers, you can give them directly to animation: comparative bar graphics, time-changing values, share distributions.

In practice, it's this thing that happens: what pens are you going to compare, you're going to specify the value of each of them, the color approach and the logos, and the model turns them into an interactive, animated graph.

The important part is: click the style you like.** When you say, "Use this style in all the bar graphs after this," your graphs begin to look alike and your content becomes a well-known visual language. That's the difference between producing one beautiful graph and having a consistent graphic language.

Layer 2: Increase quality with ready beings

One of the weakest places in the model is to produce icons, and the icons are the ones that raise the quality that is perceived most.

The solution is to bring the icon from a ready set instead of drawing it into a model. Icon libraries and ready animation archives (including active icons in the Lottie format) exist for this job. You make the assets you download into a library and refer to the model.

Three rules:

• ** Use one style. ** In a presentation or on a video set, icons are from the same family. Mixing style is worse than using bad icon.
• ** Check the language.** Some are free of charge, some are paid in commercial use. This is not a negotiation in the customer business.
• The search for icons on every project takes back the time you've earned.

Layer 3: Creating and installing your own images

The ready beings raise the base, but they don't make you original, and in the third layer, you produce backgrounds, illustrations and tissues yourself and put them into animation.

The flow is simple: you create the visual image you want in the visual production vehicle, you choose it, you pass it on to the design environment, you place it in the animated scene. The cost stays at a few cents per visually, but the sense of stock is completely lost.

Layer 4: Autographing from video

This is the actual gain and the least-known part of the content manufacturers.

If you have a video (your own record or a connection), you can ask the model to remove the "time-stamped transcript" (a time-stamped transcript) a match to the number of seconds each word is said, which means nothing on its own, but makes the next step possible.

The next step you ask the model, what moments are worth visualizing in this video?* The model scans the speech, "You're doing a comparison here, you're going to go here, you're counting three steps here, you're going to have an animation here," and then he makes graphics for those moments and delivers them with timestamps.

As a business flow, the result is that you're shooting the video, and the rest of it's mostly automatic, and instead of thinking, "I'd better put something here" on the editing table, you have the list of proposals.

Layer 5: Research step not to skip

If you're talking about a comparison in the video, but you don't say the numbers clearly, the model has to find those numbers somewhere, and if he doesn't find them, he's making them up.

So put a "research step" into the flow: Let the data used in the graphics be removed from a real source and the source is determined. Not just the raw HTML of the pages, but the scraping tools that attract the relevant content are both cheap and practical for this job.

My rule is: "I'm not going to graph any number that I can't show the source of.** A good-looking wrong graph costs much more than an ugly right graph.

Time, rhythm and softening

The most common reason for moving graphs to be amateur is timing. The model does not ask these values, it uses the default. My initial values:

• "Introduction animations:** 200-400 ms. Less noticeable, longer wait.
• "Scene passes:** 400-600 ms.
• ** Counting animations:** 800-1200 ms. The number has to be slow enough to read, not squeeze.
• A curve that starts and slows down for entry, the opposite for exit. The linear movement is always mechanical.
• Instead of the five elements that appear at the same time, five items that come in between them with a 60-80 ms delay.

The last item gives the cheapest quality, and instead of showing the items collectively, bringing them in order makes the same design feel different.

And the negative rule is: "Don't let more than two things move in one scene at a time. " When everything moves, the eye can't focus anywhere, and what the graph means is lost.

Select format according to the delivery location

You can't put the same graph everywhere in the same way.

• Web page: HTML-based output best scaled, file size small, text selectable. Lottie format for light-moving icons fits.
• Social video: Export as video file. 9:16 for vertical content, 1:1 or 4:5 for current transmissions.
• "Subject:** in short loops, where it can work without voice language.

There's a practical threshold on the time side: a graphic scene on social media is shifting after 3-5 seconds. If what you want to talk about is longer, split into a few short scenes instead of one long scene.

Motion sensitivity and accessibility

This is what almost all of the moving graphics makers skip. For some users, movement is a real effect that goes to dizziness and nausea.

There's a standard solution to this on the Web side: to limit animation for users who have opened the "restraint" setting in the operating system. You don't have to completely remove the animations in the HTML output you're producing, it's often enough to shorten the times and remove the big changes.

Two more rules:

• No auto-player voice. If you need sound, let the user start it.
• "Let there be no more than three blinkings in the vision. " It's not an aesthetic choice, it's a threshold that can trigger seizures.

You don't have these controls in the graphics that are embedded in the video, so avoid fast blinking and high contrast vibrations from the beginning.

Where should it stop?

You don't have to build this whole chain for every context.

• For a one-time visual, you only need to be on the board 1**.
• If you're producing regular content, set up the "cat 2**" once; it always comes back.
• If you're only producing multiple videos a week, the maintenance of automation is more than enough.

And here's the thing: use the animation not to hold the audience, but to support the narrative. A continuous motion screen squeezes as fast as a screen that never moves.

Questions that are often asked

Do I need to learn a separate program for animation?

This is not for business flow. Because the outputs are HTML based, you can work on the browser, take video, and put them in video, and you only need professional editing programs when you need frame-by-square control.

Can I use the animations I produce in business?

There's no problem with the parts that you produce. You have to be careful with the ready beings that you put into it: icon sets, ready animations and fonts that come with their own licenses.

What does a time-stamped transcript do?

Two things: to put the graph in the right place, and to produce subtitles, knowing what you're saying at the moment, and it's the same thing that feeds them both.

What's the most common error in data graphics?

Using unconfirmed numbers. Secondly, showing too much data is a single idea in a graph; if you compare, two or three pens will suffice.

In a nutshell

What makes the difference in motion graphics is not the ability to animation, but what you give to animation. The real data doesn't look like the work that comes out of these four is both fast and artificial intelligence products, if it's true, it's a consistent existence library, it's your own visuals, and it's confirmed numbers.