TEAM & CONTRIBUTORS
Head of Design: Dan Carlberg
Designer: Jayne Lee
Bloglovin’ users had no convenient way to organize the content they liked, which made it difficult when users wanted to find something specific among all the content that had saved. Secondary to this, Bloglovin’ users lacked a way to define a sense of identity within the platform, outside of a short written description.
Business Need: Increase user retention and engagement metrics
Allow users the ability to organize the content they had saved into groups of their choosing and provide some semblance of defining a personal identity within the platform
Bloglovin’s audience was pretty vocal, which became beneficial for the product team. We knew immediate reactions once we released a feature or bug fix. When we asked our audience what they'd like to see or have us improve, the collections feature was one of the most frequently requested.
The primary actions a Bloglovin’ user can perform on the platform were to save a post or to follow a blog. All Bloglovin’ users had a profile, which displayed all of their posts they had saved. With the limited amount of actions, it was difficult for a user to distinguish or define their profile solely based on the types of posts they had saved and when.
Most of the Bloglovin' user base were bloggers themselves, who've spent a lot of time defining and crafting their digital persona. We wanted to give some more control to the user with the ability to curate their profile, by organizing and creating collections.
A user can create a collection directly from their profile or when they are saving a post, from anywhere on the platform. We saw that it was more intuitive for someone to want to create a new collection only after deciding that they wanted to save a new post. It was less common for a user to know that they wanted to create a collection before finding posts they wanted to save. This is inline with the way we usually think about grouping items, most of the time we don't know how to categorize items until we know what the items are.
When a user saves a post, a modal appears requiring that they select the collection where the post will be saved. Additionally, the user can create a new collection directly from the modal. Selecting the new collection button, changes the modal to display a form the user must fill out with the details of their new collection. Once the new collection has been successfully created, the post has now been saved to the newly created collection.
When a new collection has been successfully created or a post has been saved to a collection, the user receives a visual notification on screen, communicating that the [post] has been saved to [collection] or that [new collection name] has been created. The user can continue browsing and reading more posts, while confidently knowing that their post or new collection has been saved.
If a user decided to create a new collection from their profile, they would select the create new collection button from the collections page.
The placement and obtrusive design of the new collection button was intentionally designed to motivate users to create more beautiful collections, in hopes of offsetting the stark quality of the button.
To edit an existing collection (change the collection name, change the description, change the category, or delete), a user has to go to their collections overview page or navigate to the specific collection's detail page. The form to edit their collection details is the same form displayed when creating a new collection, but now with previously input information. This decision was made to prevent additional cognitive overload on the user, as this is a form they're familiar with and to additionally prevent unnecessary development work.
A user can view other users’ collections by navigating to the user’s profile. Additionally, every collection detail page displays the name (and link) of the collection creator.
We had to equally account for brand new users and existing users and what their profiles would look like on Day 0, once we released collections. For existing users, we decided to put all of their already saved posts into the default “Saved” collections. This nodded to the legacy behavior that these users were accustomed to and bridge the gap with the new system. For brand new users, everything is already new for them and they're not familiar with the legacy behavior, but they would start with the same default collection, to loosely communicate that when they save posts, they must be within a collection.
On iOS, we utilized the majority of the same thinking we did for web, but made sure the designs and interaction patterns were native to the mobile experience. Because of the lack of real estate on mobile, we only display the collection name and collection photo, determined by the first post saved to the collection.
Generally when a new larger feature has been introduced, there is a drastic change in metrics because it's potentially a big change that can overwhelm users and perhaps require a steeper learning curve. If the feature successfully improves the experience, the numbers will come back up and stabilize, hopefully increasing gradually. We were very cautious of distrupting our retention metrics, so we decided on an initial soft release with no promotion to gain insight from the few users who happened upon the new feature. After we received positive feedback from the soft release, we sent out a promotional email to introduce and promote the new feature.
During my time at Bloglovin', this feature successfully increased our user retention and engagement metrics. Our audience was excited to finally have a way to organize their posts. The collections feature still exists on the platform with some slight improvements, made after my time.
Our audience preferred beautiful images over witty titles, so we ommitted the post titles when viewing a collection overview page.
We were aware that this idea was lacking innovation, but we consciously chose to build a feature that would minimally impact and improve the experience. We preferred iteration over big redesigns. We wanted to introduce a slight improvement to a behavior that our audience was already familiar with, which also allows them to begin to define their presence within Bloglovin'.
Comps/Components for Web, iOS:
Promotional Email & Graphics