Engagement Survey

The logger ships with a prebuilt engagement survey aimed at gauging user sentiment. Ultimately, the best way to understand reception to your 3D experience is by directly asking your users.

By default, the engagement survey randomly prompts itself during the user's experience. In the event a user answers the survey, Metalitix will use the browser's local storage to remember the user's response. So, if the user has already answered the survey it will not be shown again (until the browser's local storage is cleared).

Example of the automatic Metalitix engagement survey.

The example code below illustrates how to instantiate Metalitix with custom survey settings.

<a-scene
     id="aframe-scene"
     metalitix-logger="
          apiKey: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx;
          sceneId: my-scene;
          surveyMinInterval: 5;
          surveyMaxInterval: 60;
">
     ...
</a-scene>

Survey Settings

When instantiating Metalitix, the settings below modify the survey's appearance.

Setting	Default
showSurvey Whether to randomly and automatically prompt the user for their sentiment during a session.	true
surveyLogo The String path or URL to the logo asset to use on the survey prompt.	undefined (Metalitix Logo)
surveyMaxInterval The latest time, in seconds, after session start when the survey might appear.	180
surveyMinInterval The earliest time, in seconds, after session start when the survey might appear.	30
DEPRECATED surveyTheme The styling of the automatic survey. Either white or black.	'white'

Manual Surveying

If you wish to manual trigger the engagement survey, you can use the below Javascript function.

Function	Parameters	Returns
showSurvey() Immediately send a prompt to the user that asks for their sentiment.	String theme = 'white' (Optional) Accepts either 'white' or 'black' themes.	None

Survey Appearance

There are several CSS classes that can be used to customize the appearance of the survey prompt. Modifying these style classes will allow you to customize the survey to match your brand. The classes listed below are numbered, and each number corresponds to the labels in the image below.

1. .mtx-survey

2. .mtx-survey-title

3. .mtx-survey-options

4. .mtx-survey-option:nth-child(INDEX) where INDEX is the a number 1 (worst) to 5 (best) inclusive. Alternatively, use .mtx-survey-option to target all options.

5. .mtx-survey-submit-button

6. .mtx-survey-logo