# Website to video: turn your homepage into a launch video

> How to turn your website into a launch video: which parts of the homepage make good scenes, a 30 second structure built from your own sections, and what to add when the page isn't enough.

Canonical: https://filmagic.app/blog/website-to-video
Last updated: 2026-10-31

Your homepage is already a storyboard. It has a headline that says what you do, a few sections that each show one thing, and a button that tells people what to do next. Turning a website into a video is mostly a matter of putting those parts in the right order and giving each one a few seconds on screen.

> **The short version:** headline first, then two or three sections as scenes, each with one real screenshot and one short line, then your call to action. 30 seconds is enough.

## Map your homepage to scenes

Read your homepage top to bottom and note what each section shows:

| Homepage section | Scene in the video |
| --- | --- |
| Hero headline | Opening title |
| Hero screenshot or product image | First product shot |
| Feature rows (image + short text) | One scene each, pick the best two or three |
| Logos or testimonial | Optional proof scene, only if it's real |
| Final call to action | End card with your address |

Skip pricing, FAQs, footers and long paragraphs. They read fine on a page and slowly in a video.

## A 30 second structure

| Time | Scene |
| --- | --- |
| 0 to 3 s | Your name and headline |
| 3 to 10 s | Your strongest screen, with one line on what it does |
| 10 to 22 s | Two more features, one screen and one line each |
| 22 to 30 s | Call to action and your address |

For a 15 second social cut, keep the headline, one feature and the call to action.

## When the website isn't enough

A homepage built for reading doesn't always have enough to show:

- **Illustrations instead of screenshots.** Add real screenshots of the product. They prove more than a drawing.
- **Everything behind a login.** A website to video tool only sees the public page. Add screenshots or a short screen recording of the logged-in product.
- **Very long headlines.** Write a shorter version for the video. Under eight words reads in a glance.

## Keep it on brand

The video should feel like your site, not like a template. Use your brand colour for backgrounds and highlights, your fonts for titles, and your logo on the first and last scene. If the colours read too dark or too bright on video, adjust the accent rather than switching palettes.

## Make it in Filmagic

Paste your homepage on [Filmagic](https://filmagic.app/url-to-video). It reads your name, headline, feature lines, colours, fonts, logo and images, then writes the scenes and cuts them to music. Add screenshots for anything behind your login, rewrite any line in the side panel, and export 16:9, 9:16 and 1:1 from one edit.

Related: [how to turn screenshots into a product video](https://filmagic.app/blog/screenshots-to-product-video) and [how to make a product launch video](https://filmagic.app/blog/how-to-make-a-product-launch-video).

## Frequently asked questions

### Do I need to redesign my site first?

No. If the homepage explains your product to a visitor, it has enough for a video. Add screenshots where the page relies on illustrations.

### Should the video copy match the site word for word?

Start with your site's lines, then shorten them. On-screen text needs to be read in a second or two, so a video line is usually half the length of a web line.

### Can I use the video on the same homepage?

Yes. A short, quiet loop above the fold works well. See [the homepage hero video guide](https://filmagic.app/homepage-hero-video).

## Related

- [Landing page to video ad: a 15 second structure that works](https://filmagic.app/blog/landing-page-to-video-ad)
- [URL to video: how it works and how to get a good one](https://filmagic.app/blog/url-to-video)
- [URL to video vs screen recording: which to use for your product video](https://filmagic.app/blog/url-to-video-vs-screen-recording)