Skip to main content
The Menu Designer element presents users with a set of tappable buttons on the robot’s display or the Avatar screen. Each button can lead to a different branch of your flow, letting you build rich, multi-path interactions. Users can select a button by tapping it or by speaking the button text (or any voice trigger variation you define). The Menu Designer also supports a companion robot speech prompt so the Avatar can guide users toward making a choice.

Create a Menu Designer element

Right-click on an empty area of your canvas and select Menu Designer, or drag the blue output circle from an existing element onto the canvas and select Menu Designer from the menu that appears. Plural creates the element and automatically draws a connection from the previous element.

Open the Design Editor

1

Click the element once

A single click on the Menu Designer element opens the configuration sidebar on the right.
2

Click the element preview in the sidebar

Click the Menu Designer preview inside the sidebar to launch the full-screen Design Editor where you can visually style the layout.

Configure buttons

Add and reorder buttons

In the sidebar, type a label into each button’s text field. Add more buttons with the + icon. Drag and drop buttons in the sidebar list to reorder them — the on-screen layout reflects the new order.

Style individual buttons

Click a button in the Design Editor to open its styling panel. From there you can:
  • Change shape — adjust the border radius from rectangular to fully rounded.
  • Add a background color — pick from the color palette or enter a hex value.
  • Add a background image — upload an image from your computer or choose from the Plural Media Library.
  • Add a border — set border color and width.
  • Apply to all — propagate the current button’s style to every button in the menu.

Style button text

Click the button label in the Design Editor to access text options:
  1. Change the font family.
  2. Change the text color.
  3. Adjust horizontal alignment (left / right).
  4. Adjust vertical alignment (top / bottom).

Add a title, subtitle, and QR code

Use the title and subtitle fields at the top of the Design Editor to add a heading above the buttons. You can also enable a QR code placeholder and enter a URL to generate a scannable code directly on the menu screen.

Set a background image or video

Click Add BG Image/Video at the bottom of the Design Editor to upload a background image or video, or paste in a direct URL. After adding a background, use Add BG Overlay to layer a semi-transparent color over it for better text contrast.

Delete and hide buttons

Hover over any button in the Design Editor to reveal two icons:
  • Eye icon (left) — hides the button visually. A hidden button still occupies its grid space and can still be triggered by voice if it has a label.
  • X icon (right) — permanently deletes the button.
Use hidden buttons to create invisible spacers and control menu layout, or to expose voice-only options that don’t clutter the visual interface.

Add robot speech

1

Save the Design Editor

Click Save in the Design Editor to return to the sidebar view.
2

Click the speech input field

In the sidebar, click Enter text for robot to say to open the speech input panel.
3

Enter text and variations

Type the call-to-action text (for example, “Which topic would you like to explore?”). Press Enter to add variations — Plural plays one at random each time.

Add voice triggers

Each button responds to its visible label text by default. To expand voice recognition to synonyms and alternative phrasings, click on a button (in the sidebar or Design Editor) and add trigger phrases under the Voice triggers section. For example, a button labeled Start could also respond to “Let’s go”, “Please start”, or “Begin”.

Save the user’s selection

If you want to record which button the user tapped for use later in the flow, click a button and open the Save answer tab. Enter:
  • Variable name — the name of the attribute to create or update (for example, userInterest).
  • Value — the value to store when this button is selected (for example, Technology).
Reference the saved value anywhere in the flow with #ATTRI/userInterest.

Conditional button visibility

Show or hide individual buttons based on flow variables or system attributes. Click a button and open the Condition to show tab, then set a variable, operator, and value. For example, to show a Sunday Offer button only on Sundays:
  • Variable: WeekdayNumber
  • Operator: equals
  • Value: 7
Connect every button output to a downstream element. Any button without a connection leads to a dead end in your flow.