Accessing the new React UI

by Michael Nadeau Updated on Mar 11, 2025

The Onit development team has worked hard on our platform's new user interface (UI).

We recently announced Onit's general audience release of our new React-based UI for end users. Right now, the system admin must feature-flip the new UI; I have included instructions below.

We are also working on a new UI for Onit's App Builder and Advanced Designer. However, a few features are already available only in the React Advanced Designer, so we're also providing instructions on how to access it to utilize these new features.

Turning on the React UI for End Users

To turn on the React UI for your corporation's end users, navigate to your environment's Administration page.

Select Edit Corporation from the sidebar.

Select the Beta Features tab.

Select the React UI checkbox. You should also make sure the New Home Page checkbox is also selected.

Select the Update button to the bottom right.

Your environment should now be displayed in the new UI.

Check out our Quick Tour article for help navigating the primary changes we made to this UI.

Accessing the React UI's Advanced Designer

NOTE: You should only use the React Advanced Designer to configure otherwise unavailable features in our Legacy UI's Advanced Designer since we are still working to resolve bugs in the React version. (We'll let you know whenever you need the new UI for a given feature.) Once you've configured a feature in the React Advanced Designer, you should return to using the Legacy UI's Advanced Designer to avoid these bugs.

Using the React UI's Advanced Designer

To access the React UI's Advanced Designer, you can visit your app's Advanced Designer as usual. Append /better_advanced_designer to the URL and hit Enter. You'll be redirected to the React UI Advanced Designer.

Original URL: https://acme.onit.com/apps/59fda45c4312b13fc6000000

Modified URL: https://acme.onit.com/apps/59fda45c4312b13fc6000000/better_advanced_designer

Exiting the React UI's Advanced Designer

To exit the React UI Advanced Designer, remove the /better_advanced_designer from your app's Advanced Designer URL, and you'll be taken back to the Legacy UI Advanced Designer.

Previous Article Passing in Custom SAML Attributes - Configuring a FusionAuth Connection

Next Article Using Badges to Enhance App Orchestration Visibility and Workflow

App Builder Developer Tutorials

Getting Started 3

Process Builder Documentation 4

Basics of Business Logic 7

Working with Fields 14

Working with Spreadsheets and Documents 9

Building Workflow 15

Working with Records 9

Configuring Actions 3

Customizing the User Interface 6

Administration 12

Integrations 12

Beta Features 3

Reference Materials 9

Other Resources

docs.onit.com contains proprietary and confidential information owned by Onit, Inc. that is subject to copyright. Onit presents it exclusively to you for your sole use in conjunction with using Onit products. No portion of the materials contained herein may be used for any other purpose. No portion of the materials contained herein may be shared with third parties or reproduced in any form.