Brand Skin Consultant App

This page describes how to adjust the appearance of the Skin Consultant app to match your e-commerce web store experience.

Skin Consultant App is a feature of the Haut.AI SaaS Platform, offering a no-code widget for skin analysis and recommendations.

To set up a minimal branding for the Skin Consultant app, you need:

  1. Set your color theme, see Setting your colors for app.

  2. Set your images for the welcome screen, see Setting your image for the starting screen.

  3. Select the language or leave the auto-translation feature "on", see Selecting the app language.


Setting your logo for the starting screen

In the previous step Create Skin Consultant App you already created and tested the Skin Consultant app with the default appearance.

This step describes how to change the logo on top of the starting screen.

  1. Navigate to the Skin Consultant tab on the menu of SaaS platform

  2. Navigate to your Skin Consultant App details by clicking on name of your app in the list of apps.

  3. Open the (1) General settings tab.

  4. Scroll down to "Look and feel" section.

  5. Upload your logo. Follow the guidelines for file size and type for better results.

  6. Click on "Save changes" button on the bottom right corner of the screen.


Setting your colors for app

This step describes how to adjust the colours of key elements of your Skin Consultant app.

  1. Navigate to Skin Consultant tab on the menu of SaaS platform.

  2. Navigate to your Skin Consultant App details by clicking on name of your app in the list of apps.

  3. Open the (1) General settings tab.

  4. Scroll down to "Color theme" section.

  5. Adjust the colours to match your website style by clicking on the "palette" icon on every colour.

  6. Click on "Save changes" button on the bottom right corner of the screen.

You can see the changes on the schematic preview of the Skin Consultant screens.

Most important colors of Skin Consultant app

  • Background: a background color for all screens. Highly recommended to stick to very light or very dark colors for better readability.

  • Text: a text color for all text elements and buttons. Please keep in mind that the same text color is applied to all buttons.

  • Accent: a color used for all CTAs and buttons, including start experience button, purchase product button, etc.


Setting your image for the starting screen

This step describes how to replace the default starting screen image with your custom image. This action allows to show different images on desktop and smarthone devices.

  1. Navigate to the Skin Consultant tab on the menu of the SaaS platform.

  2. Navigate to your Skin Consultant App details by clicking on the name of your app in the list of apps.

  3. Open the (1) General settings tab.

  4. Scroll down to the "Main image" section.

  5. Upload your image for the starting screen for smartphone devices. Follow the guidelines for file size and type for better results.

  6. Upload your image for the starting screen for desktop/tablet devices. Follow the guidelines for file size and type for better results.

  7. Click on the "Save changes" button on the bottom right corner of the screen.


Selecting the app language

By default, the Skin Consultant app uses the language of the user device operation system (OS) to display the interface. If the language is not supported, the Skin Consultant app interface is displayed in English.

You can redefine this option by limiting the display of the Skin Consultant app to only 1 language. To do this:

  1. Navigate to the Skin Consultant tab on the menu of the SaaS platform.

  2. Navigate to your Skin Consultant App details by clicking on the name of your app in the list of apps.

  3. Open the (4) Advanced tab.

  4. Scroll down to the "Translation" section.

  5. Select your desired language in the drop-down menu. Select None to keep the Skin Consultant app default behaviour of automatic language selection.

  6. Click on the "Save changes" button on the bottom right corner of the screen.

List of currently supported languages

  • Arabic

  • Chinese

  • Czech

  • Danish

  • Dutch

  • English

  • Estonian

  • Finnish

  • French

  • German

  • Hebrew

  • Italian

  • Lithuanian

  • Polish

  • Portuguese

  • Romanian

  • Russian

  • Spanish

  • Ukrainian

  • Xhosa

  • Yoruba

  • Zhuang

  • Zulu


FAQ

Can I change the fonts in the Skin Consultant app interface?

Unfortunately this option is currently not available.

Last updated