Facebook is confidently on its way to becoming the most widely used product in history. People spend more and more time on the platform and, in certain countries, it's indistinguishable from “the Internet.” However, Facebook's users are reluctant to share their everyday moments with their friends. They rarely share content and when they do, they share a highly curated version of themselves, making the platform a "success theatre" where only the most important moments in their lives are worthy of sharing. Why? After diving into years of research knowledge and data we came up with three problem hypotheses:
- The size of their audience
- A perceived quality bar for content
- Fear of spamming their friends
We saw this as an opportunity to unlock a new type of sharing on Facebook. So, in 2015, a lot of teams around the company organized to find a solution.
Introducing Multi-Post Stories
One thing we heard time and time again is that people thought any given moment wasn't "high quality enough" to be shared on Facebook. Multi-Post Stories is a sharing feature to easily add to a previously shared story over the course of a day. It was one of Facebook's first truly mobile-first production features; built for a world in which you walk around with an Internet-connected camera, creating and sharing media throughout your day. Multi-Post Stories lets you do this without over-sharing. Moments that are typically not able to stand on their own suddenly become shareable when attached to a larger story.
This product was a big endeavor from a design perspective. It involved introducing a fundamental shift in how people perceive sharing on Facebook. I was in charge of the ideation as well as design for consumption and production experiences for web, iOS, and Android.
Adding To A Story
Introducing this new sharing behavior int into the existing system without disrupting Facebook's 1.5 billion active users wasn't an easy task. We landed on a couple of entry points: One at the bottom of your own posts and another inside the Composer itself. Tapping the "Add To This Story" button opened a special composer view, which contains a small preview of the last post in the story. Adding the post preview helped differentiate between creating a brand new story versus adding to an existing one. It also gave users a sense of momentum as they added new posts.
Tagging Friends
Perhaps the most scalable feature was the ability to seamlessly create collaborative stories by utilizing one of Facebook's most used behaviors: tagging. Tagging a friend in a post gave them access to contribute to that story. This created a nice back-and-forth between authors as they craft their story, one post at a time.
Consumption
The News Feed consumption experience for these stories was pivotal in achieving our primary goal: to allow users to share multiple times a day without the feeling of over-sharing. Typically, if someone shares three posts within a day, they would be scattered throughout their friends' News Feed. This clutters their feeds and prevents the content producer from crafting a coherent narrative. In order to eliminate interruptive posts and ensure the content is consumed in chronological order, we decided to aggregate all posts in a story as part of the same "container" by aligning them side by side within News Feed.
However, this presented a unique challange: a post's height on Facebook can be anywhere from 248pt to 700pt, depending on its content. This introduced a major design challenge: in order to align every post side by side, they must share the same height. I designed a system to render all post types on Facebook as a square card, which we lovingly nicknamed "Chiclets."
A text post can contain anywhere from one to hundreds of characters. It was quite challenging to come up with a design that would make a couple words stand side-by-side with a few paragraphs. I designed a system that changes the alignment and size of the text depending on the character count while sticking to a 12pt baseline grid. As a result, we saw a significant increase in text posts inside Multi-Post Stories.
When posting a link on Facebook, a handy attachment is pulled from the web that previews the content, as do Chiclets. Including a location, web link, or referencing a Facebook Page will attach a preview of the item to the chiclet.
Photos look really beautiful inside a chiclet. Instead of treating photos as an attachment to a post, I decided to push them edge-to-edge and let the content shine. If someone uploads multiple photos at once, it extends the width of the chiclet and automatically creates a collage of your photos. We use face recognition to center the photos and feature the ones that contain friends or have an added caption.
One of Facebook's most underserved features is the ability to add structured data to posts. It lets the system speak for you and it pulls relevant content from Facebook entities like Pages to enrich your story. I saw this as an opportunity to introduce playfulness into the product. So, I leveraged the existing iconography and content from Facebook entities and placed them inside the chiclet, bringing them to life and adding a touch of personality to the content.
News Feed View
As content is added to a story, it's aggregated horizontally in a beautiful, free-scrolling collage. This layout scrolls to the latest unseen piece of content and it shows a peek of the rest of the content in the story. We found that people engage with this collage much more than the static one. It also provides an extensible framework that allows people to share a lot without spamming their friends. While scrolling through the collage, a subtle parallax effect hints that there is more to see behind the photos.
Container View
Tapping on any chiclet navigates you into a view dedicated to the container. Here one sees a full view of the entire story, where the photos preserve their full aspect ratio and the text is never truncated. When scrolling to the top, the container header expands to show all authors in the story. The container view is also where the user can see all comments and feedback received on the story.
So, what happened?
Multi-Post Stories launched in Italy and was really well received. It increased content production on sharing as we set out to do and had other unexpected side effects like an increase in text posts in particular. Ultimately, Multi-Post Stories was sunsetted to focus on what eventually became Instagram Stories. I wrote more about that here.
Creating Multi-Post Stories was equal parts rewarding and challenging. Learning how to navigate a large company to introduce a robust framework to easily support horizontal aggregation of all post types within Facebook was no small task. Perhaps most rewarding of all, witnessing millions of people use a product that taps into their desire to share stories and rethink their understanding of sharing on Facebook was nothing short of inspiring.