HyperDrive: Update #4

Intended Audience: Marija Bezbradica (FYP Supervisor)

Made progress with:

  • Basic API functionality.
  • Basic UI for registration / login system.
  • Email account validation.

I have completed the basic functionality of the web application. A user can create an account, log into an account and update their information.

As well as some custom CSS the web application uses bootstrap (HTML / CSS framework) with a Material Design theme to make it look a little more professional.

The image below is the initial screen a user will be presented with. At the moment the phone picture and text are just placeholders, which will be updated when the project is completed. Screen Shot 2016-04-04 at 20.34.17

From the nav dropdown ‘account’ a user can choose to either login or register and the appropriate screen will be displayed to the user.
Screen Shot 2016-04-04 at 20.34.30 The registration form fields have some form validation before the ‘register’ button at the bottom becomes active:

  • All fields are required.
  • Email address must have valid syntax.
  • Password must be more then 5 characters long.

There is also an indicator to show users how strong their password is.

Screen Shot 2016-04-04 at 20.34.49

After the user clicks register they are asynchronously sent an email which has a link containing their activation key. The users account does not become activated until the link gets clicked.

I am using a gmail account to send these emails. If I have time left over at the end of the project I might make this look a little more impressive. Here is the email a user receives:

Screen Shot 2016-04-04 at 20.55.55

This screen allows a user to update their information.Screen Shot 2016-04-04 at 20.58.13

Once the user has successfully logged in the ‘Journeys’ option becomes visible in the menu bar. The is the screen that will display a list of the journeys a user has made.

At the moment it holds an embedded google map as well as a basic layout which I shall be improving upon.

Screen Shot 2016-04-04 at 20.36.42