Reddit: Designing a Profile Content Showcase for Reddit Creators

2018 • USER RESEARCH • UX • UI • PRODUCT DESIGN

 
Profile-Showcase-Header.png
 

PROJECT OVERVIEW

About the Project

Reddit, best known for being the “Front Page of the Internet,” is a go-to online platform for communities, conversations and connection — and of course, all done through anonymity (if so you choose). Reddit has over 330 million monthly unique visitors, 18+ billion views per month and nearly 150,000 active communities.

Reddit launched its first full redesign in early 2018, including a user profiles experience. And this, my friends, is where our story begins.

The Problem

Reddit has a niche group of users that we refer to as original content creators (i.e. gamers, writers, artists, photographers, and so forth). However, when the user profiles were first launched, users had limited ways to showcasing their proudest posts or content, and couldn’t really express themselves in their profiles.

The overarching goals of this project is to: (1) Help creators better showcase their work directly on their user profile; (2) Simplify the profile viewing experience by removing multiple views (based on user needs); and, (3) Increase profile usage.

 

Results & Solutions

  • Profile (showcase) pinning increased by roughly 25% within the first month of launch

  • Designed a profile showcase widget at the top of each user profile for creators to pin their best content

  • Designed “showcase units,” that are not only being used on user profiles, but also across the platform for products such as Search and Discovery on desktop

Role

Owned the entirety of the project as the main Product Designer of the project, with some guidance from a Lead Designer (Lauren), and working with a PM and a team of engineers.


 
 

THE DESIGN PROCESS

While this doesn’t fully align with my go-to design process, I implemented a particularly specific design process for this project. Typically, there are tweaks between Ideation, Validation and Prototype — however, in this case, we were limited in user research and timing resources. Sit tight, I’ll dive further in in just a bit.

profiles-process.png

 
 

I. Discovery

Competitive Analysis
User Research + Synthesis

 

COMPETITIVE ANALYSIS

Despite the fact that Reddit is not technically a social media platform, I made sure to analyze various social media platforms that included products which contained a self-curated “featured” section. For example — Facebook Featured Photos, LinkedIn Media, Pinterest and, strangely enough, Twitter Analytics.

Competitive Analysis.png

However, I discovered that with the many post types that Reddit allows for (ranging from photos, GIFs and videos to title-only and fully bodied text posts), the showcase units must be designed to be scalable across the entirety of the Reddit product and also be applicable for all of such posts.

USER RESEARCH + SYNTHESIS

Considering the fact that many of our coworkers were hardcore Redditors, Lauren (Lead Product Designer) and I went around and conducted user interviews with folks in the office. We spoke with 7 people in total, and learned that the majority of them had similar habits when it came to how they interacted with their user profiles. All 7 interviewees were familiar with the major content creators on the platform (i.e. u/spez, u/kn0thing and u/Shitty_Watercolour). Overall, they recognized that the current profiles experience was lacking.

Here were my four major takeways:

pin@2x.png

The pinning experience is limiting as users are only limited to two pins.

trophy@2x.png

One of the first things users look for on their portfolios are the number of trophies they have.

karma@2x.png

Users are concerned with their vanity metrics (i.e. karma points).

profiles@2x.png

Hardcore Redditors frequently check and update their profiles (pinning), and lurkers frequent the profiles of famous Redditors.

Funny enough, a feature request was posted just in time on r/redesign regarding the exact problem we were working on solving!

 
 
 

II. Define

Job Stories
Core Features
Showcase User Flows

 
 

JOB STORIES

With the combined in-person user research + synthesis, as well as research on the posts, behaviors and profiles of the major content creators on Reddit (i.e. u/GallowBoob, u/Shitty_Watercolour and active Reddit gamers) — I created four specific job stories that are real life representations of these types of users and the “lurkers” of Reddit. Thereby, defining the core needs and features necessary.

SITUATIONMOTIVATION OUTCOME

Content Creators

When I finish creating a funny meme, I want to showcase it on my profile, so that I can get more recognition on Reddit and karma points.
When I win a video game that I just streamed, I want to pin it to my profile, so that people can see that I’m a gamer they should follow.
When I need more money for making art online, I want to my followers to donate to my Patreon, so that I can continue living off of my creations.

Lurkers

When I am bored and browsing for interesting original content on Reddit, I don't want to actively take action with the content I find, so that I can continue consuming good content with anonymity.

Defining necessary core features

Taking from the previous parts of the design process, I knew the new profile design had to more clearly emphasize the content showcase — ensuring that users had a smooth and simple experience when pinning and unpinning to their profiles, as well as vanity metrics, which included a redesign of the existing trophy case.

profiles-features.png

To be frank, this part coincided with (III. Ideation) as my mind began running at the speed of light to come up with blue sky ideas for what the user profile could look like in the future.

SHOWCASE USER FLOWS

With this particular project, we focused mainly on the UI of the new profile showcase first, then decided to work backwards in order to consider the empty state and onboarding/education process for pinning.

Pinning and Unpinning Consolidated Flow

 
 
 
 

III. Ideation

Blue Sky Sketches
Blue Sky Explorations

 

BLUE SKY SKETCHES

first-sketches-profiles.png

BLUE SKY EXPLORATIONS

In the office, I referred to these as the “Buckwild Profiles” — as you can probably see why. Beyond the overall new profile layout, I also made countless explorations on the trophy case as well as how different types of content could fit into Reddit’s (what we call) “structured styles” with particular content creator types in mind.

Trophy Case Explorations

And, the “Buckwild Profile” blue sky dreaming continues…

Keep in mind, that with all the explorations, we had weekly (sometimes even twice a week) critiques in which all designers, PMs, engineers and stakeholders were invited to join.


IV. Validation

Design Critiques
”Walk the Wall”
Collaborating with Engineering

 

DESIGN CRITIQUES

We held weekly (sometimes even twice a week) critiques in which all designers, PMs, engineers and stakeholders were invited to join. Eventually (as in many design critiques later), we ended up with a user profile that aligned closely with the original design, but included the new profile (pinning) showcase feature and a new trophy case.

Also, apologies — but we weren’t allowed to take photos during our critiques as these were private meetings on brand new Reddit products.

“WALK THE WALL”

In seek of more feedback from designers, I showcased the explorations by pinning large printouts of the various explorations on the walls of our “Design Clubhouse” room.

Apologies again — photos weren’t allowed to be taken.

COLLABORATING WITH ENGINEERS

Furthermore, I frequently met, both casually and through meetings, with engineers on the team to discuss development constraints. We were met with many engineering constraints — which included: (1) A drag-and-drop option to rearrange pins, (2) Increasing the pinning limit, (3) Showcasing comments, and (3) Having to retain the original pinning and unpinning interactions (via each post’s overflow menu). However, these are currently in the product plans for the future.


V. Prototype

Hi-Fidelity Unit Mocks
Hi-Fidelity Mocks
Future Visioning
Invision Prototyping

 

FINAL SHOWCASE UNIT MOCKS

Showcase Units for Each Post Type on Reddit

profile-post-types.png

FINAL HI-FIDELITY MOCKS

The New User Profile Showcase

full-showcase@2x.png

Profile Showcase Education Unit (Empty State)

on-boarding@2x.png

Profile Showcase with Three Pinned Posts

profile-unpinned@2x.png

And, for reference, here was the original profiles design.

old-profiles-resized.png

FUTURE VISIONING

future-profiles.png

Hopefully, the future of Reddit’s user profiles will include drag-and-drop rearrangement of showcase units and the ability to pin comments to the showcase. Above are just some examples of designs I’ve explored.

INVISION PROTOTYPING

Note that all the content in the prototype belongs to u/Shitty_Watercolour — one of Reddit’s most famous content creators.


VI. Delivery

Redlining + Handoff

 

REDLINING + HANDOFF

At Reddit, our redlining is done (almost quite literally) by hand.

Screen Shot 2019-01-03 at 11.22.13 AM.png

And some time in-between creating the specs and the official engineering hand-off, I made sure to meet with the PM and engineers to demonstrate the working prototype and the necessary design interactions and functionality.


LEARNINGS + REFLECTIONS

Beware, this is a lengthy one as this was actually my first project at Reddit.

The project was already in the pipeline before I joined, but all I was told when it was first assigned to me was simply and quite literally — “Redesign the Reddit user profile for content creators!” At the beginning — there was no spec and no real direction. However, thanks to the guidance of and constant feedback from a Lead Designer on the team as well as mentorship from the Head of Design, I was able to utilize my design process in a start-up setting to truly bring this project to life (or shipment). In addition, working on this project was the first time I got to experience true design critiques, with stakeholders and all in the room, and “bug bashes” (once the designs were developed) with engineers for QA.

We ran into a lot of engineering troubles as constraints came to light nearing the end of the project, requiring quick fixes and sacrifices to be made in order for development to be complete. However, things worked out in the end. Since this project was launched, much of these constraints have been lifted. For example — you can now pin multiple showcase units to your profile (“Overview view”)! Hopefully the drag-and-drop feature will be next in line for production.

There are many things that could’ve expedited the design and development of this project, but ultimately, things happen that are out your control. At the end of the day, I’m incredibly proud of the results and I hope Reddit continues to iterate on their user profiles experience.

Thanks for reading (or skimming), and I hope that if you’re a Redditor, this project has helped to make your user profile feel like something that you truly own.

— M.