Account page UI design notes

User profile

Profile Image

• Minimalistic and in a circle at the top center of the page
• Users can either use the default grey man or set their own image
• Used for communication (messaging and posted photos) and competitions within the app

Interests Description

• A 500 character limit
• Short description of historical interests
• Can include a set of predefined categories, e.g. civil war, government, slavery, and trade.

Shortened Wishlist

• A list of sites visited that you enjoyed and can mark for later.
• Includes an icon or a user set image with a short subtitle of the marker.
• Will quickly zoom to a location on the map home screen.
• User can define token color based on if it is in the favorite list.
• There will be a search bar at the top that can search by number, location, and time visited.

Places to visit list

• Similar to my favorite list in design, but below it.
• Can quickly zoom to a location on the map home screen.
• User can get notified when near the location (set distance by the user) of the site.
• At the top will be a search bar that can search based on the number, name, or relative location.

Share with Friends

• Shortened list of friends will be listed with the corresponding profile image.
• Next to the friend will be three dots that will bring up a popup corresponding to whether the user wants to share a site, send a message, remove, or block a friend.
• At the top of the list will be a search bar that can search by sites visited, interests, or name.
• In the bottom will be a search new friends button which will take them to a new screen.

Edit/Delete

• Edit button will be located at the top right of the screen
• Delete will be a small button on the bottom to prevent accidental profile deletion.

What other pages need to be accessible from this page

• The back arrow in the top left will take you to the home screen.
• The settings button will be next to the edit profile page and will take you to an editable version of the page.
• Each list will either take you to the friends, wishlist, or markers page.

How will a user navigate to each page

• The profile image on the home screen will take the user to the user profile information.
• Other accounts can access the page from their search friends list.
• Lists can be pressable links to their respective pages.
• Buttons will be present to edit, delete, or share either the profile or for going to pages to manage lists.