Does Mindstamp support vertical 9:16 videos?

Short answer

Yes. Upload or link a 9:16 portrait video the same way as a landscape video, and add interactions as usual. The editor sizes new buttons and text for a portrait frame. When you embed it, change the responsive embed code from a 16:9 frame to a 9:16 frame so the frame fits the video.

How to do it

1. Select New video and upload or link your 9:16 video.
2. Add interactions. Keep buttons and text away from the bottom of the frame, where the player controls show.
3. Select Preview and check the video on a phone.
4. To embed it, go to Share, choose Responsive and copy the embed code.
5. In the copied code, change aspect-ratio:16/9 to aspect-ratio:9/16 and add a maximum width, as in the example below.
6. To share a link instead, copy the share link from Share. It needs no change.

Example vertical embed

Paste your own embed link from the Share page into the src value. The maximum width stops the frame from filling a wide desktop screen.

<iframe src="PASTE-YOUR-EMBED-LINK" title="Your video title" allow="autoplay; fullscreen; picture-in-picture; microphone; camera; clipboard-write" allowfullscreen loading="lazy" style="width:100%;max-width:420px;aspect-ratio:9/16;height:auto;border:0;display:block;margin:0 auto;background:#000"></iframe>

Design for a tall frame

• Use larger text than you would on a landscape video. Phone screens are small.
• Put tap targets in the middle of the frame, away from the controls and the edges.
• Test questions on a phone. A question panel can cover more of a tall frame.

Square and mixed formats

Square video works the same way. Change the embed code to aspect-ratio:1/1. If a branch moves between landscape and portrait videos, test each one on a phone and on a computer.

Social platforms

Vertical video is common on social platforms, but they play only flat video files. To keep the interactions, share the Mindstamp link. See how to share.

Go further

• Sharing tutorial
• New Video tutorial