Skip to content

Liveness Assessment UI Customization

On this page, explore the customization capabilities available for the liveness assessment user experience. The liveness assessment process consists of several steps, and on each step there are elements that can be customized.

Start Screen

This is the initial screen that opens once the liveness assessment process starts. It provides basic instructions on how a person can prepare for the assessment, and the Go button.

Element Web Component Mobile: Android Mobile: iOS
Button: Text color
Button: Background color
Button: Hover color
Screen: Background color
Screen: Text color

For example, here is a comparison of a default screen and a customized one:

Session

The liveness assessment session is accompanied by an animation that demonstrates how to turn one's head. A blurred image of a person's face is displayed within a circle with animated and textual hints illustrated by colored target sectors around the circle.

Element Web Component Mobile: Android Mobile: iOS
Animated hint: Face color
Animated hint: Background color
Textual hint: Text color
Textual hint: Background color
Face circle outline color
Target sector color
Turn on/off the Switch Camera button

For example, here is a comparison of a default screen and a customized one:

Loading Results

During the loading of results, a processing spinner and a text are displayed.

Element Web Component Mobile: Android Mobile: iOS
Processing spinner color
Text color
Animation style

For example, here is a comparison of a default screen and a customized one:

Result Screen

Depending on the result, either a Success or Failure result screen will be displayed in the final step. The Failure screen provides guidelines on how to prepare for another attempt.

Element Web Component Mobile: Android Mobile: iOS
Button: Text color
Button: Background color
Button: Hover color
Failure image
Success image

For example, here is a comparison of a default screen and a customized one:

Advanced Customization

Besides the basic customization, you can additionally customize labels, buttons, and images.

Element Web Component Mobile: Android Mobile: iOS
Label
Button
Image

Texts Localization

You can translate or adapt texts used in the process.

Element Web Component Mobile: Android Mobile: iOS
Textual messages

Process Management

Also, you can choose whether or not to display the start and result screens, as well as control the ability to interrupt the process.

Element Web Component Mobile: Android Mobile: iOS
Disable interruptions (remove the Close cross button)
Disable the start screen
Disable the result screen

Customization Guides

Mobile

Web Components