alan-logo
Docs

Documentation

Powered by Algolia
About AlanAlan basicsGetting started

Customizing the Alan button

You can customize the Alan button to fit your app needs and color scheme. To access the Alan button options:

  1. In Alan Studio, at the top of the code editor, click Integrations.
  2. Click the Web, iOS or Android tab and use the options below to set up the necessary style and behavior of the Alan button.

You can do the following to customize the Alan button:

Mind the following:

  • The Alan button settings are configured at the project level. If you have several projects, you need to configure the button settings for them separately.
  • You can specify different settings for every environment in the project: Development, Testing or Production, and for each platform or SDK: web, iOS or Android.

Enabling or disabling the Alan button

Use this option to show or hide the Alan button for users of your app.
Default on/visible
Platforms Web/iOS/Android

Enabling or disabling the Speech To Text panel

Use this option to show or hide the 'Speech To Text' panel for users of your app. The 'Speech to Text' panel is active when the user gives voice commands to the app, showing the recognized input, and helps with visual feedback.
Default on/visible
Platforms Web/iOS/Android

The 'Speech To Text' panel is not displayed in mobile web browsers on the Web platform.

Recording intent audio

Use this option to record every voice command given by users. Audio recordings will be available in the project logs. Recording audio is a great way to debug user flows and adjust your voice script accordingly. We have taken extra security measures to ensure that all recordings are protected and available only to you as the project owner.
Default off
Platforms Web/iOS/Android

Playing the ready-to-listen sound

By default, when the user interacts with Alan, a special sound is played when Alan is ready to listen for user's utterances. If you do not want the sound to be played, you can disable the Play ready-to-listen sound option.
Default on
Platforms Web

Changing the Alan button visual style

Use this option to customize the Alan button visual style to match your brand design and color scheme. You can do the following:
Default blue
Platforms Web/iOS/Android

Changing the button styles

By default, the Alan button is blue. If the default color does not fit the color scheme of your site or app, you can change it. In Alan button visual style, click Change and in the Button Style section, choose the necessary colors for every Alan button state.

The Alan button has four states:

  • Idle State: the default state of the Alan button
  • Listening State: this state is applied when Alan waits for a user utterance
  • Processing State: this state is applied when Alan is analyzing the user input
  • Speaking Back State: this state is applied when Alan speaks back to the user

To save the configured color scheme, to the right of the Button Code field, click Save and define the scheme name. You can switch between the default color scheme and saved color schemes at any time.

Changing the button size

The default size of the Alan button displayed in the app is 64px. You can define the necessary button size directly in Alan Studio. In the Button Size section, drag the slider right or left to make the Alan button larger or smaller.

To customize the look and feel of the Alan button, you can replace the Alan logo on top of it with a custom icon or your company logo.

This option is available on the Premium Pro plan or higher. For details on switching between billing plans, see Billing.

To replace the Alan logo, in Alan button visual style, click Change. In the Logos settings section, click Add custom logos, select one or more image files and use the right and left controls below each button state to assign the image to this state.

For best results, the images you select must meet the following requirements:

  • The recommended image size is 400x400 pixels.
  • The images must be in the PNG or GIF format.
  • The images should have transparent areas around the icon or logo.

To switch back to the default logo, select the initial image for the necessary Alan button state.

Changing Alan's voice and accent

Use this option to change Alan's voice. You can switch between male and female voices and regional accents (if regional accents are available for the language you select).

This option is available on the Premium plan or higher. For details on switching between billing plans, see Billing.

To change Alan's voice, in Alan voice, click Change. In the languages list, select the language for the voice assistant, the region and the voice type. If you want to create a multilingual voice assistant, click the plus icon to add all necessary languages and configure their settings.

Default English, US, Alan voice
Platforms Web/iOS/Android

Setting the microphone timeout

Use this option to set the period after which the Alan button is automatically deactivated. This option helps users save on battery/traffic and avoid unwanted commands. Also, the microphone timeout functionality pairs great with using the wake word.
Default 10s
Platforms Web/iOS/Android

Taking screenshots

Use this option to take screenshots of the app with every voice command given by users. Screenshots will be available in the project logs. Taking screenshots is a great way to debug user flows and adjust your voice script accordingly. We have taken extra security measures to ensure that all screenshots are protected and available only to you as the project owner.
Default off
Platforms iOS/Android

Keeping the session active

Use this option to keep the voice session active even when the user puts the app in the background mode. If this option is enabled, the user will be able to continue the conversation with Alan even while actively using other app.
Default off
Platforms iOS/Android

Using the wake word

Use this option to allow users to activate the Alan button and a voice session without touching the screen of their mobile devices. All that the user needs to do is say the wake word: "Hey, Alan" or "OK, Alan".
Default off
Platforms iOS/Android

Using the wake word in the background mode

Use this option to allow users to activate the Alan button with the wake word even if the app runs in the background mode. With this option enabled, after the app is put in the background, the user can say the wake word: "Hey, Alan" or "OK, Alan" and start interacting with Alan.

The app running in the background mode will remain collapsed. To bring the app to the foreground, the user can tap the microphone bar at the top of the device screen or the app icon itself.

Mind the following:

  • Together with this option, you must enable the Keep active while the app is in the background and Enable "Hey Alan" wake word options. Otherwise, the wake word in the background mode will not work.
  • VoIP apps having a higher priority such as Skype or telephone can interrupt Alan voice sessions. If this happens, the wake word will not work until the user re-opens the app.
Default off
Platforms iOS/Android