Video

How to use the Nami Video component

Video is available on Enterprise plans only.

Support Status

See Release Notes to read about the latest SDK Versions for each operating system

Operating System	Supported	Minimum SDK Version Required
Android	✅	3.2.1
iOS	✅	3.2.1
Google TV	✅	3.2.1
Apple TV	✅	3.2.1
FireTV	✅	3.2.1
Roku	❌ coming soon
Web	✅	1.5.2

How to Add Video

1. Open or create a new Creator-compatible page

2. Click the plus button next to the component where you want the video

3. Select 'Video'

   
4. Provide a URL for the video. MP4, .MOV, and HLS types supported.

   
5. Select or upload a fallback/thumbnail image. This will be shown while the video is loading or if the video ends and does not loop.

   1. This image should be the same aspect ratio as the video

6. Select video playback options.

   1. Autoplay: If on, the video will play as soon as the page is launched.

   2. Mute by Default: if off, the video volume will play as soon as the video starts.

   3. Loop Video: if on, the video will loop once complete

   4. Type of Video Controls: If 'None' is selected, no play/pause/volume controls will be available to the user. If 'Native UI' is selected, the native Android/iOS/web/TV video controls will be exposed.

      
7. Set video size and fill.

   1. For a fullscreen video, set Height and Width to Fill and set Crop to Fill. Recommended: position fullscreen video component in the Background section.

   2. For an inset video clip (like above), set Height to a specific number (ie 200) and Width to Fill. If you want the video to stretch to fit the width, set Crop to Fill. Otherwise, set Crop to Fit. When Crop = Fit, you will see space at the top and bottom of the video.

Analytics

The Nami SDK emits analytics events about the video that you can consume for your own reporting purposes.

See 3rd-Party Analytics for background information.

List of Events

• video_play

• video_pause

• video_resume

• video_end

• video_change

• video_mute

• video_unmute

Event Metadata

The events above contain an additional metadata object:

{
  "id": "id of component",
  "name": "title of component (editable in Page Creator)",
  "url": "url of video",
  "autoplayVideo": "true or false",
  "muteByDefault": "true or false",
  "loopVideo": "true or false",
  "contentTimecode": "time market of current video",
  "contentDuration": "total length of video"
}

Frequently Asked Questions

Q: On my Android 13 device, the video looks stretched. How do I resolve?

A: Update your Nami SDK Version to 3.2.7. We introduced a fix in this SDK version.

Q: How many Videos can be on a page?

A: Currently, just 1 video is supported

Q: What if I want to show different video clips depending on which user is seeing the page?

A: You can do that! Use our Custom Variables capability to add new variables and then pass the URL of the video as a variable at launch. Use this custom variable in the Video > URL section.

Q: Can I stream live video on my page?

A: Yes! When setting up the video, provide the link to an HLS video stream

Q: Why do I see black bars at the top and bottom of my video?

A: You have set your video Crop to Fit. This means it won't stretch or cut off any of the video, but it will fill the extra space. You can try setting Crop to Fill to experiment with the appearance.

Q: Can I put the Video anywhere on my page?

A: The video can be put anywhere in the Content or Background sections except for inside a carousel (including on carousel slides), and inside the Repeating Product Group.

Q: Can I upload a Video asset to the page?

A: No. Nami doesn't host your video. Instead provide a link to the video in your own Content Delivery Network (CDN).

Q: I have some additional requirements for the Video on my page. Can Nami help?

A: See Advanced Video Features capability to see more Video features supported by Nami.