{"id":5491,"date":"2015-09-16T06:00:44","date_gmt":"2015-09-16T13:00:44","guid":{"rendered":"http:\/\/thinkapps.com\/blog\/?p=5491"},"modified":"2015-09-18T12:53:07","modified_gmt":"2015-09-18T19:53:07","slug":"activity-stream-news-feed-complete-guide","status":"publish","type":"post","link":"https:\/\/thinkapps.com\/blog\/development\/activity-stream-news-feed-complete-guide\/","title":{"rendered":"The Essential Guide to Building an Activity Stream into Your App"},"content":{"rendered":"

This post is part of our\u00a0Building Blocks series<\/a><\/i><\/span><\/i>, which provides comprehensive guides on common features of web and mobile apps. We’ve explored\u00a0chat<\/a><\/span>,\u00a0payments<\/a><\/span>, and\u00a0native advertising<\/a><\/span>. Now we\u2019re tackling the strategy and functionality of activity streams.<\/i><\/p>\n

The functionality of newsfeeds (a.k.a. activity streams) is perfect for passive scrollers, i.e. nearly\u00a0all\u00a0smartphone users and many web users.<\/p>\n

With an activity stream in your app, you can prioritize the newest and\/or most relevant information to the top of users\u2019 feeds, so they don\u2019t have to make many decisions. They inherently understand how it works, no matter what the platform or device.<\/p>\n

With each visit to a feed-based app, users are guaranteed new posts, and it keeps them coming back over and over<\/a> again. They can\u2019t help but wonder \u201cWhat have I missed?\u201d (When building an app, <\/span>FOMO<\/span><\/a> can be your best friend.)<\/span><\/p>\n

Whether it\u2019s breaking news or instant pictures, activity streams have gone far beyond the world of social apps. By exploring\u00a0the full scope of what\u2019s possible, we’re uncovering\u00a0all the perks of feed functionality.<\/p>\n

Outline<\/h2>\n

Our goal was to make this guide\u00a0comprehensive. Unfortunately that means it can be a little challenging to navigate.<\/p>\n

To make the guide more reader-friendly, here is an outline of the various sections. You can jump to a specific spot\u00a0simply by clicking the link below.<\/p>\n

    \n
  1. 4 Ways to Organize Your App’s Activity Stream<\/a>\n
      \n
    1. By Date and Time (Twitter, Instagram)<\/a><\/li>\n
    2. By Location (Google Now, Spayce)<\/a><\/li>\n
    3. By Social Relevance (Facebook, Reddit, Product Hunt)<\/a><\/li>\n
    4. By Topic (Circa, Spotify)<\/a><\/li>\n<\/ol>\n<\/li>\n
    5. Design Details<\/a> (which explains various design elements to keep in mind when designing your activity stream)\n
        \n
      1. Why Are You Showing This Post?<\/a><\/li>\n
      2. Discovery = Engagement<\/a><\/li>\n
      3. Offer Some Options<\/a><\/li>\n
      4. Keep It Clean<\/a><\/li>\n
      5. One-Tap Actions<\/a><\/li>\n
      6. Think About Your Refresh<\/a><\/li>\n<\/ol>\n<\/li>\n
      7. Services That Can\u00a0Help You Create Your Activity Stream<\/a> (don’t waste resources by reinventing the wheel)\n
          \n
        1. Stream<\/a><\/li>\n
        2. AppBoy<\/a><\/li>\n
        3. Gigya<\/a><\/li>\n<\/ol>\n<\/li>\n
        4. Concluding Thoughts<\/a><\/li>\n<\/ol>\n

          <\/a>4 Ways to Organize Your App’s\u00a0Activity Stream<\/h2>\n

          What you show your user first is essentially your entire justification of adding an activity stream\u00a0to your web or mobile app. It\u2019s the feeling of relevance that trumps all when it comes to your user having an intuitive, immersive experience in their feed. <\/span><\/p>\n

          You can prioritize and curate based on all kinds of factors (as described in\u00a0<\/span>this hefty post by Melody Kramer<\/span><\/a>). <\/span><\/p>\n

          Here are some of the most common approaches to activity streams and the pros and cons of each.<\/strong><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>1. By Date and Time (Twitter, Instagram)<\/h2>\n

          This is the classic timeline, with the most recent information at the top and (probably) an endless scroll into the past. <\/span><\/p>\n

          Pros<\/h3>\n

          Time-based filtering is great for in-the-moment relevance. When following a major event on Twitter, for example, users are able to track breaking news as it unfolds or the latest Apple event<\/a> as it\u2019s live tweeted. <\/span><\/p>\n

          It\u2019s a way to make users feel\u00a0like they\u2019re not only up to date, but closer to the action.<\/span><\/p>\n

          Cons<\/h3>\n

          What if users are not in the moment? Imagine them coming back from morning meetings to find thousands of #AppleEvent<\/a> tweets stacked up, leaving them\u00a0feeling totally left out. <\/span><\/p>\n

          Twitter helped alleviate FOMO fears by adding the “<\/span>While you were away<\/a>” function this year<\/span>. <\/span><\/p>\n

          When a user hasn\u2019t checked Twitter in awhile, an algorithm bumps the most important things to the top under the headline \u201cWhile you were away.\u201d This type of functionality may be worth considering if you have a time-based feed.<\/span><\/p>\n

          \"Activity<\/a><\/span><\/p>\n

          <\/a>2. By Location (Google Now, Spayce)<\/h2>\n

          One of the best features of Google Now<\/a> is its location functionality. <\/span><\/p>\n

          If you\u2019re not familiar, Google Now is an Android launcher\u00a0that features a feed of cards related to you: weather, sports, calendar, etc. Where it gets really intuitive (some might call it creepy) is when you\u2019re near a movie theater or shopping center, it will give you details on those locations: upcoming showtimes, store hours, etc. <\/span><\/p>\n

          Spayce<\/span><\/a> is another location-based feed, but of a more social nature. You can view and engage with people<\/a> who are around you to discover new people and places in a way that has nothing to do with who you know, but instead just where you are. <\/span><\/p>\n

          Pros<\/h3>\n

          A location-based feed is a way for your user to feel totally immersed in where they are at the moment. <\/span><\/p>\n

          Whether they\u2019re getting information from other people or your algorithm, you can enhance a place they\u2019re in physically with digital components.<\/span><\/p>\n

          Cons<\/h3>\n

          It needs to work. This seems obvious, but for a location-based app to come in handy it has to be helpful and engaging right when (and where) users\u00a0need it. <\/span><\/p>\n

          If you have a social location app, this engagement rests mostly with the community. If you\u2019re using an algorithm, this means deciding what about the user’s\u00a0current location requires further engagement.<\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>3. By Social Relevance (Facebook, Reddit, Product Hunt)<\/h2>\n

          While Facebook\u2019s feed is somewhat based on time, much of it is fueled by users\u2019 friends and what they like and interact with the most. The same goes for Reddit, with posts getting bumped up in the feed as they receive more thumbs up. <\/span><\/p>\n

          In the case of social platforms, this kind of popularity contest can be great\u00a0for user relevance. <\/span><\/p>\n

          Pros<\/h3>\n

          Since you\u2019re past the days of picking your friends based on who you sit next to in class, chances are you have something in common with them. So, you\u2019ll enjoy at least some of what they like, post, and comment on. <\/span><\/p>\n

          Even when polling a vast majority, upvotes save your users the time it takes to find what everyone is talking about on sites like Product Hunt<\/a> and Reddit<\/a>.<\/span><\/p>\n

          Cons<\/h3>\n

          The downfall comes when users don\u2019t actually like what their friends like. <\/span><\/p>\n

          For apps like Facebook, this can leave them with a feed littered with popular shares that have nothing to do with their specific interests. <\/span><\/p>\n

          In the case of apps like Product Hunt and Reddit, there\u2019s a chance that something good slips through the cracks on account of a post having bad timing and not getting the likes it needs to be seen.<\/span><\/p>\n

          \"Activity<\/a><\/span><\/p>\n

          <\/a>4. By Topic (Circa, Spotify)<\/h2>\n

          This is an approach to activity streams that still has a lot of untapped potential. <\/span><\/p>\n

          Circa<\/a> was a news app that ran for three years and showed users the full thread of every news story. (Unfortunately, it\u2019s <\/span>no longer operational<\/span><\/a>.) <\/span><\/p>\n

          For example, if there was a story posted on the Syrian refugees today, when you clicked on it, it would give you tidbits on previous stories in an entire thread tracking the media\u2019s coverage of the Syrian conflict over time. They shared news stories\u00a0in a way that was easy to digest and respected their medium. <\/span><\/p>\n

          The only feature close to this one might be a \u201cYou May Like\u201d or \u201cBecause You Liked\u2026\u201d feed in apps like Spotify. The app is predicting that a user’s interest in one thing might imply that they\u2019re interested in something similar. <\/span><\/p>\n

          Pros<\/h3>\n

          In the case of Circa, users were able to harness\u00a0this feature to trace a topic back in time and uncover some previously unknown\u00a0and interesting content. Newer isn\u2019t always better when trying to provide context. <\/span><\/p>\n

          For predictive suggestions, you\u2019re showing your user some extra love and attention by giving them more of what you know they enjoy.<\/span><\/p>\n

          Cons<\/h3>\n

          Sometimes people know what they want and like, and they don\u2019t want you telling them or trying to guess what comes next\u00a0\u2014 l<\/span>ike when Pandora plays Jason Mraz on your Sufjan Stevens station.<\/span><\/p>\n

          You don\u2019t want to throw your users into a \u201cWTF\u201d rage, when all they wanted was what they came for (in this case, a feeling of contemplative melancholy).<\/span><\/p>\n

          <\/a>Design Details<\/h2>\n

          The feed should be seamless for your user \u2014 not too flashy, with little to no options. <\/span><\/p>\n

          But, on the backend, you have some important decisions to make.<\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Why this post?<\/h3>\n

          At times, it will be\u00a0important to explain to your user why you\u2019re showing them a certain post in their feed. <\/span><\/p>\n

          For example, when you see an unfamiliar face in your Twitter feed, chances are it\u2019s a retweet (or promoted tweet<\/a>). You need only glance at the top of the tweet to see that someone you know has reposted it.<\/span><\/p>\n

          This small UI addition lets your user know that everything they\u2019re seeing is intentional and selected by your system or by their own choosing. This is\u00a0a detail that\u2019s important beyond social platforms.<\/p>\n

          For example, in addition to cards based on location, Google Now also offers cards with recent posts based on topics you\u2019ve searched for or read about. (Yes, I\u2019ve shown an interest in Donald Trump, but I ask you \u2014 who hasn\u2019t?)<\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Discovery = Engagement<\/h3>\n

          With one of Instagram\u2019s most recent updates, they revamped their \u201cExplore\u201d feature, changing it to \u201cDiscover.\u201d Instead of just showing the posts your friends are giving hearts, it shows you trending tags and curated content\u00a0from their global user base. <\/span><\/p>\n

          A feature like this can add an extra dimension to a feed that\u2019s feeling a little flat. It encourages your user to follow new people, stories, or topics \u2014 whatever is relevant to your app. <\/span><\/p>\n

          And most of all, it keeps them engaged.\u00a0<\/span>Newsfeed engagement is based strongly on your user being able to see something new at the top of your app every time they visit it.\u00a0<\/span><\/p>\n

          By finding global trends and curating their own stories, Instagram gives all users a shared thread and a view into something they\u2019ve never seen before. If you can convince your user to view\/follow\/like a new person or thread, they\u2019ll expand their scope of what\u2019s possible within your app. <\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Offer Some Options<\/h3>\n

          Once\u00a0you\u2019ve got your footing<\/a> in the feed world, it may be time to go horizontal. <\/span><\/p>\n

          Offering your users additional, pre-determined feeds based on different filters is a clever approach to prolong engagement in a way that\u2019s more guided than Instagram\u2019s Discover feature. <\/span><\/p>\n

          For example, the Etsy app lets you swipe right for feeds showing goods they recommend, you\u2019ve liked, or that are nearby. They\u2019re taking advantage of several filtering options as it makes sense for the needs of their users. <\/span><\/p>\n

          Pro-tip: Etsy\u2019s addition of the \u201cLocal\u201d feed also endorses their mission to support local artisans. Weave your mission<\/a> into your functionality wherever possible.<\/strong><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Keep It Clean<\/h3>\n

          Especially if you have a shopping app. Nothing can muddy up the simplicity of feed UX quite like visual clutter. <\/span><\/p>\n

          That\u2019s why Keep<\/a>\u2019s shopping app is so addictive. There are no prices or brand names in the main feed \u2014 it\u2019s just pretty pictures, which works well for a shopping app. <\/span><\/p>\n

          With Instagram, they\u2019ve cut down on clutter by limiting the number of comments you see by default. This is good or else our entire feeds would probably just be\u00a0Beyonc\u00e9 comments. <\/span><\/p>\n

          Think carefully about what your users need to see in their scroll and what information to withhold, making it worth their while to tap to see more.<\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>One-Tap Actions<\/h3>\n

          Obviously with apps like Instagram, Twitter, and Facebook, you can \u201clike\u201d right from your feed. This begs the question: which one-tap actions are important for your app’s activity stream?\u00a0<\/span><\/p>\n

          QuizUp<\/a> is a social quiz game. In the app, a user’s home feed is\u00a0based on their\u00a0chosen interests\u00a0<\/span>\u2014\u00a0anything from neuroscience to Disney movies.\u00a0A user can like or comment on people\u2019s posts and\u00a0also play a round based on that topic with one tap from their\u00a0feed.<\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Think About Your Refresh<\/h3>\n

          It\u2019s a small detail, but people are used to the mobile functionality of dragging down to refresh a feed. What animation in your app will show users that the page is, in fact, refreshing? <\/span><\/p>\n

          Google Now employs a spinning, color-changing circle\u00a0at the top of the page when in the process of refreshing. Twitter\u2019s approach is less quirky, with a simple tweet-height space housing\u00a0a spinning wheel next to the word\u00a0\u201cLoading.\u201d<\/span><\/p>\n

          Whether you go quirky or practical, pick an animation that reassures\u00a0your user that the refresh is underway.<\/span><\/p>\n

          <\/a>Building an Activity Stream or Newsfeed into Your App<\/h2>\n

          Once you’ve picked a feed strategy that works for your app, you don’t need to go hire a new team to build it.<\/p>\n

          The rising popularity of this app functionality means that there are services out there to help you build your own activity stream, even without a full development\u00a0team in-house.<\/p>\n

          In this post, we’ll explore three of those services:\u00a0Stream,<\/a>\u00a0<\/span>AppBoy<\/span><\/a>, and\u00a0Gigya<\/span><\/a>. Here is\u00a0a brief comparison of their features and pricing, with additional details about each service below.<\/p>\n

          \"Activity<\/a><\/p>\n

          <\/a>Stream: Feed CRM<\/h2>\n

          Stream<\/span><\/a> provides the ability to build a scalable newsfeed directly into your web or mobile app with little to no effort.\u00a0<\/span><\/p>\n

          That is, with just a few lines of code, developers are able to implement Instagram or Facebook-like feeds that would normally take weeks or even months to develop from scratch.<\/span><\/p>\n

          \"Activity<\/a><\/p>\n

          Stream\u00a0provides<\/span>\u00a0four different types of feeds that founders or product managers\u00a0can add to their web or mobile app:<\/span><\/p>\n