User Profile & Settings

User Profile and Settings pages

User Page

Dating app user’s page.

On clicking the first segment of the home page this page can be accessed.

This page contains information about the user profile and settings. In this page, the user can edit his/her profile and set the settings of the app as per his requirement. In this page, the user can upload his profile picture from media or facebook. This page navigates to settings page, edit info page, and add media page.

User profile — Edit Profile

This page can be accessed from the user profile page by clicking on the “EDIT INFO” button. Here you can edit your profile information and enable or disable authentications like to show your age, your distance visible to others and many more. Here this page is only UI for demo purpose but you can make it a fully functioning real-time app by integrating back-end with the help of a back-end developer.

Settings Page

This page can be accessed by clicking on the settings on the user page. In any app, settings page plays an important role in setting user’s preferences and requirement, here user can set the preferences for Push Notification, Email Notifications, and Team dating notifications. This page allows you to toggle some preferences and navigates to other pages to select choices. This page allows the user to select the maximum distance to search for the profile to match with the user’s profile, setting the age range, toggle to show the user’s profile on the app, share user’s feed, setting data usage, managing Top Picks, managing push and email notifications, sharing the app with friends and contacts, and to delete account from the app.

This page navigates to… i. Account Setting ii. Show Me iii. Share my feed iv. Autoplay videos v. Email Setting vi. Push Notifications vii. Team Dating viii. Delete Account

We can select and set any setting from the list of settings arranged in the vertical direction. This is the only UI for the demo purpose.

Settings Page — Phone Number Setting

This page can be accessed by clicking on the Account setting in the setting page.

Here we can edit our registered contact number and update with the new one. Here this is only the UI for demo purpose.

Settings Page — Show Me

This page can be accessed by clicking on the Show me in the setting page.

Here we can select our gender preference and let the application search the filtered preference for you. Here this is only the UI for demo purpose.

Settings Page — Share my feed

This page can be accessed by clicking on the Share my feed in the setting page.

This page lets the user to allow or disallow sharing their social content with other user’s to increase their chances of receiving messages.

This page contains the toggle at the right side of each item of the page. To enable and disable sharing feed settings, you may toggle them. Here this is only the UI for demo purpose.

Settings Page — Autoplay videos

This page can be accessed by clicking on the Autoplay videos in the setting page. This page allows you to check when to use data to play videos because playing videos use more data than displaying photos.

Settings Page — Email Setting

This page can be accessed by clicking on the Email Setting in the setting page. Control the emails you want to get- all of them, just the important stuff or the bare minimum. Here this is only the UI for demo purpose.

Settings Page — Push Notifications

This page can be accessed by clicking on the Push Notifications in the setting page.

Here you can enable and disable your notifications related to a new match, messages, likes, super likes, and top picks in the Dating app.

This page contains the toggle at the right side of each item of the page. To enable and disable push notification, you may toggle them.

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.

Settings Page —Team Dating

This page can be accessed by clicking on the Team Dating in the setting page. Here you can enable or disable to receive news, update, and offers from Dating App.

Settings Page — Delete Account

This page can be accessed by clicking on the Delete Account in the setting page at the very bottom of the page.

this page lets the user to pause the account or delete the account from the app. This page navigates to the Delete my account page.

Settings Page — Delete My Account

This page can be accessed by clicking on the Delete My Account in the delete account page at the very bottom of the page.

This page allows the user to delete/ deactivate their account from the app.

User profile— Add media

This page can be accessed from the user profile page by clicking on the “ADD MEDIA” button. Here you can change your profile picture by selecting facebook’s profile picture from facebook or you may opt to use your device gallery to select a picture. Here this page is only UI for demo purpose. You can integrate Facebook Login using firebase in Ionic 4 by following this tutorial.

Last updated