|
| 1 | +# EfficientManim — MCP & AI Features Guide |
| 2 | + |
| 3 | +A plain-English guide to using the AI Panel, Auto Voiceover, and MCP Agent Mode from inside the app. No coding knowledge required for the first half. The second half covers the MCP Agent Mode for power users. |
| 4 | + |
| 5 | +--- |
| 6 | + |
| 7 | +## Table of Contents |
| 8 | + |
| 9 | +1. [What Changed in This Update](#1-what-changed-in-this-update) |
| 10 | +2. [The AI Panel — Where Everything Lives](#2-the-ai-panel--where-everything-lives) |
| 11 | +3. [Normal AI Mode — Generating Manim Code](#3-normal-ai-mode--generating-manim-code) |
| 12 | +4. [The Voiceover Tab — Adding Audio to Your Animations](#4-the-voiceover-tab--adding-audio-to-your-animations) |
| 13 | + - [Generating Audio](#generating-audio) |
| 14 | + - [Previewing Audio](#previewing-audio) |
| 15 | + - [Attaching Audio to a Node](#attaching-audio-to-a-node) |
| 16 | +5. [Auto Voiceover — One Click, Entire Project](#5-auto-voiceover--one-click-entire-project) |
| 17 | +6. [MCP Agent Mode — AI That Edits Your Scene Directly](#6-mcp-agent-mode--ai-that-edits-your-scene-directly) |
| 18 | + - [What It Does](#what-it-does) |
| 19 | + - [How to Use It Step by Step](#how-to-use-it-step-by-step) |
| 20 | + - [What Kinds of Instructions Work Well](#what-kinds-of-instructions-work-well) |
| 21 | + - [Reading the Results Panel](#reading-the-results-panel) |
| 22 | +7. [Tips & Troubleshooting](#7-tips--troubleshooting) |
| 23 | + |
| 24 | +--- |
| 25 | + |
| 26 | +## 1. What Changed in This Update |
| 27 | + |
| 28 | +Here is a quick summary of everything that was added or changed so you know what to look for when you open the app. |
| 29 | + |
| 30 | +**AI Panel moved to the left side.** It used to be a tab in the right panel. It is now a permanent panel docked on the left side of the window. It cannot be dragged, undocked, or closed — it is always there. |
| 31 | + |
| 32 | +**Voiceover works on every node type.** Before, you could only attach audio to Text and Tex nodes. Now every node in your scene — Circles, FadeIns, Transforms, everything — can have a voiceover attached to it. |
| 33 | + |
| 34 | +**The Voiceover tab got a full audio player.** After generating audio you can now preview it directly inside the app with a play button, pause button, stop button, a seek slider, and a timer showing current position and total duration. |
| 35 | + |
| 36 | +**"Add to Animation Node" button.** There is a new green button in the Voiceover tab that attaches your generated audio to whichever node you have selected in the dropdown. Before you had to generate and it would try to auto-attach. Now it is two separate deliberate steps. |
| 37 | + |
| 38 | +**Auto Voiceover checkbox in the AI Panel.** Tick one checkbox and Gemini will go through every single node in your scene, write a voiceover script for each one, generate the audio, and attach it — completely automatically. Your whole project ends up render-ready with synced audio in one go. |
| 39 | + |
| 40 | +**MCP Agent Mode checkbox in the AI Panel.** A new mode where instead of generating Manim code, Gemini actually operates the application directly — creating nodes, changing parameters, and building your scene for you. |
| 41 | + |
| 42 | +--- |
| 43 | + |
| 44 | +## 2. The AI Panel — Where Everything Lives |
| 45 | + |
| 46 | +When you open the app, look at the **left side of the window**. The AI Panel is the tall panel docked there permanently. It has a blue header that says **🤖 AI Assistant**. |
| 47 | + |
| 48 | +Inside the AI Panel you will see: |
| 49 | + |
| 50 | +- A text box where you type your prompt |
| 51 | +- Two checkboxes just below the text box — **Enable Auto Voiceover** and **MCP Agent Mode** |
| 52 | +- The **⚡ Generate Code** button |
| 53 | +- A scrollable response area below the button |
| 54 | + |
| 55 | +Everything AI-related flows through this one panel. You do not need to switch tabs to access it. |
| 56 | + |
| 57 | +--- |
| 58 | + |
| 59 | +## 3. Normal AI Mode — Generating Manim Code |
| 60 | + |
| 61 | +This is the default behavior — nothing special to enable. |
| 62 | + |
| 63 | +**Step 1.** Make sure both checkboxes (**Auto Voiceover** and **MCP Agent Mode**) are **unchecked**. |
| 64 | + |
| 65 | +**Step 2.** Click inside the prompt text box and type what you want. Be specific. Example: |
| 66 | + |
| 67 | +> *Create a red square that rotates 90 degrees, then a blue circle that fades in next to it.* |
| 68 | +
|
| 69 | +**Step 3.** Click **⚡ Generate Code**. |
| 70 | + |
| 71 | +**Step 4.** Watch the response area fill in. Gemini streams the code back to you in real time. |
| 72 | + |
| 73 | +**Step 5.** Once it finishes, the **✅ Merge to Scene** button lights up. Click it to add the generated nodes to your scene graph. |
| 74 | + |
| 75 | +**Step 6.** If you do not like the result, click **❌ Reject** and try a different prompt. |
| 76 | + |
| 77 | +> **Tip:** The more specific your prompt, the better the result. Instead of "make an animation," try "make a MathTex equation that writes itself on screen over 2 seconds, then fades out." |
| 78 | +
|
| 79 | +--- |
| 80 | + |
| 81 | +## 4. The Voiceover Tab — Adding Audio to Your Animations |
| 82 | + |
| 83 | +Click the **🎙️ Voiceover** tab in the right panel. This is the AI TTS (text-to-speech) studio. |
| 84 | + |
| 85 | +### Generating Audio |
| 86 | + |
| 87 | +**Step 1.** Choose a voice from the **Voice** dropdown at the top. The options are Puck, Charon, Kore, Fenrir, Aoede, and Zephyr. Zephyr is selected by default — it is a clear, neutral voice that works well for most animations. |
| 88 | + |
| 89 | +**Step 2.** Type your script in the **Script** text box. Write it like you are talking out loud, not like code. Example: |
| 90 | + |
| 91 | +> *A red square appears and rotates ninety degrees clockwise.* |
| 92 | +
|
| 93 | +**Step 3.** Click **⚡ Generate Audio**. A thin progress bar appears under the button while Gemini generates the audio. This usually takes 3–8 seconds depending on the length of your script. |
| 94 | + |
| 95 | +**Step 4.** When it finishes, the progress bar disappears and the audio player in the middle of the panel becomes active. |
| 96 | + |
| 97 | +--- |
| 98 | + |
| 99 | +### Previewing Audio |
| 100 | + |
| 101 | +Once audio is generated, the player in the **🎵 Audio Preview** section becomes usable. |
| 102 | + |
| 103 | +- **▶ Play** — starts playback |
| 104 | +- **⏸ Pause** — pauses (click ▶ again to resume) |
| 105 | +- **⏹ Stop** — stops and resets to the beginning |
| 106 | +- **The slider** — drag it to jump to any position in the audio |
| 107 | +- **The time display** — shows your current position and total duration in MM:SS format, for example `00:04 / 00:09` |
| 108 | + |
| 109 | +Listen to it. If the voice sounds off or the pacing is wrong, edit your script and click Generate Audio again to re-generate. |
| 110 | + |
| 111 | +--- |
| 112 | + |
| 113 | +### Attaching Audio to a Node |
| 114 | + |
| 115 | +Once you are happy with the audio, attach it to a node in your scene. |
| 116 | + |
| 117 | +**Step 1.** Look at the **🔗 Attach to Animation Node** section below the player. |
| 118 | + |
| 119 | +**Step 2.** Open the dropdown. It lists every node currently in your scene. Animation nodes show a 🎬 icon, Mobject nodes show a 🔷 icon. Every type is available — not just text nodes. |
| 120 | + |
| 121 | +**Step 3.** Select the node this voiceover belongs to. |
| 122 | + |
| 123 | +**Step 4.** Click the green **📎 Add to Animation Node** button. |
| 124 | + |
| 125 | +A confirmation dialog appears telling you the audio was attached and showing the detected duration. Click OK. |
| 126 | + |
| 127 | +The node now has the audio file linked to it. When you render, the audio duration is used for timing. You can see it in the Properties panel if you select the node. |
| 128 | + |
| 129 | +--- |
| 130 | + |
| 131 | +## 5. Auto Voiceover — One Click, Entire Project |
| 132 | + |
| 133 | +This feature uses Gemini as an autonomous agent that handles the entire voiceover workflow for every node in your project at once. |
| 134 | + |
| 135 | +**When to use it:** You have finished building your scene and you want to add narration to all of it without writing scripts or attaching audio manually. |
| 136 | + |
| 137 | +**Step 1.** Make sure your scene is complete and your nodes are named in a way that makes sense. Auto Voiceover uses the node names and class types to write the scripts — a node called "intro_circle" gets a better script than one called "node_4." |
| 138 | + |
| 139 | +**Step 2.** Go to the AI Panel on the left side. |
| 140 | + |
| 141 | +**Step 3.** Tick the checkbox that says **🎙️ Enable Auto Voiceover**. |
| 142 | + |
| 143 | +**Step 4.** In the prompt box, you can optionally type a style note like *"keep scripts under 8 words each"* or *"use an enthusiastic tone."* You can also leave it blank. |
| 144 | + |
| 145 | +**Step 5.** Click **⚡ Generate Code** (the button label does not change when modes are active). |
| 146 | + |
| 147 | +**What happens next:** |
| 148 | + |
| 149 | +The response area shows you what the agent is doing in real time. It goes through these stages automatically: |
| 150 | + |
| 151 | +1. Reads all nodes in your scene |
| 152 | +2. Sends them to Gemini, which writes a short voiceover script for every node |
| 153 | +3. The scripts appear in the response panel so you can read them |
| 154 | +4. For each script, audio is generated one at a time via the TTS system |
| 155 | +5. Each audio file is attached to its corresponding node |
| 156 | +6. When all nodes are done, the graph compiles automatically |
| 157 | + |
| 158 | +At the end you see a message that says **🎬 Auto Voiceover complete! All nodes have been synced and the project is render-ready.** A dialog also pops up confirming this. |
| 159 | + |
| 160 | +**Your project is now fully voiceover-synced.** Every node has an audio file attached. Durations are stored. You can hit render. |
| 161 | + |
| 162 | +> **Note:** Auto Voiceover generates audio sequentially, one node at a time. If you have 10 nodes it might take a minute or two. You can watch the progress in the response panel — each node shows a green ✅ when its audio is attached. |
| 163 | +
|
| 164 | +--- |
| 165 | + |
| 166 | +## 6. MCP Agent Mode — AI That Edits Your Scene Directly |
| 167 | + |
| 168 | +### What It Does |
| 169 | + |
| 170 | +In normal mode, Gemini generates Python code and you merge it into the scene. In MCP Agent Mode, there is no code generation step. Instead, Gemini looks at your current scene, figures out what needs to happen, and then **directly creates nodes, sets parameters, and modifies your scene** as if it had a mouse and keyboard. |
| 171 | + |
| 172 | +Think of it like this: normal mode hands you blueprints. MCP Agent Mode sends in a contractor who builds it for you. |
| 173 | + |
| 174 | +--- |
| 175 | + |
| 176 | +### How to Use It Step by Step |
| 177 | + |
| 178 | +**Step 1.** Open the AI Panel on the left side of the window. |
| 179 | + |
| 180 | +**Step 2.** Tick the checkbox that says **🔌 MCP Agent Mode**. |
| 181 | + |
| 182 | +**Step 3.** Type your instruction in the prompt box. Write it naturally, like you are asking a colleague. Examples: |
| 183 | + |
| 184 | +> *Add a large blue circle in the center and a FadeIn animation for it.* |
| 185 | +
|
| 186 | +> *Change the color of the node called "title_text" to yellow.* |
| 187 | +
|
| 188 | +> *Add a MathTex node showing the Pythagorean theorem and a Write animation.* |
| 189 | +
|
| 190 | +**Step 4.** Click **⚡ Generate Code**. |
| 191 | + |
| 192 | +**Step 5.** The response panel shows Gemini's raw command plan streaming in. It looks like a JSON list — that is normal, that is the list of actions Gemini decided to take. |
| 193 | + |
| 194 | +**Step 6.** Once streaming finishes, the app automatically executes every command. The response panel updates to show the results: |
| 195 | + |
| 196 | +- A **green ✅** next to each command that succeeded |
| 197 | +- A **red ❌** next to any command that failed, with a short reason |
| 198 | + |
| 199 | +**Step 7.** Look at your scene graph. The nodes Gemini created are already there. The graph compiles automatically at the end. |
| 200 | + |
| 201 | +--- |
| 202 | + |
| 203 | +### What Kinds of Instructions Work Well |
| 204 | + |
| 205 | +**Good — specific and actionable:** |
| 206 | +- *"Add a red square named box1 and a FadeIn animation for it"* |
| 207 | +- *"Create a Text node that says 'Hello World' and a Write animation"* |
| 208 | +- *"Add a Transform animation between the two circles already in the scene"* |
| 209 | +- *"Switch to the Properties tab"* |
| 210 | +- *"Save the project"* |
| 211 | + |
| 212 | +**Less good — too vague:** |
| 213 | +- *"Make it look better"* |
| 214 | +- *"Do something cool"* |
| 215 | +- *"Fix the animation"* |
| 216 | + |
| 217 | +**Good for modifications (using existing node names):** |
| 218 | +- *"Set the color of the node called 'hero_circle' to gold"* |
| 219 | +- *"Rename the node called 'node_1' to 'intro_shape'"* |
| 220 | + |
| 221 | +> **Tip:** Name your nodes clearly as you build. Gemini can see all the node names in your scene and uses them when planning modifications. A scene with nodes named "intro_circle," "title_text," and "fade_in_title" is much easier for it to work with than one full of "node_1," "node_2," "node_3." |
| 222 | +
|
| 223 | +--- |
| 224 | + |
| 225 | +### Reading the Results Panel |
| 226 | + |
| 227 | +After execution the response panel shows a summary that looks like this: |
| 228 | + |
| 229 | +``` |
| 230 | +🔌 MCP Agent Mode |
| 231 | +Instruction: Add a blue circle and fade it in |
| 232 | +
|
| 233 | +[...Gemini's command plan streams here...] |
| 234 | +
|
| 235 | +Executing 3 commands: |
| 236 | +✅ create_node → {'id': 'f3d875...', 'name': 'blue_circle'} |
| 237 | +✅ create_node → {'id': '9a2bc3...', 'name': 'fade_in_1'} |
| 238 | +✅ compile_graph → {'message': 'Graph compiled.'} |
| 239 | +
|
| 240 | +Agent finished. 3/3 commands executed successfully. |
| 241 | +``` |
| 242 | + |
| 243 | +If something goes wrong it looks like: |
| 244 | + |
| 245 | +``` |
| 246 | +✅ create_node → {'id': 'f3d875...', 'name': 'blue_circle'} |
| 247 | +❌ set_node_param — Node not found: '???' |
| 248 | +✅ compile_graph |
| 249 | +
|
| 250 | +Agent finished. 2/3 commands executed successfully. |
| 251 | +``` |
| 252 | + |
| 253 | +The error message tells you what went wrong. In the example above, Gemini tried to reference a node by an ID it guessed incorrectly. You can simply try the instruction again — Gemini re-reads the scene each time including the newly created node from the first attempt, so it usually succeeds on the second try. |
| 254 | + |
| 255 | +--- |
| 256 | + |
| 257 | +## 7. Tips & Troubleshooting |
| 258 | + |
| 259 | +--- |
| 260 | + |
| 261 | +**The AI Panel is gone / I can't find it.** |
| 262 | +It is on the left side of the main window as a permanent docked panel. It cannot be closed or moved. If your window is very narrow it might be squished — try making the window wider or dragging the splitter between the left panel and the canvas. |
| 263 | + |
| 264 | +--- |
| 265 | + |
| 266 | +**Auto Voiceover finished but some nodes show ❌.** |
| 267 | +This usually means the TTS API had a hiccup on one node. The other nodes are fine. You can manually go to the Voiceover tab, type a script for the missed node, generate audio, and attach it with the **📎 Add to Animation Node** button. |
| 268 | + |
| 269 | +--- |
| 270 | + |
| 271 | +**The audio preview player does not have any sound.** |
| 272 | +Make sure your system volume is up and no other app is holding the audio device exclusively. The player uses your default system audio output. Try clicking Stop and then Play again. |
| 273 | + |
| 274 | +--- |
| 275 | + |
| 276 | +**MCP Agent Mode created the wrong nodes.** |
| 277 | +Try being more specific in your prompt. Mention the exact Manim class names if you know them — for example "a Circle mobject" instead of just "a circle." Also check that your existing nodes have meaningful names, since Gemini reads them to understand the scene context. |
| 278 | + |
| 279 | +--- |
| 280 | + |
| 281 | +**"Generate Code" does nothing when I click it.** |
| 282 | +Check that you have typed something in the prompt box. An empty prompt is ignored silently. Also check your Gemini API key is set — go to **File → Settings** and make sure the API key field is filled in. |
| 283 | + |
| 284 | +--- |
| 285 | + |
| 286 | +**The voiceover audio duration shows 0.0 seconds.** |
| 287 | +This happens if the `pydub` library is not installed. The audio file still gets attached correctly — only the duration metadata is missing. To fix it, run `pip install pydub` in your terminal and restart the app. |
| 288 | + |
| 289 | +--- |
| 290 | + |
| 291 | +**I attached audio to the wrong node by accident.** |
| 292 | +Go to the Voiceover tab, select the correct node in the dropdown, and click **📎 Add to Animation Node** again with the right audio loaded. It will overwrite the previous attachment. Alternatively, use MCP Agent Mode with the instruction *"remove the voiceover from the node called [name]"*. |
| 293 | + |
| 294 | +--- |
| 295 | + |
| 296 | +**MCP Agent Mode says "Cannot connect to main window."** |
| 297 | +This is rare and usually means the app was in a loading state when you clicked Generate. Wait a moment and try again. |
| 298 | + |
| 299 | +--- |
| 300 | + |
| 301 | +**Auto Voiceover is taking a very long time.** |
| 302 | +TTS generation is done one node at a time to avoid hitting API rate limits. A scene with 15 nodes might take 3–4 minutes. This is normal. You can watch the progress in the response panel — each completed node shows ✅. The app remains fully usable while it runs in the background. |
0 commit comments