Profile Pages

Profile

This is the fifth tab and the first segment of this application. This page contains the nesting of tabs and segments. This page has two segments at the top of the page below the header as “DETAILS” and “ACCOUNTS”. This is the first segment of the profile tabs. This segment has a list of actions in vertical direction. All the action executes as…

  1. Mini Biography

  2. Add my preferences

  3. Verify my id

  4. Verify mobile number

  5. verify email

  6. Add a car

Profile — Mini Biography

This page can be accessed from the “Profile” page.

The options available can be chosen to edit user name, email address, update password, address, contact, Gender, DOB, Bio, and etc as per your requirement and update all those. Back button takes you back to the “Profile” page.

Profile — Add my preferences

This page can be accessed from the “Profile” page by clicking on the “Add my preferences”. Here you can edit your preferences and update that. The save preferences button will update your data in the database and navigate back to the profile tab. Here this is only UI for demo purpose.

Profile —Verify my id

This page can be accessed from the “Profile” page by clicking on the Verify my id”. This page will navigate to update document details.

Profile — Update Document

This page can be accessed from the “Verify my id” page by clicking on the “Driving License”. This page will navigate to the camera.

Here this is only UI and for demo purpose. You can make it in a fully functioning app by integrating back-end with the help of a back-end developer.

Profile —Verify mobile number

This page can be accessed from the “Profile” page first segment. Verify mobile numbers page can be used to authenticate a user to check a user is registered or not. After entering the registered mobile number it navigates the user to the OTP verification page which a user receives after entering his/her mobile number.

Here these two pages are only UI and for demo purpose.

Profile — OTP Verification

This page can be accessed after entering the phone number in with phone number page. In this page, received OTP on user’s mobile gets verified for letting the user to access the home page. On clicking “CONTINUE” it navigates back to the apps profile tab. This page here is only the UI but you can make it a fully working app by integrating a suitable backend by a developer.

Profile — Verify email

This page can be accessed by clicking on the verify email in the profile page. Here you can control the emails you want to get either all of them, just the important stuff or the bare minimum. Here you have the options to enable and disable email notifications.

You will first need a Push notifications system in your back-end. If you are using Firebase — implementing, enabling and disabling push notification is very easy compared to a custom back-end. Read more about Firebase- Ionic push notification here. Here this is only the UI for demo purpose.

Profile — Add a car

This page can be accessed by clicking on the Add a car in the profile page. This page navigates to the add new vehicle page.

Profile — Add a car — Add new vehicle

This page can be accessed by clicking on the Add button at the very bottom in the Add a car page of the profile page. Here the items are listed in a list view in the vertical direction. Each item contains a dropdown menu to select the matching item from them. By clicking on the “COMPLETE” button it will navigate back to the add car page.

Last updated