Teaching & AI

Building animated explainers for lecture videos with Claude

13 minute read

Part 1 of 1 in the series AI and Education

You can build animated explainers for teaching videos without 3D software, animation skills or coding experience. Over the past few weeks I’ve used Claude (Opus 5.5) to make 2D and 3D animated cutaways for LSE100’s lecture videos. Below are five of them, followed by ideas for where the technique could work in other subjects and step-by-step instructions for doing it yourself.

LSE100 uses a flipped classroom format, in which students watch short video interviews with leading academics from across the School in preparation for their seminars. I have been filming and editing these videos for the past ten years, and in that time I’ve developed many ways of making visual cutaways that explain key concepts and define terms. Some ideas are hard to show in a static graphic, though, because they have layers or moving parts: a model with hidden levels, a cycle that sustains itself, a distinction between two ways of thinking. Animation can build those structures on screen as the speaker describes them.

The idea

My colleague Steven Williams, AI and Education Specialist in LSE’s Eden Centre, showed me some 3D model explainers he had made with recent Claude models, and they made me want to try the same approach for the cutaways in our videos.

The process I settled on:

  1. Generate a transcript of the video, with timestamps.
  2. Give the transcript to Claude. As Steven pointed out to me, Claude’s ability to do this work has improved markedly in recent models: Opus 5.5 handles it well, where earlier models couldn’t manage it.
  3. Discuss where I want cutaways, going back and forth with Claude about what it could build that would help students.
  4. Give it the visual palette to work from (for me, LSE red and the Roboto typeface).
  5. Build a clip, review it and iterate.

After the first video, ask Claude to write up everything you settled on as a style guide. I started each later video in a new conversation with the transcript and the style guide together, so the look and the ground rules were in place from the start.

Five explainers and the jobs they do

We’ve so far built clips for three sets of videos: an introduction to world orders for a seminar in the ‘How can we create a fair society?’ theme, an introduction to systems thinking, and videos for a seminar on AI in warfare for the ‘How can we control AI?’ theme. Each of the five clips below does a different job for students.

Presenting a model in full

In our introduction to systems thinking, Dr Savvas Verdis describes the iceberg model: every system has four layers, with events and patterns visible above the waterline, and structures and mindsets hidden beneath it. The model is a visual metaphor, but on camera it exists only in words. The animation presents the model in full and makes the metaphor literal. A 3D iceberg rises against a dark background, and the camera descends past the waterline as Verdis moves from the visible layers to the hidden ones. Each layer gains its own marking as he names it (scattered points for events, a wave for patterns, a grid for structures), and the deepest layer, mindsets, turns LSE red as he explains that this is what systems thinkers are most interested in.

A 3D iceberg. The camera descends past the waterline as each of the model's four layers (events, patterns, structures and mindsets) is named, and the deepest layer turns red.

Upgrading existing graphics

For Dr Jon Danielsson’s discussion of feedback loops in the same video, I already had a graphic built in PowerPoint: a map of risks in healthcare. Claude rebuilt it as an animated model. Health inequalities lead to economic inequality, which leads to doctor shortages, and when the final arrow closes the loop, the loop turns red and begins to pulse. A second loop, through privatisation, then joins it. A static arrow can only tell students that a loop sustains itself; the animation lets them watch it happen. We did the same for Verdis’s housing example, replacing my abstract diagram with low-poly 3D models of each actor in the housing market.

An animated risk map in which health inequalities, economic inequality and doctor shortages form a loop. When the loop closes it turns red and pulses, and a second loop through privatisation joins it.

A second way into a concept

Professor Mathias Koenig-Archibugi’s introduction to world order turns on a distinction between order and global governance, which our seminar is built around. The animation gives students a different visual language for the same idea, and so a second way to learn it alongside his spoken explanation. Actors of different sizes circle on visible tracks. Each time a large actor sweeps past a small red one, the small one is shoved off its track, in the same way every time: the order is predictable, but the weakest predictably lose out. As he defines global governance, the definition builds on screen (order, plus a shared goal, plus coordination), and the actors leave their tracks to move together towards a common goal.

Actors of different sizes circle on tracks, with the smallest repeatedly shoved aside. A definition of global governance then builds on screen, and the actors leave their tracks to move together towards a shared goal.

Following a distinction

Our AI in warfare seminar draws on interviews with Marissa Kemp and the late Professor Christopher Coker of LSE’s Department of International Relations. Kemp sets out a spectrum of autonomy in weapons systems: a human can be in the loop, on the loop, or out of it altogether. The animation gives students a clear way to follow this three-fold distinction. A cycle of four steps (detect, identify, decide, engage) runs beneath a marker showing where we are on the spectrum. In the loop, a red human figure sits on the ‘decide’ step, and each decision waits for their approval. On the loop, the figure lifts above the cycle, which now runs on its own, but steps in to halt it when needed. Out of the loop, the figure fades away and the cycle speeds up. Played on its own, the clip may feel slow, but each stage is timed to Kemp’s narration in the final video, which is possible because Claude builds from the timestamped transcript.

We made this one in 2D so that each stage could also become a looping GIF for the seminar’s slide deck.

A four-step cycle of detect, identify, decide and engage, shown with a human in the loop, on the loop and out of the loop.

Making the abstract concrete

Coker argues that machines ‘are not rational, they’re logical’, in a world ‘based on reason, not on logic’. It’s a striking line, but I found it hard to pin down, even as a philosopher, and on camera it stays abstract. The animation adds examples. It’s a split screen, with a black ‘Logic’ panel facing a white ‘Reason’ panel. First comes a dot-to-dot puzzle with a misprinted number: logic joins the dots in order and draws a zigzag, while reason sees the house it’s meant to make. Next, an ambulance arrives behind a car waiting at a red light: logic stays put, while reason edges over the stop line to make room but stops short of the junction. Finally, a figure carrying a rifle raises it overhead with a white flag: logic sees a weapon and keeps the label ‘Combatant’, while reason recognises a surrender.

A split screen comparing logic and reason through three examples: a misprinted dot-to-dot puzzle, an ambulance behind a car at a red light, and a figure surrendering with a white flag.

We built several other clips for the same videos on the same principles.

Keeping the visuals honest

The most important rule in my style guide is about integrity: the visual must never make a stronger claim than the speaker does. Because Claude works from the transcript, every visual can be pegged to the speaker’s own words.

In the order clip, for example, the weakest actors stay small and red even once they’re moving together under global governance. Koenig-Archibugi says that governance adds direction and coordination; he doesn’t say it makes the order fair. Whether redesigning global governance could do that is the question students tackle in the seminar, so the animation leaves it open.

The visual can still add things the speaker doesn’t say. Coker makes his distinction between logic and reason in a few seconds of the interview, so the clip adds examples that he doesn’t give himself. I think that’s appropriate, as long as the examples illustrate the speaker’s point rather than reinterpreting it through the choice of example. Claude was open about this. It told me that its reading of the distinction (logic applies a rule to whatever matches its terms, while reason grasps what the rule is for) was an interpretation rather than something Coker spells out, so I could check the examples against what he says.

Claude also raised its own doubts and left the decisions to me. For example, it wondered whether viewing the iceberg’s upper layers from below made them look less important than they are.

In Claude’s first version of the ambulance example, the reasonable car pulled over to the kerb behind the line. That broke no rule, so it didn’t illustrate the distinction. I pointed out that to make room, the car would have to edge over the line, breaking the letter of the rule while keeping to its point by staying out of the junction. Claude added a junction to the scene so that the difference is visible.

Other uses

The obvious use is any recorded teaching: lecture capture, flipped classroom videos, MOOCs and research explainers. The technique also reaches beyond video cutaways. Claude writes code that builds each scene from scratch, so most things you can describe as a structure, a process or a relationship can be animated.

In the social sciences, that might mean conceptual models that students usually meet as static diagrams: Ostrom’s design principles for the commons, path dependence, principal–agent relationships, or the stages of a policy cycle. In history and politics, it might mean contingency and counterfactuals, or competing normative theories shown side by side. In philosophy, thought experiments could be staged in space: Steven’s own example was Bentham’s Panopticon, which he built as an interactive Claude artifact that students could explore visually. The split-screen format of the logic and reason clip would suit any pair of concepts that students tend to blur, such as the letter and the spirit of a law, or correlation and causation.

My own research background is in philosophy of medicine, and I can imagine an animated evidence hierarchy that shows students how the pyramid has been contested. In the sciences and medicine, processes such as feedback in physiology or the spread of an infection through a network are natural candidates.

The animations can also live beyond the video. Short looping GIFs cut from a clip can go into slide decks or onto a course page, so a seminar can return to an idea that students first met in the video.

A looping animation of a four-step cycle of detect, identify, decide and engage. A red human figure hovers above the decide step, linked to it by a dotted line, while the cycle runs on its own. The title reads Human on the loop, with the Phalanx close-in weapon system as an example.

The ‘on the loop’ stage of the spectrum of autonomy clip, cut as a looping GIF for the seminar slides.

A conference talk could open with a 30-second animation of a paper’s core argument, and a public engagement video could make a theoretical model tangible. I’m also keen to try a pedagogical use: students building their own system maps and then working with AI to animate them. That would require them to be precise about what causes what, which is the kind of thinking LSE100 sets out to develop.

One caution: this technique is for conceptual and schematic visuals. Nothing in our clips shows real data, because I gave Claude none. If you want a chart that visualises real data from a source, I would be less confident in the accuracy of the visual representation.

Building your own explainers

You’ll need access to Claude with code execution and file creation turned on (this is a setting in Claude’s interface). Everything happens in conversation.

Claude has no dedicated 3D or video feature. Instead, it writes Python code in its code environment that builds each scene from scratch. For the 3D clips, that’s a small hand-built 3D renderer (using the PIL and numpy libraries) with a perspective camera, shaded shapes and simple low-poly models; the flat clips use a drawing library called pycairo. Claude renders each frame as an image, and a tool called ffmpeg assembles the frames into a video.

Start with a timestamped transcript

If your explainer is for a video, the transcript gives Claude the exact words and timings. Automatically generated transcripts contain errors (ours did), so check names, terms and timings against the footage.

Decide how much to steer

If you already know what you want, describe it. For the systems thinking video, I knew which moments needed graphics and what they should show, so I described them. If you’re less sure, ask Claude to propose ideas. For the world order video, my opening request was essentially:

Here is the transcript of my video. Identify the moments where a visualisation would carry an idea better than speech, rank them, and give me timestamps, a proposed design and any integrity risks for each.

Ask, too, which moments it wouldn’t animate, and why. This back-and-forth is where the pedagogical thinking happens, so engage with it critically: push back, merge ideas or reject them.

Give it your visual palette

Tell Claude your colours and typeface. A single accent colour, reserved for the key idea in each clip, tells students where to look. If your institution has a brand profile with its own colour scheme, stipulate it. LSE is very keen on its particular shade of red, and Claude matched it carefully for screen. It can also fetch openly licensed fonts such as Roboto itself.

Prototype one clip, then map the beats

Building one clip first lets you judge the quality and settle the look before committing to a set. For each clip, Claude can map every visual beat to an exact timestamp: when each label appears, when the camera moves, when the accent colour arrives. Check this against your own edit, because transcript timestamps are approximate.

Review stills before the full render

A full render takes several minutes, so ask for a contact sheet of six to ten key stills first. Claude reviewed these itself for overlapping text and framing problems, and revised the design before rendering, sometimes twice. Look above all for unintended messages: does the visual claim anything stronger than the speaker does? In 3D, check the camera angle as well as the content, since perspective can change what a shape seems to say. Claude renders longer clips in sections and joins them, because a single long render can time out; if it reaches the end of what it can do in one response mid-render, reply ‘continue’. Afterwards, ask it to pull frames from the finished video, particularly at the joins, to check them.

Bring your own materials and ideas

Some of my best results came from uploading old PowerPoint slides and asking Claude to rebuild them. It kept every arrow faithful to my original, and asked me where it couldn’t infer something rather than guessing. Rough ideas are worth offering too. The dot-to-dot puzzle started as a half-formed suggestion of mine, and it came back better than I’d described it, with details such as the misprinted dot that I hadn’t thought of.

Think about the edit as a whole

A video made mostly of cutaways buries the speaker, so leave them on screen between clips, and end each clip shortly before a key line so they can deliver it to camera. If two clips in the same video or seminar deal with similar-sounding ideas, ask for them to look visibly different (a different background, structure and use of the accent colour) so that students don’t conflate them. A recurring visual element can do the opposite job, helping students connect related ideas across a course.

Ask for slide versions

Once a clip works, ask for its key stages as looping GIFs. They link the video students watch beforehand to the seminar itself.

Iterate in plain language

Every change I asked for was a short message, such as ‘remove the housing references and let the voiceover carry them’, ‘use the black background throughout’ or ‘could the car pull slightly across the line?’. You direct the changes, and Claude writes the code.

Keep the style guide

My style guide covers:

  • palette, with LSE red as the single accent;
  • typography, with fixed sizes and positions for titles, definitions and captions;
  • a visual vocabulary, such as spheres for abstract actors and glass shells for boundaries;
  • motion: smooth easing, slow camera movements, and a one-second hold at the end of each clip as an edit handle;
  • technical output: 1920×1080 at 25 frames per second, as an MP4;
  • the integrity rule: the visual must never make a stronger claim than the speaker does.

Limitations

Claude works from the transcript rather than watching your edited video, so your eye on the final edit is essential. Renders take time, sometimes ten or fifteen minutes for a pair of longer clips. The integrity judgements are a collaboration: Claude is good at flagging where a visual might overclaim, but you know your speakers and your students, and the final call is yours.

I’m delighted with the results, but the polish matters less to me than what building them demands. A good explainer forces you to be exact about the structure of an idea, and about what the speaker is and isn’t claiming. I’d want that discipline in all our teaching materials, with or without AI.

More in Teaching & AI

  1. New chapter: Making group work ‘work’

    Jillian Terry and I have a chapter in a new open access UCL Press book on supporting sessional teachers, drawing on our experience of LSE100's group research projects.

  2. Cultural Bias in Language Models: The Top 10 Test

    How can AI-generated "Top 10" lists of cultural influencers expose the cultural biases and defaults that are built into our most popular language models? I propose and report an initial test using lists of the Top 10 most influential musicians.

  3. Golem.AI: The Experimenter's Regress and AI Decision Systems

    How can the concept of the experimenter's regress help us understand the problems in AI decision systems? I explore two forms of circularity that can underpin AI decision tools through the lens of Collins and Pinch's 'The Golem'.