# Install the App

This guide shows you how to install **Motion Flow** and place it correctly on your page so scroll video works smoothly.

You only need a Wix Studio project - no extra setup is required.

***

### Step 1: Install Motion Flow from the App Marketplace

In the Wix Studio editor:

1. Open the **App Market**
2. Search for **Motion Flow**
3. Click **Add to Site**

After installation, the widget is usually added to your page automatically.

If you don’t see it on your page, you can add it manually (see next step).

***

### Step 2: Add the Widget Manually (Optional)

If you want to place the widget yourself or add it to another section:

1. Click the **Plus (+) icon** in the left toolbar
2. Go to **App Widgets**
3. Select **Motion Flow**
4. Drag it into the section where you want the video sequence to appear

The widget will display the scroll-controlled video inside that section.

***

### Step 3: How Scroll Trigger Works

Motion Flow automatically uses the **section where the widget is placed** as the scroll trigger.

This means:

* the video progresses while the user scrolls through that section
* the longer the section, the more control you have over pacing

You don’t need to set up any triggers manually - everything is handled automatically.

***

### Step 4: Use Sticky Position for Best Results

For most scroll-video experiences, the video should stay visible while the user scrolls.

We recommend using **sticky positioning** so the animation remains in view.

You can do this in two ways:

#### Option A: Make the Widget Sticky

Select the Motion Flow widget and set its position to **Sticky** in the layout settings.

#### Option B: Place the Widget Inside a Sticky Container

Place the widget inside a container and set the **container** to Sticky instead.

This is useful if you want to keep text or UI elements scrolling while the video stays fixed.

***

### Step 5: Set Enough Section Height

Scroll video needs enough vertical space to feel smooth and cinematic.

We recommend:

* **300vh to 600vh**\
  or
* **3000px to 6000px**

This gives the video enough time to play naturally as users scroll.

If the section is too short, the video will advance too quickly and feel rushed.

***

### Step 6: Open the App Panel

Click on the Motion Flow widget.

You should now see the **Motion Flow app panel**, where you can:

* choose a video template
* upload your own video
* adjust scroll playback settings

If the panel opens, the app is installed correctly and ready to use.

***

### You’re Ready to Continue

Motion Flow is now installed and properly placed on your page.

Next, continue with:

* [**Use Template Sequences**](/interactive-studio/motion-flow/get-started/use-template-sequences.md) - fastest way to start
* [**Upload Custom Sequences**](/interactive-studio/motion-flow/get-started/upload-custom-sequences.md) - use your own footage


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://insync.gitbook.io/interactive-studio/motion-flow/get-started/install-the-app.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.