We suggest to not use more than three lines of text.
Step0 (information screen before enrollment)
title
description
prerequisiteCenterFace
prerequisiteDirectLook
prerequisiteWellLitArea
prerequisiteRemoveEyeWear
continueCta
closeScreenButtonContentDescription (the content description of the close button for accessibility)
prerequisiteAloneInPhoto deprecated (will no longer be shown)
Step1
text1
Showed before the user face is framed.
step1Success
message
Showed after the user face is framed with a successful animation.
Step2
text1
Showed after the user face has been framed and the progress is between 0% and 33%.
text2
Showed after the user face has been framed and the progress is between 34% and 66%.
text3
Showed after the user face has been framed and the progress is between 67% and 100%.
subtitle1
Showed during the entire enrollment progress
Step3
text1
Showed when the enrollment has been successfully completed.
subtitle1
Showed when the enrollment has been successfully completed
Authentication
We suggest to not use more than two lines of text.
Step1
text1
Showed before the user face is framed.
Step2
text1
Showed after the user face has been framed.
Step3
text1
Showed when the authentication has been successfully completed.
Example
// Custom text for enrollment// prelimiar information for enrollmentKeyless.UI.Text.Enrollment.Step0.title ="(custom) Enroll your face"Keyless.UI.Text.Enrollment.Step0.description = "(custom) On the next screen, we will take a photo of your face to create your account."
Keyless.UI.Text.Enrollment.Step0.prerequisiteCenterFace ="(custom) Center your face in the frame"Keyless.UI.Text.Enrollment.Step0.prerequisiteDirectLook ="(custom) Look directly at the screen"Keyless.UI.Text.Enrollment.Step0.prerequisiteWellLitArea ="(custom) Ensure you are in a well-lit area"Keyless.UI.Text.Enrollment.Step0.prerequisiteRemoveEyeWear ="(custom) Remove any eyewear or hats"Keyless.UI.Text.Enrollment.Step0.continueCta ="(custom) Continue"// remaining steps of the enrollmentKeyless.UI.Text.Enrollment.Step1.text1 ="(custom) Put your face within the frame"Keyless.UI.Text.Enrollment.Step1Success.message ="(custom) Photo captured successfully"Keyless.UI.Text.Enrollment.Step2.text1 ="(custom 1) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step2.text2 ="(custom 2) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step2.text3 ="(custom 3) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step3.text1 ="(custom) Keyless account created successfully!"// Custom text for authenticationKeyless.UI.Text.Authentication.Step1.text1 ="(custom) Please look into the camera"Keyless.UI.Text.Authentication.Step2.text1 ="(custom) Communicating with the Keyless network"Keyless.UI.Text.Authentication.Step3.text1 ="(custom) Approved"
// Custom text for enrollment// prelimiar information for enrollmentKeyless.UI.Text.Enrollment.Step0.title ="(custom) Enroll your face"Keyless.UI.Text.Enrollment.Step0.description = "(custom) On the next screen, we will take a photo of your face to create your account."
Keyless.UI.Text.Enrollment.Step0.prerequisiteCenterFace ="(custom) Center your face in the frame"Keyless.UI.Text.Enrollment.Step0.prerequisiteDirectLook ="(custom) Look directly at the screen"Keyless.UI.Text.Enrollment.Step0.prerequisiteWellLitArea ="(custom) Ensure you are in a well-lit area"Keyless.UI.Text.Enrollment.Step0.prerequisiteRemoveEyeWear ="(custom) Remove any eyewear or hats"Keyless.UI.Text.Enrollment.Step0.continueCta ="(custom) Continue"// remaining steps of the enrollmentKeyless.UI.Text.Enrollment.Step1.text1 ="(custom) Put your face within the frame"Keyless.UI.Text.Enrollment.Step1Success.message ="(custom) Position your face within the frame"Keyless.UI.Text.Enrollment.Step2.text1 ="(custom 1) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step2.text2 ="(custom 2) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step2.text3 ="(custom 3) Enrolling, please wait…"Keyless.UI.Text.Enrollment.Step3.text1 ="(custom) Keyless account created successfully!"// Custom text for authenticationKeyless.UI.Text.Authentication.Step1.text1 ="(custom) Please look into the camera"Keyless.UI.Text.Authentication.Step2.text1 ="(custom) Communicating with the Keyless network"Keyless.UI.Text.Authentication.Step3.text1 ="(custom) Approved"
Fonts
It is possible to customize the font.
Android: requires an android.graphics.Typeface object.
iOS: requires a String, the name of the font.
The custom font must be set as soon as available, a good moment to do so is before calling Keyless.configure
You can show your custom logo during Enrollment, Authentication and de-enrollment.
It will be shown in the upper-right corner; any custom logo can be used, it will be resized but not stretched.
logo positioning may overlap with custom text depending on your custom text
Example
Add your own image .png in your /res/drawable folder to set it using Keyless.UI.Logo.bitmap property.