Flows

Descope Flows is a visual no-code interface to build screens and authentication flows for common user interactions with your application. Descope Flows simplifies authentication work for developers by abstracting away the implementation details of authentication methods, session management, risk management, and error handling. This helps you get your app in front of users faster and safer than before.

This overview of Descope Flows will cover two features: Flow Builder and Screen Builder. The video below gives a quick overview of these capabilities.

Further details about flow builder shortcuts, custom flows, disabling flows, and exporting/importing flows can be found under Managing Flows.

Flow Builder

The Flow Builder gives you the tools to define authentication-related application logic in a visual workflow. You can create Flows in the Descope UI for user sign-up, sign-in, MFA, and other similar use cases. Once created, Flows can be called from your chosen Descope Client SDK.

Flows are made up of Steps, which can be of different types. For example:

  • An Action Step can activate authentication methods (like social login or magic link verification), update user information, or call third-party APIs.
  • A Condition Step can act like a decision tree and check an “if-then” type of condition.
  • A Screen Step can help you build login screens that adhere to your brand and styling.
Descope flow example.

Handling Errors in Flows

Descope allows you to configure what to do in the event of an action error during flow execution. You can select any action within your flow, expand the error handling area, and configure the handling to be Automatic, Ignore, or Custom.

Descope Error handling within flow action configuration.

When you select custom, you can change the flow behavior based on the error of that action. You can then choose how you want to handle the error. A couple of examples would be to show a screen that the error occurred and suggest other auth methods, or you can direct it back to the beginning of the flow, or in the event of an error with a connector, you can add a condition for the error and then do other actions. This Knowledge base guide provides an example of handling connector errors and specific status codes.

Error handling within Descope flows example.

Screen Builder

The Screen Builder is a widget-based interface that enables you to build user-facing login and sign-up screens from the Descope UI. Whenever you add a Screen Step while creating Flows, you can design the associated screen using the Screen Builder.

You can easily create screens with widgets such as:

  • Inputs that capture user details like email IDs and phone numbers
  • Buttons for users to select actions such as login methods (SSO, Social Logins, etc.)
  • Text boxes that can display login errors and success messages
  • Links that can point to your privacy policy, terms of service, or other destinations
  • Images that can display your brand’s logo or other custom images
  • Containers that help you layer and position other widgets
Descope screen builder example.

Alignment And Direction

Buttons, texts, icons, and other inputs support alignment and direction. Alignment can re-organize elements in three screen positions - left, center, and right. Configuring direction is used for input elements to support RTL (Right To Left) languages such as Hebrew, Arabic, Farsi, etc. Clicking on the component will reveal the options available.

Descope Text Direction and Align example.

Available Configurations

  • In Text, Link, and error messages, you can control text alignment and direction.
  • In all other components, text alignment is defined according to text direction and alignment available in the component configuration.
  • The button’s text is always aligned to the middle, so only the Oauth logo changes direction.
  • Text in a divider is always aligned to the middle.
  • Inputs and boolean have only left or right alignment to make it easier for development.