onboard
Last updated
Last updated
There is a demo workflow that should be deleted on this page. Please refer to this section of the Setup Guide for instructions.
Desktop
Mobile
Immediately after a new User signs up for your application, they are navigated to this onboard page.
The onboard page contains four 'step' groups, that:
Welcomes the Current User
Asks the Current User to upload a profile picture
Asks the Current User for their website link, and to write a few sentences about themselves
After the Current User completes these steps (or skips them), the fourth onboard card group contains the Button Next (Group 4)
element, which navigates them to the account page:
Logged-In Users can access this page.
This page allows new Users to complete their profile information.
Users do not click anywhere to access this page.
New Users are navigated to this page automatically after clicking the Button Sign Up
element within the login/signup popup
reusable element:
If you require Users to confirm their email, the Button Get Started (Goes to Onboard)
element on the confirm page navigates the Current User to this onboard page.
This page contains four groups (Group 1
, Group 2
, Group 3
and Group 4
) which show different onboarding messages to the Current User.
The groups are shown and hidden based on the Group Onboarding Page Container's
element's "CurrentSlide" custom state value (type: number, list: no).
The Button Next
elements use the "Element Actions --> Set State" action to change the value of this custom state to a number between 1 and 4.
When that custom state's value is changed, the corresponding group is shown based on these conditionals:
Group 1
Group 2
Group 3
Group 4
If you would like to add more groups, you would need to copy+paste a group, and change that new group's conditional formatting. For example, if you added a Group 5 element, the conditional would be:
"When Group Onboarding Page Container's CurrentSlide is 5" This element is visible (checked)
Then, make sure Group 4's Button Next (Group 4)
element's text is changed to "Continue", and that that button's workflow sets the "CurrentSlide" custom state (type: number, list: no) to 5 (instead of navigating the Current User to the messaging page).
For more information on how these custom state actions work, please refer to the B. Onboarding workflow folder.
This page uses some of the onboarding and empty state groups from the UI Components page. To add more 'slide' groups you can copy+paste group elements from there as well.
The group elements on the UI Components page are set to be visible on page load. When copy+pasting them to the onboard page, uncheck the "this element is visible on page load" setting, and set the group to only be visible based on the corresponding custom state value.
The header_logo_only
reusable element is shown on this page, since we'd prefer that the Current User complete the onboarding steps before viewing other pages of the app.