How to Put Video on Your Service Page Without Hiring a Video Team

You have one page that matters. The pricing page, the service page, the productized offer page. There is no video on it.

Video. A short, branded, animated promo that opens with the offer, says it cleanly, and closes with the next step. Thirty seconds. The kind of thing real-brand pages have on them.

Video used to require an editor, a designer, and a motion person. Usually three different people. The cost was not the software... the cost was the team. If you have not been paying that cost, it is because you have been looking at the empty space on the page and deciding “later.” The path from “we should put video here” to “there is video here” had a gate in front of it. The gate was the team.

You just installed Claude Code, or you are about to. You want to use it for something real, on the page that already matters most. Video is the obvious thing the page is missing.

The thesis of this guide, in one line: video stopped requiring a video team.

There is now a desktop workflow that turns a plain-English description of the video you want into a finished MP4 file. The workflow is one terminal, one prompt, one render. You sit at the laptop you already use to run your business. You describe the video the way you would describe it to a freelancer. The MP4 lands in the project folder on your machine. You drag it into your page. You publish.

By the end of this guide, that is where you are. A rendered video file, sitting on your machine, ready to drag onto the page that matters most. The first time, you will feel the install... download, sign-in, scaffolding, and a first render that lands in a folder. Every render after that is faster. You have already paid the setup cost.

The editor, the designer, the motion person. The workflow in this guide replaces the team you would have hired.

The whole workflow runs on two tools. You install both today.

The first is Claude Code, an Anthropic product. Think of it as a plain-English coding agent that runs in your terminal. The Claude desktop app from Anthropic includes a Code mode that launches it, and that is how we run it in this guide. You describe what you want in regular sentences and it writes the code, runs the commands, and handles the technical work for you. You do not need to know how the code works. You only need to know what you want the output to be.

The second is Remotion, a framework that turns code into video. Free for individuals and small teams; companies above a certain size license it commercially. Licensing details are in the FAQ. You write a description of a video as code, point Remotion at it, and Remotion produces a finished MP4, pixel-perfect, repeatable, the same output every time you press render. It is built on React, the JavaScript library most modern web apps use for their interface. That detail matters in a second.

Why this pair, and not some other combination of tools. Claude Code is fluent in React. Remotion is React. The tool that writes the code and the tool that renders the video speak the same language. This means the entire pipeline, from “I want a thirty-second promo for this page” to a finished MP4, becomes describable in plain English. You are not gluing together a video generator, a stock-footage library, and an editor. You are describing one thing to one agent, and the agent handles the rest.

Claude Code writes. Remotion renders. You describe.

When the scaffold finishes, you see a node_modules/, a src/, a public/, and a package.json sitting in the project directory. The public/ folder is the one that matters later. That is where your brand assets live.

We timed it at roughly 10 minutes from no Claude desktop installed to a rendered MP4 sitting in the project's out/ folder. Your machine and your connection will move that number around. The takeaway is not the exact minute count. The install is short enough to do in one sitting.

Long, yes. Real prompts are not always one-liners. The shape is what matters, and the shape is doing four jobs at once. It names the page being promoted with a real URL, so Claude has a concrete destination to write toward. It hands Claude the open, the arc, and the close as literal copy instead of asking it to invent any of the words. The words on a marketing video are the part you do not outsource to a model, and writing them into the prompt removes the guesswork in both directions. It points at public/brand.json for color and usage conventions. It points at public/logo-white.png with the placement rule stated explicitly.

Your version of this prompt swaps the URL, the headline copy, the four outcomes, and the brand file paths. The structure stays the same.

What Claude Code does next is mechanical. It reads public/brand.json. It reads public/logo-white.png. It scaffolds the Remotion composition file under src/, writes the React and Remotion components to match the prompt, and kicks off the render. There is nothing for you to do during this step. Watch it happen.

Render time depends on your machine. For a thirty-second composition at 1080p, expect single-digit minutes. By the time you switch back to Remotion Studio, the MP4 is in out/.

The first-pass output landed at the full thirty seconds the prompt asked for. After watching it back, we opened Remotion Studio and trimmed the timing for tighter pacing, ending at roughly eighteen seconds. This is normal. Claude renders what you ask for; pacing is an editorial decision you make in Studio after seeing the output. The render is the draft. The trim is the edit.

The render landed publishable. Brand colors held. The four outcome flags read in monospace with the --01 through --04 numbering the prompt asked for. The logo sat where the prompt put it, on screen from second two onward. Animation stayed text-forward and on-brand. The one human call was pacing, covered in Section 04.

The MP4 is on your machine. Section 07 is where it goes.