Skip to main content

Video Component

Designing Your App

Written by BeyondCart

Last updated: March 2026 Category: Designing Your App

Overview

The Video component lets you embed YouTube or Vimeo videos directly on your app's home screen. Videos are a powerful way to showcase products in action, share brand stories, highlight tutorials, or feature promotional content that captures attention.

How to Use

Adding a Video Component

  1. Drag the Video component from the Component Palette into the Phone Preview.

  2. Click on it to open the Inspector Panel.

Setting the Video URL

In the Content tab:

  1. Paste the full URL of your YouTube or Vimeo video into the Video URL field.

  2. The Phone Preview loads a thumbnail of the video.

Supported URL formats:

Autoplay Settings

In the Settings tab, configure playback behavior:

  • Autoplay - Toggle on to have the video start playing automatically when it scrolls into view. Toggle off to require the customer to tap play.

  • Muted - When autoplay is enabled, the video plays muted by default (this is required by most mobile platforms). Customers can unmute by tapping the volume control.

  • Loop - Toggle on to restart the video automatically when it finishes.

Layout Options

  • Aspect ratio - Choose 16:9 (standard widescreen) or 4:3. The 16:9 ratio is recommended for most content.

  • Padding - Add spacing around the video player.

  • Margin - Add outer spacing to separate the video from surrounding components.

  • Border radius - Round the corners of the video container.

Tips

  • Use video to demonstrate products in use - seeing a product in motion builds confidence and drives conversions.

  • Keep embedded videos short. For home screen placement, 30–90 seconds is ideal. Longer content works better on dedicated product or landing pages.

  • If you enable autoplay, always keep the video muted. Unexpected audio is one of the most common reasons customers leave an app.

  • Use a high-quality thumbnail. YouTube and Vimeo generate thumbnails automatically, but you can set a custom one on those platforms for a more polished look.

  • Place the Video component between text or product sections to break up the visual rhythm and keep customers engaged.

  • Make sure the video is set to public or unlisted on YouTube/Vimeo. Private videos will not load in the app.

Did this answer your question?