Website to Desktop App – Coming Soon!

Join the waitlist now and get an exclusive early-bird discount when we launch!

+91

By filling this form you are granting the permission to share your details with Webtonative

Onboarding Screen

Onboarding Screen

Introduce users to the enhanced functionality and features of your application through an informative and user-friendly onboarding screen. This guide will help you customize and set up the onboarding screen to provide a seamless and intuitive experience for your users.

Key Features

  • User-Friendly Interface: Customizable pages using images, text, and buttons.
  • Enhanced User Experience: Educates and empowers users about the app’s capabilities.
  • Real-Time Changes: All modifications are reflected in real time, but a rebuild is required for changes to appear in the app.

Setting Up the Onboarding Screen

1. Add Onboarding Screen from the Add-ons

Screenshot 2025-05-08 145047.png

Click on "Add" button to add Onboarding Screen. Once you add, it will appear in Add-ons menu.


2. Enable/Disable Onboarding Screen Addon:

  • Go to the left side panel and click on the Onboarding Screen option.
  • Enable or disable the onboarding screen addon as needed.

Screenshot 2025-05-08 150817.png

3. Customizing Pages

1. Edit Onboarding Pages

  • Edit multiple pages to your onboarding screen as needed.

Screenshot 2025-05-08 160848.png

  • Click on Edit or Add to customize each page.

2. Upload Images and Add Text

  • Upload images to each page.

Screenshot 2025-05-08 161539.png

  • Add and customize text with various options such as font weight, size, and color.
  • Set margins as required.
  • Enable or disable the skip button for each page.
  • Save your changes.

4. Adding Action Buttons

1. Add Button

  • Set the button text and customize the text color.
  • Adjust the button’s background color, border color, and border corner type (rounded or square).

2. Set Button URL

  • Provide the URL that the button should link to.

Screenshot 2025-05-08 162719.png

  • Save your changes.

5. Settings

1. Skip Button Settings

Screenshot 2025-05-08 164745.png

  • Text: Change the skip button text to suit your needs.
  • Text Color: Customize the text color.
  • Button Background Color:
  • Border Color: Set the border color.
  • Border Corner: Choose between rounded or square corners. Save your changes.

2. Onboarding Screen Settings

1. Carousel Setting

  • Set the active and inactive colors for the carousel indicators.

Screenshot 2025-05-08 170015.png

2. General Settings

  • Change the background color of the onboarding screen.
  • Enable or disable the option to show the onboarding screen every time the user opens the app.

Screenshot 2025-05-08 170421.png

After customiziations, click on the "Save" button. Rebuild your app to apply and view the changes. The rebuild process may take a few minutes, depending on the complexity of your app.