Register and Log-In Flows

Requirements

  • Branding: VSHN

  • Name: VSHN Account

  • User friendly experience without any obstacles

  • Wording

    • Registration: To create a new VSHN Account

    • Sign-In: Login process to an existing VSHN Account

  • Registration via:

    • “Classic” E-Mail / Username / Password

    • Social accounts Microsoft, Google, GitHub

  • 2FA is mandatory

  • Registration with a vshn.ch or vshn.net E-Mail address is denied because these are employee accounts, manually created.

Flows

We distinguish between registration and sign-in to make it apparent to the user and to attract users with a nice sign-up flow.

Registration

Flow:

  1. Choose to register via social account or E-Mail address

  2. Setup OTP

  3. Confirm E-Mail address

vshn account register step1.drawio

Notes:

  • We want to encourage users signing up with social accounts

  • The layout must make it clear that the VSHN Account is also used for different products of VSHN (APPUiO, Servala and VSHN itself)

  • E-mail address must be confirmed before the account is active, also OTP is enforced to use the account

  • More settings like the name can be configured in the account console, not mandatory on registration

  • We want to use the E-Mail address to login

Sign-In

vshn account signin.drawio

Account Console

The Account Console must be branded according to VSHN brand guidelines (only colors and logo), but we keep default Keycloak functionality for now.