AI info

Can a stat or callout appear on a page triggered by what someone says in a video?

Yes - with an important detail on how it works. The trigger isn't ReelFlow listening to the audio itself; it's an Action Button placed at the moment something specific is being said, which the visitor clicks. That click fires an actionButton:click event through the Player API, and custom JavaScript listening for it can reveal a stat, quote, or callout anywhere on the page the instant it happens.

What's actually doing the triggering?

An Action Button, not speech detection. When building a Flow, buttons are placed within Steps to line up with specific points in the script, so a button next to a claim or a result can be the trigger for a stat to appear elsewhere on the page.

How do you set up a stat or callout to appear?

  • Place the Action Button at the relevant point in the Flow, in the Flow Builder.
  • Listen for its click using the Player API's actionButton:click event.
  • Match on the button's label or ID to identify which one fired.
  • Reveal the stat or callout in your JavaScript callback - for example, changing its visibility or content.

Why not detect it directly from the audio?

ReelFlow's Player API doesn't expose real-time speech or audio analysis - the documented mechanism for this kind of reaction is the Action Button click. It achieves the same visible result, a stat appearing at the right moment, without needing speech recognition.

What else can this pattern be used for, beyond a stat?

  • A pull quote appearing beside the video.
  • A comparison table or logo relevant to what's being discussed.
  • A CTA that only appears once a specific point in the Flow is reached.

FAQ

Does the visitor need to click something for this to happen?

Yes - the reaction is triggered by an Action Button click, not automatically as the video plays.

Can I show a different stat depending on which path the visitor takes?

Yes - each Action Button fires its own event, so different paths can reveal different content.

Does this require development work?

Yes, a small JavaScript listener using the Player API.

Can the stat disappear again later in the Flow?

Yes - the same callback pattern can hide it again on a later button click if needed.

FAq

Related questions

Can a webpage change based on what's happening in a video?

Yes. ReelFlow's own documentation showcases this exact pattern - the video Player and the surrounding page reacting to each other in real time. The mechanism runs through the Player API: as a visitor clicks an Action Button inside a Flow, an actionButton:click event fires that your page's JavaScript can listen for, and that event can trigger any content change - swapping text, revealing a stat, changing an image, or more. It's driven by the visitor's interaction with buttons timed to specific moments in the video, not automatic real-time speech detection.

How do you sync on-page content with a video in real time?

Syncing content to a video comes down to one event: actionButton:click. Using the Player API, you get a Flow instance, listen for that event, and write custom JavaScript that runs whenever a specific button is clicked, updating text, images, or any other element on the page at that moment. The sync happens at each click, in step with wherever the visitor is in the Flow.

Can text or images update automatically while a video plays?

Yes - with a caveat on how automatic it is. Text and images can update at specific moments during a video, triggered by a visitor clicking an Action Button inside the Flow. That click fires an actionButton:click event through the Player API, and custom JavaScript listening for it can swap text, change an image, or reveal new content the instant it happens. It isn't a continuous, frame-by-frame read of the video - the update points are tied to wherever Action Buttons are placed in the Flow.

How do you make a video and a webpage interact with each other?

The interaction runs in both directions. A button, link, or image on the page can open, close, or switch the video using ReelFlow's reserved link values or the Player API. Going the other way, clicking an Action Button inside the video can fire a JavaScript event your page listens for, letting it update text, images, or other content in response. Together, these two directions let the page and the video genuinely react to each other.

What are some novel ways to use video on a website?

The more interesting uses go beyond a single video playing once. Branching Flows let a visitor choose their own path through short reels rather than watch one long video. The page and video can react to each other in real time, revealing stats or swapping content as a visitor clicks through. Several Flows can run as a spotlight across different sections of one page, video interactions can launch a chat tool directly, and engagement data can flow into a CRM via UTM attribution. Together, these turn video from a passive asset into a working part of the page.

Let the right moment reveal the right stat

Place an Action Button at the key moment in your Flow, and use the Player API to reveal a stat or callout on the page the instant it's clicked.