Skip to content

3. View UI UX

russecla edited this page Mar 18, 2022 · 33 revisions

UI/UX:

UX Flow Diagram

Figma Flow Diagram

Figma Mockup (Limited Access): link to Figma

Rememri Views

2D Map View

2d Map View

  • App name visible in top tool bar
  • Buttons linking to user account page and friends pages in top tool bar
  • Two dimensional map showing the user's current location and nearby posts
  • Slider at the bottom of the map denoting whether all public posts will be shown, or only the user's friends posts
  • changed from the original mockup to include both "Public" and "Private" labels in the slider for clarity and ease of use
  • Camera button in bottom tool bar connects to Camera View and will lead user through taking, editing, and posting a photo
  • AR button in bottom tool bar connects to Augmented Reality View

Camera View, Post Edit, and Privacy Setting

Camera Flow

  • Android Camera functionality allows user to take a picture and perform based edits, like cropping
  • Once the photo is taken and edited, a custom screen will show where the user decides the privacy level for the new post (either public or friends-only)
  • When finished, the user can press the "Post" button to post the photo to the AR view and the 2D Map

Augmented Reality View

AR View And Post View

  • The user is able to view nearby posts in Augmented Reality
  • The posts will be displayed as floating images in rectangular picture frames
  • When the user taps on a floating frame, it will open the Post View In 2D

Post View in 2D

  • As shown above in the AR view image, when a user clicks on a floating frame, it will take them to a view of the post in 2D
  • Below the post are comments that other users have made on the post
  • The user is able to make comments below the post by using the text field and comment button

Friends Views

Friend View Flow

  • View Friends
  • Add Friends
  • Manage Friend Requests

Account Management View

Account Management No Account View

  • Guest
    • When the user is NOT logged in to their Rememri account, they will only be able to see public posts in the 2D Map View and the AR View
    • When they navigate to the User Account Management view, they will see an option to log in or sign up
  • Logged In User
    • Once the user is logged in to their account, they will be able to view their friend's posts and toggle between public and friends-only view.
    • When they navigate to the User Account Management view, they will see an option to log out of Rememri

Clone this wiki locally