Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 13 Next »

Table of Contents

UX

Click model

https://overflow.io/s/G1KSA64Y

UX Assets

https://gpworrell428458.invisionapp.com/console/share/GN28XA643A

Mobile views

https://gpworrell428458.invisionapp.com/overview/FIO---Account-Creation---Mobile-Views---April-12th--2021-cknewdhnf00kf0115be92b111/screens

Create Account

Visual

Functionality

Email & Password

  • Collect

    • Email Address

      • X appears when first character is entered

        • When licked it clears the content and disappears

    • Password

      • By default password is displayed as •••••••

      • When 👁 clicked show password for both Password and Password Confirm

      • X appears when first character is entered

        • When licked it clears the content and disappears

    • Password Confirm

      • By default password is displayed as •••••••

      • When 👁 clicked show password for both Password and Password Confirm

      • X appears when first character is entered

        • When licked it clears the content and disappears

    • Promo email opt-in (default checked)

  • Validate

    • Email Address

      • Validate onfocusout

        • On validation error

          • Turn border red

          • Display error message:

            • Invalid Email Address

            • This Email Address is already registered, Sign-in instead

      • Validation rules

        • Must be a valid email address format

        • Must be not yet registered

    • Password

      • Display validation rules on onfocusin

      • Validate onkeyup

        • Display ✅ when validation rules satisfied

      • Validate onfocusout

        • On validation error

          • Turn border red

          • Display error message:

            • Invalid Password

      • Validation rules

        • Min 10 characters

        • Min 1 lowercase letter

        • Min 1 uppercase letter

        • Min 1 number

        • Special characters optional

    • Password Confirm

      • Validate onkeyup

        • On validation error

          • Turn border for Password and Password Confirm red

          • Display error message:

            • Passwords do not match

      • Validation rules

        • Must match Password

  • Display

    • NEXT link

      • On click display PIN Code Page

    • Log-in link

      • On click display Log-in Page

PIN Code

  • Collect

    • PIN Code

  • Validate

    • PIN Code

      • Validate onkeyup

        • No action if non-digit entered

      • Validation rules

        • Exactly 6 digits

  • When 6 digits entered display PIN Code Confirm Page

  • Display

    • Back link

      • On click display Email & Password Page

PIN Code Confirm

  • Collect

    • PIN Code Confirm

  • Validate

    • PIN Code Confirm

      • Validate onkeyup

        • No action if non-digit entered

        • On validation error

          • Turn ••••••• red

          • Display link to PIN Code Page

      • Validation rules

        • Must match PIN Code

  • When 6 digits entered and match display Account Confirm Page

  • Display

    • Back link

      • On click display PIN Code Page

Account Confirm

  • Display on Show Account Information click

    • Email Address

    • Password

    • PIN

  • Display

    • CREATE ACCOUNT link

      • On click display Account Creation Confirmation Page and create account

Create account

Account Create Confirmation

  • Reload to Home Page Authenticated after 3 seconds or after account is created whichever is last.

  • Force Verify Email Blocker Page after this step

Secret Questions

  • Overlay Secret Questions pop-up is shown only immediately after Account Creation

  • Collect

    • Secret Question 1

    • Secret Question 2

  • Validate

    • Secret Question 1

      • Validate on NEXT click

        • On validation error

          • Turn border for Secret Question 1 red

          • Display error message:

            • Please select question

        • Validation rules

          • Secret Question 1 selected

      • Secret Question 2

        • Validate on NEXT click

          • On validation error

            • Turn border for Secret Question 2 red

            • Display error message:

              • Please select question

        • Validation rules

          • Secret Question 2 selected

  • Display

    • NEXT link

      • On click display Secret Questions Answer Page

    • Skip link

      • On click display Secret Questions Skip Confirm Page

    • X link

      • On click display Secret Questions Skip Confirm Page

  • List of questions - as provided by EDGE API

Secret Questions Skip Confirm

  • Display

    • SKIP ANYWAY link

      • On click show Home Page Authenticated Page with Secret Questions Skipped Warning

    • X link

      • On click show Home Page Authenticated Page with Secret Questions Skipped Warning

Secret Questions Answer

  • Collect

    • Secret Question 1 Answer

      • X appears when first character is entered

        • When licked it clears the content and disappears

    • Secret Question 2 Answer

      • X appears when first character is entered

        • When licked it clears the content and disappears

  • Validate

    • Secret Question 1 Answer

      • Validate onfocusout

        • On validation error

          • Turn border for Secret Question 1 Answer red

          • Display error message:

            • Please enter at least 3 characters

        • Validation rules

          • Min 3 characters

    • Secret Question 2 Answer

      • Validate onfocusout

        • On validation error

          • Turn border for Secret Question 2 Answer red

          • Display error message:

            • Please enter at least 3 characters

        • Validation rules

          • Min 3 characters

  • Display

    • NEXT link

      • On click record secret questions and answers and display Home Page Authenticated Page with Account Created Notice

    • Skip link

      • On click show Secret Questions Skip Confirm Page

    • X link

      • On click show Secret Questions Skip Confirm Page

Record Secret Questions and Answers

Home Page Authenticated Page with Account Created Notice

  • This notice is shown only once, when the user is lands on the Home Page directly after registration.

Home Page Authenticated Page with Secret Questions Skipped Warning

  • This notice is shown continuously on the Home Page until on of the 2 things happen:

    • User sets up Password Recovery

    • User clicks

Sign-in

Visual

Functionality

Sign-in

  • Collect

    • Email Address

      • X appears when first character is entered

        • When licked it clears the content and disappears

    • Password

      • By default password is displayed as •••••••

      • When 👁 clicked show Password

      • X appears when first character is entered

        • When licked it clears the content and disappears

  • Validate

    • Email Address

      • Validate onfocusout

      • On validation error

        • Turn border for Email red

        • Display error message:

          • Invalid Email Address

      • Validation rules

        • Must be a valid email address format

    • Log-in

      • Validate on Sign In click

      • On validation error

        • Turn border for Email and Password red

        • Display error message:

          • Invalid Email Address or Password

      • Validation rules

        • Email/Password match

  • Display

    • Sign In link

      • On click display Home Page Authenticated Page

    • Forgot Password link

      • On click display Forgot Password Page

    • Create Account link

      • On click display Create Account → Email & Password Page

Forgot Password

  • Display

    • Ok link

      • On click display Sign-in Page

    • X link

      • On click display Sign-in Page

Sign-in with PIN

  • This page is displayed by default if user has been logged automatically due to inactivity and clicks Sign-in or tries to access a page which requires log-in.

  • It is not shown when user logs out by clicking Sign-out button.

  • Collect

    • PIN

Verify Email Blocker

Visual

Functionality

Initial account creation

  • This page is displayed after user creates a new account and it cannot removed (do not show the X)

  • If users logs-in again and email has not been verified, show this page

  • Display

    • Links

      • Send Again

        • On click

          • Re-sends Verification Email

Email change

  • This page is displayed after changes email and it cannot removed

  • If users logs-in again and email has not been verified, show this page

  • Display

    • Links

      • Revert to Original

        • On click

          • Cancel the email change and revert to the original email and display Settings Main Page

2AF Approval

Visual

Functionality

Sign-in blocked by 2FA

  • This page is displayed when a user log-in is blocked by a 2FA. See /wiki/spaces/DAO/pages/151879691 for details.

  • Collect

    • Back-up code

      • On complete entry validate and if correct add device IP and display Sign-in page

Approve 2FA Sign-in

  • This page is displayed on the known device when 2FA is enabled. It takes over a screen once user logs in or transitions to another page while signed in.

  • Display

    • Links

      • It was me…

        • On click

          • Add new device IP to 2FA list

      • Not me… or X

        • On click

          • Do not show this request anymore

Password Recovery

Visual

Functionality

Landing

  • This page is displayed when link in Password Recovery email link is clicked

  • Display

    • Secret questions

    • Confirm

      • On click

        • Change password and redirect to Sign-in Page

    • Cance

      • On click

        • Display Home Page

  • Collect

    • Secret Answers

    • New password (not yet on UX)

  • Validate

    • Secret Answers

      • On Confirm click

        • On validation error

          • Turn border red

          • Display error message:

            • Invalid Answer

    • New Password

      • Validate onfocusout

        • On validation error

          • Turn border red

          • Display error message:

            • Invalid Password

Partial registration recovery

This functionality attempts to recover a mismatch of registrations between EDGE and Dashboard.

  1. User is signing in

    1. No user in Dashboard

      1. If user exists in EDGE and pass match

        1. Automatically create user in Dashboard and log them in

      2. If user exists in EDGE and pass does not match

        1. Display invalid password

    2. User in Dashboard, but not in EDGE

      1. Create user in EDGE with supplied pass

  2. User creates account

    1. No user in Dashboard

      1. User exists in EDGE and pass match

        1. “adopt” the user and continue registration

    2. User in dashboard

      1. No user in EDGE

        1. Create user in EDGE and continue registration

  • No labels