Vatsa Heera

PLEY

Mobile App User Interface

Purpose

An extension of Yelp - Menu Item Search. Tool for comparing Price and Reviews of a particular menu item from all the restaurants


Competitive research and findings

*This research was done in 2017. This app was designed when Yelp’s search engine did not search for keywords in reviews*

Reviews are generic - may or may not be specific to a particular menu item
On search result screen one can see either list view or map view

Home screen analysis of individual apps
Yelp - Bland. No imagery, basic list view
Eat24 - Random suggestions, big, poor quality images, more scrolling, less relevant information, inefficient use of space
Uber Eats - Nice images, less information, two way scroll is confusing
DoorDash - All relevant information but not very pleasing UI
PrimeNow - same a Eat24



Defining functions of Pley

Primary
Menu Item comparison among all the restaurants for — Price and Rating

Secondary
Restaurant ratings, Distance, Restaurant reviews, Travel time, Opening hours, Website, phone, Happy hours, Delivery / takeout


Sketching the basic idea and playing with the possible navigation

Initial idea was to have two verticals. One vertical, Menu Items, would let user search the menu items and second vertical, Restaurant, would let user search restaurants


Creating Wireframes and blocking the design elements



Documenting User testing and feedback at different stages

Changes made based on user feedback


Home screen

  • Removed two verticals and combined search into one
  • Each user must view different option on what they wanted to see as a top category, so a customizable home screen was created that lets user add, remove, or rearrange categories
  • User profile button moved to hamburger menu
  • Search button added to the tab bar for ease of access
  • All users had different option on what they wanted to see as a top category, so a customizable home screen was created that lets user add, remove, or rearrange categories
  • Option for switching layout to List view

Search

  • Removed “GO” button as it did not flow with rest of the design
  • Highlighting the top most result in the list and its location on the map
  • Added distance and travel time
  • Along with the filters search was created in the nav bar for user to change search key words
  • Toggle between map and list view button was moved to the top for better visibility
  • Little pop-out window on map screen to preview result
  • Numbered search result on map screen to track sorting

Restaurant

  • Menu Item highlighted in the comments
  • Phone number and website clickable
  • “Show all reviews” button added to see all reviews of the restaurant
  • Added sort reviews by rating option

Favorite

  • Added search bar & filters button



User Empathy

Search for menu items

  • Q: What if the menu item does not exist in the database?
    • Comment 1: Give user other relevant options
    • Comment 2: Help user with auto correct
    • Idea 1: Show cusine based search results
    • Idea 2: Show category based search results
    • Idea 3: Popular item results based on cusine, category

    Review the results

    • Q: What if all the reviews are bad?
      • Comment: Block visibity of offensive comments
    • Q: How do you do quality check?
      • Idea 1: App should check for abusive words
      • Idea 2: Block user from posting abusive words

    Search experience on favorites screen

    • Q: How to make search experience easier when favorite items grow large in number?
      • Comment: Reduce scrolling
      • Comment: Narrow down search results
      • Idea 1: Add a filter button
      • Idea 2: Toggle between thumbnailview and list view

    Choose a restaurant

    • Q: What if a picked restaurant is no longer in business?
      • Comment: User should be able to report restaurant status
      • Idea 1: Add a button for user to report open/close status of the restaurant