Make Your First Video With Code Using Remotion

Start with a ten-second storyboard

Write one sentence a viewer should remember. For a founder explaining onboarding, it could be “Give new customers one task they can finish today.” Put the question on screen for two seconds, show a screen recording or diagram for six seconds, and leave two seconds for the takeaway. The short length keeps the experiment focused on timing and layout.

Use a sample project from the official Remotion setup guide. Start the preview and identify where the composition is registered. Set the dimensions to 1080 by 1920 pixels for a vertical example. At 30 frames per second, ten seconds is 300 frames. Decide the boundaries for your three scenes before writing the visuals.

Build one useful visual at a time

Begin with the title and check that its line breaks work in the actual frame. Then add the main scene with one highlighted detail. If the example is a product screen, crop or zoom so a viewer can read the part being explained. A phone-sized preview makes it easier to spot details that look fine on a large monitor but disappear on mobile.

Keep the closing card simple. Repeat the specific takeaway and give it enough time to read. Test different text lengths before adding motion. When the idea already makes sense with static elements, use animation to direct attention to the change that matters.

Export and keep a baseline

Render the composition to a video file and watch it from start to finish. Confirm the export plays, the duration is what you intended, and the text stays within the frame. If you add narration, check for clipped words and listen with ordinary speakers. Save the successful version and change just one input for a second export. That verifies the project is easy to adjust without reworking the structure.