​​UX Plan Example: Following Feed Page
​​
​​Key:
​​​♥​ = Request for design deliverable (wireframe or visual comp).
​​​✨​ = Request for brand design support.
​​​📝​ = Request for copy support (add inline or build a separate deck).
​​​📈​ = Request a data tracking need.
​​​🛠️​ = Flagged for Quality Assurance (QA) testing purposes.
​​

​​Summary

​​Last Update: 9/23/16 NS
​​Asana Task: Insert task link(s)
​​UX Deliverables: Insert link(s) here
​​User Stories:
​​[1] As a Shop Owner, I use the composer to post feed content updates about my products or shop.
​​[2] As a Customer or Member, I use the feed to read and like or click into updates from Shops I follow.
​​
​​

​​1. Following Feed Page

​​a. Active/Existing User ​♥​

  • ​​Page Type: normal
  • ​​User Types: all but visitor
  • ​​User States: existing user, active user, signed-in, approved shop
  • ​​User Flows: 
  • ​​Prev: anywhere they can access the following feed page via a link
  • ​​Next: filter the feed
  • ​​
  • ​​Content States:
  • ​​​📝​ Link to Guidelines 
  • ​​Open Guidelines in a modal (just like we do on discussions).
  • ​​Posting Guidelines
  1. ​​Be civil and respectful to others
  1. ​​No harsh or offensive language
  1. ​​No promotion of other marketplaces or websites
  1. ​​Less is more. Don’t post too often or you may lose followers.
  • ​​Any posts violating these guidelines may be removed. 
  • ​​Feed of Posts ​♥​
  • ​​Load in 25 posts in reverse chronological order.
  • ​​Display [Load More] Button at the bottom of the feed.
  • ​​On Click — Load 25 more posts beneath and display [Load More] button again underneath that set.
  • ​​Individual Posts ​♥​
  • ​​Feed category label
  • ​​Shop avatar, shop name
  • ​​On Hover — Show user hover card
  • ​​On Click — Go to the shop’s page
  • ​​Three Dot Sub-Menu 
  • ​​​📈​ [Unfollow] Button 
  • ​​Note: If a shop owner is looking at their own card, don’t display unfollow button.
  • ​​On Click — Unfollow shop, dynamically remove shops posts.
  • ​​​📈​ [Permalink] Button