MVP Features & Page Mockups

          

MVP Features:

Required

• Games (Books) - display game 'cards' with game info
• Game Categories (Bookshelves) - sort games into categories with their own pages
• Reviews - be able to add a review for a game
• Played Status (will play, playing now, played) - be able to 'save' a game and an associated played status
  • Bonus: Search across multiple models
  • Bonus: Tags

Stretch Goals Implemented

• CSS/Brand: Full page width / sticky nav bar with nav content contained within page wrap (@Steve!!)
• CSS/Brand: Custom form and button styling animations (@Steve!!/@Bergan!!)
• CSS/Brand: Custom designed logo gif to animate popular 'good game' shorthand, 'gg' (@Cub!!)
• CSS/Brand: Custom main page header (@Cub!!)
• FEAT: Functional Search Bar (@Bergan!!)
• FEAT: Dynamic javascript for adding/updating/removing review comment from game page when logged in (@Drew!!)
• FEAT: Dynamic javascript for adding/updating/removing games from library when logged in (@Eric!!/@Cub!!)
• FEAT: Instant Demo Login functionality allowing others to review functionality with 1-click (@Drew!!/@Eric!!)
• FEAT: Create MyReviews page to show all games a user has left reviews for (@Drew!!/@Eric!!)

                     

Initial Mockups

1. Index (layout template)

• Navbar (logged out)

  • logo / links to home page
  • search bar(?)
  • Login
  • Sign Up

• Navbar (logged in)

  • logo
  • MyGames
  • MyReviews
  • Search Bar(?)
  • Log Out
  • Preferences / Gear Icon

• Footer (LO + LI)

  • Company Contacts Link
  • CopyWrite info
  • Link to Github Repo
  • Link to help FAQ

NOTE: Use this template to extend to other pages

2. Home (main page)

• Featured games banner below navigation bar links to feature product pages
• See product display cards with top ranked game by category, with links to category above it

3. Review Rankings by Category Page (3)

• Shows top ~20 games for each category
• Games rated by combo of (i) number of ratings and (ii) average rating score
• Hovering over a games product display card shows a summary pop up with rankings (? stretch goal) (when logged in...)
• Each product has a dropdown below it with options: "Want to play" "Playing" and "Played"
  • If user selects the "played option" they are prompted to rate and review the game

4. Single Product Page

• Displays photos or videos showcasing the product (game)
• 1-2 paragraph description of the game
• Shows game details like Publisher, release date, platforms
• Displays total number of ratings and avg score
• Displays user reviews and review box for comments
• Provides link to purchase game
• includes LFG nav bar for discord links (? stretch goal)

5. Users MyGames Library Page

• Shows a list of games the user has engaged with on the site (i.e. selected something from the dropdown 'has played', etc)

6. User Account Preferences Page

• Shows the users account preferences with the ability to update: firstName, lastName, userName, phone, email, password
• Has button with ability to delete their account