Customizing loading, permission, etc UI screens?

Universal AR ThreeJS
#1

Hi Zapworks community!

Hey, is there a way to customize the UI screens Zappar sets for us? I would like to change the UI of those screens:
‘loading’
‘permission request’,
‘permission denied’
‘incompatible browser’

Reason 1 is I am making an AR mural in a foreign country in which english is not the main language spoken here and would like to have something a little more local…

Reason 2 would be to craft an experience more aesthetically consistent from beginning to end.

Somebody managed to do this before?

Cheers.

#2

Hi @wwwonka,

Welcome to Zappar and Zapworks!

You may create your own permission screens for your Universal AR SDK for three.js projects. You can learn more about this on our documentation here: Universal AR | Camera Setup.

In particular, you can use the following function to trigger the browser’s permission prompts directly:

:warning: Please note - due to browser restrictions, this function must be called from within a user event, e.g. in the event handler of a button click.

ZapparThree.permissionRequest().then(granted => {
    if (granted) {
        // User granted the permissions so start the camera
    } else {
        // User denied the permissions
        // You can show your own 'permission denied' UI here or use Zappar's built-in one
        ZapparThree.permissionDeniedUI();
    }
});

Have an awesome day,
Francesca :blush: