> For the complete documentation index, see [llms.txt](https://help.blings.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.blings.io/guides/interactivity-basics.md).

# Interactivity Basics

Interactivity turns an MP5 from a personalized video into a viewer journey. A viewer can choose, click, type, submit, branch, or trigger custom behavior, and the project can route the next scene based on data or action.

Use this guide to understand the main interaction patterns before configuring connectors.

## Interaction Types

| Interaction            | What it does                                                            | Main tools                                                              |
| ---------------------- | ----------------------------------------------------------------------- | ----------------------------------------------------------------------- |
| Open a destination     | Sends the viewer to a URL, email action, phone action, or dynamic link. | Open Link connector, data fields, tracking links.                       |
| Jump inside a scene    | Moves the viewer to a specific frame or moment in the current scene.    | Jump to Frame connector.                                                |
| Branch to another path | Sends the viewer to another scene, timeline path, or lineup.            | Branch Timeline connector, Scene Offset connector, Flow Map conditions. |
| Show or hide content   | Changes what is visible based on viewer data, live controls, or logic.  | Layer Hide connector, conditions, expressions.                          |
| Collect typed input    | Lets the viewer enter text inside the MP5.                              | Input Field connector.                                                  |
| Submit a form          | Sends viewer-entered values to Form Data or custom handling.            | Submit Form connector, Platform Form Data.                              |
| Trigger custom code    | Runs logic on player events or connector expressions.                   | Expression connector, Player Events connector, SDK event handling.      |

## How to Plan an Interactive Flow

{% stepper %}
{% step %}

### Define the Viewer Decision

Write the exact action the viewer should take: click a CTA, choose an answer, enter a value, submit a form, or continue to another path.
{% endstep %}

{% step %}

### Choose the Runtime Result

Decide what happens after the action: open a link, show a message, jump to a frame, branch to a scene, save a form submission, or trigger custom logic.
{% endstep %}

{% step %}

### Identify the Data Needed

List the fields, live controls, URLs, labels, answers, and submitted values needed to support the interaction.
{% endstep %}

{% step %}

### Configure Connectors in Studio

Add the connector that matches the action and bind it to the right layer, field, fallback value, success state, and validation behavior.
{% endstep %}

{% step %}

### Validate in Studio and Platform

Test normal actions, empty values, invalid values, repeated clicks, mobile behavior, alternate branches, and analytics expectations.
{% endstep %}
{% endstepper %}

## Interaction QA Checklist

Before launch, confirm:

* Every clickable layer is visible, readable, and easy to activate.
* Every branch has a clear next scene or fallback path.
* Every link has a valid destination and tracking plan.
* Every input has a field name, placeholder, empty-state behavior, and submit path if needed.
* Form submissions have approved storage or custom handling.
* Analytics and conversion events match the campaign goal.
* Platform simulation covers each important path.

## Deep Dives

{% content-ref url="/pages/aW68QWx8104Pv6Dytu64" %}
[Connectors](/apps/blings-studio/connectors.md)
{% endcontent-ref %}

{% content-ref url="/pages/o3Uq9AhtjBVAMsxuyMFA" %}
[Flow Map basics](/apps/blings-platform/flow-map.md)
{% endcontent-ref %}

{% content-ref url="/pages/ThKwtP401iG2BYGD0yHe" %}
[Collect Viewer Data](/guides/collect-viewer-data.md)
{% endcontent-ref %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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://help.blings.io/guides/interactivity-basics.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.