Back/Marketing/Cursor
IntermediateMarketingCursor

How to Recreate an Animated SVG Logo with AI When Source Files Are Missing

Facing a tight deadline with no source files? This workflow shows you how to use Cursor to recreate a complex, animated SVG logo from just a static image and simple, descriptive prompts.

From How I AI

How I AI: Atlassian's Joel Unger on Prototyping UI, Animating Logos, and Illustrating Puppies

with Claire Vo

How to Recreate an Animated SVG Logo with AI When Source Files Are Missing

Tools Used

Cursor

AI-first code editor

Step-by-Step Guide

1

Start with the Static Vector Art

When faced with recreating an animation without the original files, begin by providing the static vector art of the logo to Cursor.

2

Prompt the Animation into Existence

Use a simple, descriptive prompt to tell the AI what kind of animation you want. Focus on the action rather than the technical details.

Prompt:
Can you make these little bars go up and down? ...dance the little animation up and down.
3

Refine the Animation with Specific Data

The initial AI output might be technically correct but lack the right feel. Guide the AI by providing specific constraints. For example, use an online tool to find the exact duration of the original animation in milliseconds and feed this detail to Cursor to perfect the timing.

4

Iterate with Small Adjustments

Engage in a back-and-forth conversation with the AI to fine-tune the result. Provide small, corrective feedback until the animation is pixel-perfect.

Pro Tip: Phrase your feedback like you're giving notes to a junior designer, e.g., 'you have a few pixels to the left, a few pixels to the right'.
5

Deploy the Final Animated SVG

Once the animation is perfected, you have a scalable, performant SVG asset ready to be dropped into the codebase, allowing you to meet tight deadlines without compromising on quality.

Become a 10x PM.
For just $5 / month.

We've made ChatPRD affordable so everyone from engineers to founders to Chief Product Officers can benefit from an AI PM.