Boosted Posts

Design Assets

• General boosted post design -> https://invis.io/KWU1X9IEB2U#/393838935_Boosted_Post
• Boosted bost content variations -> https://invis.io/KWU1X9IEB2U#/393843178_Boosted_Post_Variations

Design Notes

• Boosted post container has a fixed height of 720px. It is important that the varied nature of posts is presented as a clear and consistent structure as possible.
• Boosted content distinguishes itself with a blue border and Bosted Content label at the top-left.
• The total number of boosted posts is displayed top-right.
• An animated countdown wheel shows when the next post will display. Duration TBC.
• If the cursor enters any portion of the boosted post container, the posts will not transition. The timer will be paused and elapsed timer set to zero.
• If the user starts typing a comment, the timer should be reset and paused.
• We may introduce some subtle animation between posts, in order to make the change from one post to another less severe. TBC.
• The first boosted post instance should not be the first item in a users news feed. First occurrence should be the second item.
• Other instances of the boosted content should be displayed as the user continues to scroll through the newsfeed. Perhaps every 10 newsfeed items. Frequency TBC.
• Given there will be multiple instances of the scrolling boosted posts, it is important that the user doesn’t see the same boosted content again and again. The boosted content displayed should be as unique as possible to the user.
• Given the consistent height of the boosted post container, we need to account for all the various permutations of content that could be displayed. See above InVision link.
• Any comments are hidden by default.

changed milestone to %Misc. Q4 2019

added scoped labels

changed weight to 3

mentioned in epic &92

added scoped label

added scoped label and automatically removed label

added scoped label and automatically removed label

added 1d of time spent at 2019-12-09

added scoped label and automatically removed label

added 6h of time spent at 2019-12-11

• general layout
• style action buttons
• resize text based on its length
• blue borders
• comment poster component
• finish styling images and videos
• check text alignment when there's only text
• fix the auto-rotation, which seems to be running even when paused
• inject the rotator component throughout the feeds, taking offsets into account
• re-style left and right arrows
• change m-post-menu icon to three vertical dots
• re-export pay icon