Skip to main content
The Media Designer element lets you display a fully designed visual screen alongside your robot or Avatar. Use it to show informational slides, product highlights, welcome screens, or any content that benefits from a visual presentation. You can add styled text, background images or videos, semi-transparent overlays, and scannable QR codes — all without writing any code.

Create a Media Designer element

Right-click on an empty area of your canvas and select Media Designer, or drag the blue output circle from an existing element onto the canvas and select Media Designer from the context menu.

Open the Design Editor

1

Click the element once

Click the Media Designer element on the canvas to open the sidebar.
2

Click the element preview in the sidebar

Click the preview thumbnail inside the sidebar to open the full-screen Design Editor.

Add and style text

Click on the title or subtitle placeholder in the Design Editor to start typing. Hover over any text block to reveal a small formatting toolbar where you can:
  • Change the font family.
  • Change the font color.
  • Adjust text alignment (left, center, right).
Keep robot speech short and your on-screen text concise — users read at a glance, not at length.

Add a QR code

Click the QR code placeholder in the Design Editor and enter a valid HTTPS URL (for example, https://plural.io). Plural generates a scannable QR code automatically. You can also add QR codes to Menu Designer and Question Designer elements in Avatar projects.

Add a background image or video

Click Add BG Image/Video at the bottom of the Design Editor to choose a background source:
Click Upload Image or navigate to Videos to upload a file from your computer. After uploading, adjust the size and position, then click Confirm.

Add a background overlay

If your screen has both text and a background image, add an overlay to improve contrast. After adding a background image, click Add BG Overlay, choose a color, and adjust the transparency slider until the text is easy to read against the background.

Apply the background to all elements

Click Apply one-time screen to propagate the current background image and overlay to every element in your frame in one step.
Apply one-time screen overwrites the existing backgrounds of all elements in the current frame. If you only want to update a few elements, copy them into a separate frame, apply the changes there, and copy them back.

Hide the Avatar

For Media Designer elements in Avatar projects, activate the Hide avatar toggle to display the media screen in full-screen mode without the Avatar character. This is useful for product showcase slides, full-screen video playback, or any screen where the Avatar would distract from the content.

Add robot speech

While the Media Designer screen is visible, your robot or Avatar can speak accompanying text.
1

Save and close the Design Editor

Click Save to return to the sidebar view.
2

Click the speech input field

Click Enter text for the robot to say in the sidebar.
3

Enter text and variations

Type what you want the robot to say, then press Enter to add more variations. Plural picks one at random — multiple variations make your Avatar feel more natural.
4

Optionally add a condition to say

Switch to the Condition to say tab to make the robot speak only when a specific variable condition is met. For example, greet users only between 08:00 and 21:00 by adding:
  • Time greater than 08:00
  • Time less than 21:00
The small play button that appears when you hover over a speech variation gives you an instant audio preview — useful for checking pronunciation before publishing.

Connect the Media Designer output

The Media Designer element has a single output. Wire it to the next element in the flow. If you want users to be able to interact with the screen (for example, proceed on demand rather than automatically), connect the output to a Menu Designer element with a Continue button.