Skip to content

User Interface

Song Zheng edited this page Mar 23, 2020 · 58 revisions

Mockup_UI_edited_3_4

Pages

  • Forget password feature is unplanned. During development, please don't forget your credentials!

Landing

Really simple and straightforward landing page view.

Sign Up Page

Decisions

  • Keeping it simple, validation is only done once when users submit. May upgrade to input validations as users type later.

User Inputs

We decided to opt out of putting a confirm password input box.

  • E-mail input
  • Username input
  • Password input

User Interactions

Login Button

Takes user to Login page.

Signup Button

Trigger validations on backend

  • Username validations
    • Must have valid characters (alpha numberic characters only)
    • must be >= 1 character
    • Must not exist in the DB
  • Email validation -> TODO: delete unconfirmed accounts.
    • Must be a valid email
    • Must not exist in the DB
  • Password validation
    • greater than 8 characters Sends a POST request to server which responds with:
  • Error - Display the errors on signup page
  • Success - takes the user to the Confirm Email Page.

Email Confirmation Page

Renders a reminder for users to confirm their email.

  • Logout

User Interactions

Resend email -> Results in Your email has been sent message.

(External Page) Email Confirmation

Button / link for users to confirm their email.

Database Setup Page

A place for user to specify the database password they want to setup their database password. This password is not encrypted because our system needs to know about it in order to create the database. Tradeoffs

  • V1 - Will not be providing an option to allow users to change their database password.
  • Logout

User Interactions

Input password - Greater than 8 characters Takes users to Database Page

Login Page

  • Username Input
  • Password Input

User Interaction

  • Signup button -> Takes the user to signup page.
  • Login Button -> sends a POST request to server which responds with:
    • Error - Display the errors on login page
    • Success - Look at login validations below.

Login Validations

  1. Checks if e-mail confirmed
    • If e-mail is not confirmed, render confirm e-mail page.
  2. Checks if database password has been set
    • If database password has not been set, send user to database setup page.
  3. If the above 2 validations pass, send user to database page.

Databases

  • Displays list of database cards
    • If database has been created, show credentials button
    • Show Create Database button.
  • Logout Button
  1. Sends a get request to logout endpoint
Clone this wiki locally