How to make Johnny Harris style map animations (free, with Claude)

To make a Johnny Harris style map animation, start from a finished map scene, press Copy code, and ask Claude to change the places, labels and colours in plain English. Then add the texture and pacing that define the look, and render the MP4 free on your own computer with npx hyperframes render.

The map style popularised by Johnny Harris is not one effect. It is a handful of moves used again and again: the camera falls from a whole globe down to a country and then a single town, a red line draws a route or a border while the camera follows it, big labels pin to a place for a beat and then leave, and everything sits on a tactile surface such as paper, a plaster relief or satellite imagery, with film grain and a slightly warm grade on top. Learn those moves and you can make maps like his for your own story.

Each move maps onto a scene you can copy. Globe zoom drops from space to a country and pins a city. 3D relief map route spreads a red route across a plaster coastline as a year counter rolls. Night flight across the globe draws a glowing path from sunset to dawn. Map with big labels lights countries one by one with large labels. Night map city route pans between two cities, and Map distance ruler draws a line while a kilometre counter ticks up. Documentary map investigation adds red pins and a thread on a paper map for the true crime and investigation feel.

The pacing matters as much as the visuals. Give each map one idea: a zoom, a route or a reveal, usually five to fifteen seconds, and cut between them under your voiceover. Let labels arrive on the word that names the place and leave before the next beat, rather than pinning a title in the corner for the whole clip. Keep red for the thing you want watched, and keep the rest of the map muted.

To get the texture, ask Claude for it in plain English once the places are right: "add a paper texture under the map, light film grain, a warm grade, and make the route red". Because the scene is HTML, Claude changes the layers and keeps the motion. Swap the country, the city coordinates and the label text the same way.

The usual way to make this look is After Effects with the GEOlayers plugin, which pulls real map data and terrain into a timeline and gives fine control, but you pay for both and need to know After Effects. Paid project files and templates on marketplaces get you closer faster, still inside After Effects. The Scenes route is free to render: the scene is HyperFrames code, Claude edits it, and HyperFrames makes the MP4 on your machine with no watermark.

Scenes is a library of 234 finished motion-graphics scenes made with Claude. Free accounts copy 2 scenes a day, and Ultimate is $10 a month or $99 a year for unlimited copies. Claude Code needs a paid Claude plan; Scenes and rendering are free.

The examples

  1. Globe zoom: fall from space to a country, pin a city, show a fact card
  2. 3D relief map route: a red route spreads across a plaster coastline as the years roll
  3. Night flight across the globe: a plane draws a glowing route from sunset to dawn
  4. Map with big labels: countries light up in turn, each with a big label
  5. Night map city route: pan along a glowing route and drop a pin on arrival
  6. Map distance ruler: a dashed line links two cities while a km counter ticks up
  7. Documentary map investigation: red pins and a thread on a paper map

Scenes to start from

Step by step

  1. Pick the map move you need

    Open the Maps category in the Scenes Library and choose the scene that matches your beat: Globe zoom for the fall from space, 3D relief map route for a red route, Map with big labels for a country reveal.

  2. Press Copy code

    Copy code gives you the exact scene as HyperFrames code, so your film looks like the one you watched. You can also ask Claude Code to copy it through the Scenes skill or the MCP connector. Free accounts copy 2 scenes a day.

    claude mcp add --transport http scenes https://scenes.design/mcp

  3. Change the places in plain English

    Tell Claude what you want, for example: "zoom to Peru instead of Japan, pin Cusco, label it in big white type, and make the route red". Give latitude and longitude for small towns so the pin lands in the right place.

  4. Add the texture

    Ask for the documentary finish: a paper or satellite texture under the map, light film grain, a warm grade, labels that leave before the next beat. Claude changes the layers and keeps the motion.

  5. Check and render the MP4

    HyperFrames renders the MP4 on your own computer, free, as often as you like, with no watermark. You need Node.js installed.

    npx hyperframes check my-map
npx hyperframes render my-map

Questions

What makes the Johnny Harris map style?

Zooms from globe to street, red route and border lines, big labels that pin and then leave, and a tactile base such as paper, relief or satellite imagery with film grain on top. The pacing, one idea per map cut under narration, matters as much as the look.

Is Scenes connected to Johnny Harris?

No. These are map scenes in the style popularised by his videos. Scenes has no affiliation with him or his channel.

Do I need After Effects or GEOlayers?

No. The scenes are HTML, CSS and JavaScript. Claude edits them from plain English and HyperFrames renders them to MP4, so you never open a timeline.

Should I use Copy code or Copy prompt?

Copy code. It gives you the exact film. Copy prompt asks Claude to rebuild the scene from scratch, so results come out close but not identical, and work best on Opus.

Is it free?

Browsing is free, free accounts copy 2 scenes a day, and rendering is free on your own computer with no watermark. Ultimate is $10 a month or $99 a year for unlimited copies. Claude Code needs a paid Claude plan.

More