How to prompt Gemini 3.1 for Epic animations

So you probably have been seeing different animation showcasing where people talking about how awesome Gemini 3. 1 Pro is in ter of producing animation and SVG design. But when you try yourself, you probably get those type of shitty PowerPoint slide type of animation that it just very far away from production ready. And what is making difference between those meteor slide deck type of animation versus wellcraft animation video like this? I've been experimented a lot using Gemini 2. 0 and one pro to produce specifically product launch videos and I think I found a pretty good process that can make a big difference on the outcome and this is what I want to share today. So the key concept here is basically two things. One is that when building animation you absolutely want to plan first from the planning you should get a scene based prompt the detailing timing and UI state. One of the key reasons your animation generated by model is bad is because you're giving a vague and open-ended request like animate this or make a prop which leads to chaotic uncoordinated motions and efforts. Especially for animation it is complicated task require a lot of spatial thinking which model is not specifically trained at. So what you want is actually separate out the planning and building into different stage and artifact of planning is it structured scene based prop. This is the most credible part. Even though you do very basic things like this by structure prompt to explain very clearly what are all the different things you want a model to animate and what different UI state for each thing and just by doing this even without any special prompt techniques I guarantee you almost get two to threex better results cuz this takes away all the spatial thinking and planning out of model so you can really focus on implementation and have a rough understanding about the overall timeline but to do it properly a good syn prompt basically composed of four different things in my opinion. One is timing. Another is clearly defined state plus some special keyword effect that you can include to instruct animation further. Let's take this video example from rocket where he made a video about open claw. You can see the result here is much better than your normal product launch video that looks like powerpoints. And if you look at his prompt, it is doing this exact scene based prompt structure where for each scene it will talk about how long this thing should be and detailed explanation of the state including what should be in the frame as well as some special effect keywords like 3D perspective rotation fading with stctor delay tagline with standard item reviews. And with those things together, it is capable to follow instruction and produce really high quality result. And here I was able to do something similar to generate a product launch animation video like this by producing scene based prompt where each scene it would talk about the timing, the special effects, the state, the action and technical details. So this is kind of just an composition of a good animation prop. And I know sometimes it's not easy to construct such prompt. That's why I built a skew in super design skill library for pera release demo animation. And with this skill, I was able to generate nice per launch video like this for our inspire mode based on our real UI and generate nice scene based animation prop. The process was simple. I firstly use our Chrome extension to clone any UI component that I want to make the animation around. If you don't know, Super Design has this free Chrome extension and they allow you to clone website into pixel perfect vibe coding playground or clone just very specific UI components. It will generate cleanup version of HTML that you can paste in any coding agent. But if you paste into super design, it will generate a pixel perfect clone of whatever UI you captured. And based on that, I can select this UI do dash skill library. And under animation, there's a product release demo skill which I can click on and give a prompt. We just released an inspire mode which allow user to find relevant design inspiration as a design. Help me make a product launch animation video to showcase a user journey. Initially zoom into prompt input with build and plan mode only. Then inspire mode show up and cursor click to switch and see inspiration items popping up here. Let's making sure we select the uh Gemini 3. 1 Pro mode since it is the best model for animations. And this skill will start ask me some target questions about animation details including what the initial state should be, how the tabs should be showing up, where the inspiration item should be popping out and how the cursor should be looking like. And it'll create this animation plan with a prompt breakdown like this for detailed timing and UI state. And at bottom it has this summary. And I can make changes to it. But if it looks good, I can just tell it to start building. And with this plan, in the end, it generates awesome product launch videos that I'm pretty happy with. So, this is something you can go and try out today for free. All you need to do just go to SKU library, find this product release demo, skew, and start making real UI based product launch videos. I'll put the link to download both this Chrome extension as well as super design platform below. So, you can try for free. But as I mentioned before, everything I talk about here is a general prompting process that you can use with cloud code, cursor, anything else. We just made that process easier. Thank you and I see you next