Detailed Design
White with Purple accents
Dark Grey with Light blue accents
This is the first page users see when the app is opened. The crossed out box is for the apps logo. Accepts usernames and passwords. The Login button sends the user to the Personal Home Page, while the Sign Up button on the other hand sends the user to the Sign Up Page.
This is the sign up page for new users to the app. Users need a name, username, password, email, and a phone number. They will also have to confirm their password, and their email. The Sign Up button sends the user to the Personal Home Page, and the small left pointing arrow in the top left corner returns the user to the Welcome Page.
This is the Home page for sharing personal information. It provides the user information on what social media accounts are being shared. The small camera in the top left corner sends the user to the QR Code Scanner Page. The small gear across from it in the top right corner sends the user to the Settings Page. The button labeled Business shows the Business Home Page, and the tab at the Bottom of the screen pulls up the Contacts Page. Finally, right in the center the QR code is a button that brings up the Scannable QR Code Page.
This is the Home page for sharing business information. It provides the user information on what business social media accounts are being shared. The small camera in the top left corner sends the user to the Camera Page for scanning QR codes. The small gear across from it in the top right corner sends the user to the Settings Page. The button labeled Personal shows the Personal Home Page. Finally, right in the center the QR code is a button that brings up the Scannable QR Code Page.
This is the camera page for scanning QR codes to add new contacts. The small left pointing arrow in the top left corner returns the user to the Personal Home Page. The button labeled Add on the other hand scans the QR code if there is one then creates a new contact with the information found and sends the user to the Other Profile Page to show the user what was scanned.
This is the QR code that is shown to other users of the app to add the user as a contact. The small left pointing arrow in the top left corner returns the user to the Personal Home Page. Will have a way for non default QR codes to happen here.
This is a scrollable list of contacts that the user has added. The search bar at the top allows for searching the contact list. At the bottom of the screen the tab labeled Home returns the user to the Personal Home Page. Each of the contacts in the list direct the user to the Other Profile Page for that contact.
This is the page in which the user sees what the QR code found for the contact. It has a picture, a name, and a list of contact information. The small left pointing arrow in the top left corner returns the user to the Personal Home Page.
This is the settings page for the app. The small left pointing arrow in the top left corner returns the user to the Personal Home Page. The Dark Mode switch changes the color scheme to the Dark Mode scheme when selected, and back when unselected. Personal Information sends the user to the Edit Personal Information Page. Personal Social Media sends the user to the Edit Personal Social Media Page, on the other hand, Professional Social Media sends the user to the Edit Professional Social Media Page. Finally, Account Info sends the user to the Account Info Page.
This is the page for editing the personal information that is shared using the QR Code, such as the users name, or phone number. It also allows the user to edit the picture that is shared. The small left pointing arrow in the top left corner returns the user to the Settings Page. The save button updates the users information and returns them to the Settings Page.
This is the page for editing the default social media to share when selecting the QR Code from the Personal Home Page. It also allows the user to add social media accounts. The small left pointing arrow in the top left corner returns the user to the Settings Page.
This is the page for editing the default professional social media to share when selecting the QR Code from the Business Home Page. It also allows the user to add professional social media accounts. The small left pointing arrow in the top left corner returns the user to the Settings Page.
This is the page for viewing the information on the account that is logged into the app. It allows the user to edit the username , password, and email associated with the account. This is the page for editing the default social media to share when selecting the QR Code from the Personal Home Page. It also allows the user to add social media accounts. The small left pointing arrow in the top left corner returns the user to the Settings Page. The Log Out button sends the user back to the Welcome Page and logs them out of the app.