Make space for Tumblr communities to connect over what they love

Background

In 2017, Tumblr’s design team led by Doug Richards spent time giving the brand a facelift—culminating in a new comprehensive brand guidelines. However the product had remained fairly stagnant, often met with user feedback about the lack of upkeep and innovation.

Our goal

Begin injecting the new brand into the product. Reintroduce Tumblr to existing audiences without alienating them. Introduce Tumblr to new audiences with a more focused strategy. Pretend scope doesn’t matter and imagine anything is possible.

RESEARCH

A Yahoo UXR team spent 12 weeks working closely with our users doing in-person and online user testing, surveys, on topics around online identities, fandoms, and community behaviors both on and off of Tumblr.

GUIDING PRINCIPLES

The product team along with business stakeholders translated the core findings from the research into guiding principles. These principles were then translated into tangible experiences.

① Help new and existing users find their communities.
② Make joining the conversation easier.
③ Convert people from passive lurkers to engaged contributors.
④ Evolve the platform without alienating the communities.
⑤ Improve the content creation experience

IDENTITIES

We knew Tumblr users were creating multiple blogs usually focused on different topics or even having different personas so we focused on the idea of identities as a way for users to switch contexts.

The goal was to let users separate work from play, politics from personal, or family from friends without requiring the hard context switch which existed in the current platform.

You could easily switch and create identities at any time by tapping your avatar. The topics you follow would all be a part of your identity. This would also showcase your settings, profile info, and everything else that was encapsulated by that identity.

TOPICS & POSTS

Our users found the dashboard experience on the existing Tumblr app was a confusing feed of disparate topics as blogs they followed appeared in a single feed regardless of selected identity. We hoped that organizing content around interests even within identities would provide a way for users to more actively interact with their communities in a more direct way.

The "All" section of the dashboard was defined by the people and topics you follow within an identity. Other topics created discrete spaces for a user to explore their content.

We wanted to make posts more expressive, engaging, and immersive while leading to users to conversations. Like Tumblr’s foundational reblog, this would allow users to interact with each other’s content and generate new posts iteratively. We also considered how this would make shareable content more identifiable off of the platform.

We made it easy to expand your interests by interacting with related topics, users, and groups in an effort to keep users from being isolated and promote exploration within the feeds.

We knew that our users conversations primarily started from interacting with other users in post replies, but those conversations and connections were easily lost due to confusing conversational UI that mixed replies with reblog comments.

We looked at a way for comments to springboard into conversations through groups. Tapping on an individual post goes to a detail view, with comments and reblog chains below which look more like conversations.

As conversations started to build, group creation was promoted.

GROUPS

We felt that groups would help meet the need of communities looking to find and engage with each other. These would be places for users to talk with anyone interested in a topic publicly or even privately with friends. They shared visual components with post comments/replies and messages, making the experience more conversational.

Prototype & Testing

We partnered with engineers in house and created a prototype using React, finessing things like interactions, transitions and animation velocities.

The prototype covered all the work we had done around topics, identities, comments, and groups. We even went further into testing group creation and monitoring group activity.

The idea of identities made sense to users, but some didn’t seem interested in creating more than one if they could separate their single identity into multiple topics. Users rallied around the idea of groups and spoke to integrating the idea of communities in the product in a more aggressive way.

At this point new leadership at the company wanted to see changes happen more quickly in the platform. So we took a step back and started talking about how we would highlight communities more in the product without doing a complete product overhaul.

OUR HYPOTHESIS

Adapting existing replies and messaging structure to groups would be the best way to integrate this work into the existing product. We could circulate users into groups through the dashboard and discovery pages based on their interests.

flows & wires

I began to think about the lifecycle of communication—how messages, group messages, and groups, could all live together in a single inbox and evolve into one another. I also wanted to experiment with things like ephemerality and theming.

My thought was this should all take place in a single inbox since the intent was to drive conversations it didn’t make sense to separate those experiences.

I worked through many iterations to solve for an inbox with various message types and a single point of creation for any of those formats. I created simple flows to test the experience using Sketch Preview, and later in Invision with users.

With some further testing around the inbox creation entry point and a better understanding that users don’t want to front-load their experience with customization, we adapted the flows/designs and began creating message components and a design language built around a variety of customizations and media types.

MESSAGE COMPONENTS

I started to explore how the new brand guidelines could impact the group experience. This work considered how components interacted with each other in a thread, how users and groups could be themed, and how we display rich media (gifs, images, videos, links, etc.) in messages.

LAUNCH

I left in June of 2018 and joined The Infatuation just before public launch. After I left, a new product designer took my work through the final stages of dev support and launch with what you see below.