Interaction Elements

Interaction builder has a wide array of elements types that you can use to build your interactions.  The different buttons, texts, fields and images in your interaction can be freely styled and positioned.

Interactions are built using individual elements, which are the building blocks that you use to create your content. There's plenty of design settings for each element, allowing you to edit the look and feel of them so that it matches your brand.

Screenshot 2025-07-07 at 10.21.56

This article covers:

1. Element types

2. Element listing

1. Element types

When using an interaction template from our template library, you'll have a set of elements added to the interaction already that you can work with. New elements can be added from the elements list on the left side of the Design-page. 

Screenshot 2025-06-09 at 13.53.17

Examples of available elements:

  • Button elements, to use for clickable elements

Screenshot 2025-06-09 at 13.53.38

  • Text elements
    Screenshot 2025-06-09 at 13.53.46
  • Shape elements, for purely visual non-clickable elements like background colors. There are also separate image elements, that offer an easy way to add pictures to your interaction.
    Screenshot 2025-06-09 at 13.54.07
  • Dropdown menus, to be used in for example contact forms when asking visitors to choose from a list of preset options. There's also a separate radio button element that can be used to this purpose.
    Screenshot 2025-07-07 at 10.51.05
  • Video elements, for embedding videos in your interactions. Read more here.
    Screenshot 2025-07-07 at 10.51.41
  • Wheel of fortune element, offering a fun way to engage website visitors.
    Screenshot 2025-07-07 at 10.52.07

In addition to these, there are also several other elements available. Feel free to explore these inside Interaction builder!

2. Element listing

The element listing offers a streamlined approach to navigating, organising, and managing elements within a view by presenting them in a structured tree format. This allows effortless reordering of elements, provides quick access to context menus, and enables users to toggle element visibility with ease. Additionally, features such as settings access for individual elements and the ability to disable reports enhance the design workflow, help you effectively manage complex interactions and views.

The element listing shows all elements in a view in a treelike structure. If you've used groups, you'll also see these in the list.
Screenshot 2025-06-09 at 13.45.57
You can change the order of the elements simply by dragging them. The elements list is ordered from highest most element to lowest element, meaning that you'll typically see background-like elements at the bottom of the list (as these once are usually the elements in the back, behind other elements like buttons or texts). 

Right clicking on the element allows you to access the context menu for the element.

Double clicking on the element in the list will allow you to access its settings and makes it quicker to for example rename the element or edit its placement. 

If you hover over the element in element listing, you can see the element visibility icon. You can easily hide or show element visibility by clicking on the icon.
Screenshot 2025-06-09 at 13.47.48    Screenshot 2025-06-09 at 13.47.59