Back to Overview
EXAMPLESAvailable

Authentication Flow

Modeling sign in, invalid credential errors, MFA challenges, and session creation.


Visual Interaction Graph

Flowchart
Rendering diagram...
Authentication OTP flow graph.

Complete UXDL 0.1 Specification

YAML
uxdl: "0.1"
app: Enterprise Auth
title: User Authentication
actors:
user:
name: Platform User
type: human
screens:
sign_in:
name: Email Sign In
type: page
states:
default: Email input form ready
invalid_credentials: Bad email or password error
actions:
submit:
name: Submit Credentials
actor: user
relations:
otp_required:
to: auth_verify_otp
when: Valid credentials; OTP code dispatched
failed:
to: sign_in
state: invalid_credentials
when: Credentials invalid
auth_verify_otp:
name: Verify OTP Security Code
type: modal
parent: sign_in
states:
default: 6-digit OTP code prompt
expired: OTP code expired
actions:
verify_code:
name: Submit OTP Code
actor: user
relations:
success:
to: dashboard
when: OTP verified successfully
resend_code:
name: Resend OTP Code
actor: user
relations:
sent:
to: auth_verify_otp
state: default
dashboard:
name: User Dashboard
type: page
states:
ready: Dashboard loaded