Instagram Leaderboard

May 17, 2021

The Instagram Leaderboard is a feature born out of the need to share a common thread with people all around the world. Our feeds are showing us the same 10 things each time we open the app, but we miss out on all the creativity and content out there in the community. Events like the Tonys, the Emmys, the Grammys, and the Oscars bring people together and provide a neutral topic of discussion for people of all backgrounds and ideologies, and have inspired this feature that would showcase the greatest talent of the community to everyone and allow users to be a part of the selection process.

Role

Sole Designer
(start to finish)
Responsibilities

UX/UI Design
Branding
Timeframe

4 weeks
(20 hr/week)

Competitive Analysis

Virtually all the largest social media platforms have some form of viewing the trending and most popular posts. Snapchat has gamified this process the most by offering a daily monetary reward to creators with the top posts, while creators on TikTok can use the trending hashtags, songs, or effects to have their content be discovered. Facebook, as a platform mainly intended for viewing content from people you know, has the least development towards this kind of feature, followed by Instagram, which has condensed this to viewing popular posts in pre-determined categories
Scroll through to view all competitor apps.

Interviews

Maggie

Maggie is not a heavy social media user. She has recently become much more intentional about her use and only uses social media for 30 minutes every day. Though she likes seeing content from influencers she follows, she admits that she rarely gains anything from this experience as all her content is extremely predictable. She finds targeted ads effective but annoying, and wishes there was some way to edit them, especially when she is getting ads for a product she may have only clicked on once. She wasn’t aware of some of the existing features of Instagram that can help you discover more content, but says that that is something she wishes was more accessible. She recognizes that she is stuck in her own echo chamber and would like to change that.

> "I try not to like mindlessly scroll"
> "I can list you exactly what's going to show up on my blog my Instagram
I would like to be able to see what my algorithm is picking for me and being able to change what my algorithm picks for me"

> "Being able to change what I'm being shown your algorithm, or being able to control a little bit more the content"
> "Like I don't follow hashtags at all. Like I think a lot of people don't know that that's a feature."
> "like once or twice a week having it show up a banner at the top of your Instagram thing saying like, hey, maybe you'll enjoy"
> "why I don't really use Facebook, a lot is just because it's an echo chamber"
> "don't have to necessarily be a celebrity to be successful on TikTok"
> "I would say that Reddit might be the most equitable platform. Also there's a lot of anonymity"
Samuel

Samuel is a big social media guy and is very involved in the music and podcast scene. He uses Instagram, Facebook, snapchat and reddit a lot. He was fascinated by the idea of being able to filter through music under different kinds of hashtags, where you would see the new top posts of every week to help him discover new music. He thinks this kind of system could also work for different kinds of themes and categories. He thinks that engaging users in Instagram polls could be an effective way of handling “voting” for the top songs.

> "music polling like I have a more efficient way for Instagram to specifically target so you can like compare and contrast songs because right now you can attach music to h gram stories"
> "Like I don't care like what type of song it is, but like everyone wants to hear a fire song in the genre they're listening to you know, so if there was a way to filter out shitty songs of weird genres."
> "People should vote on what they believe the best of that genre is and then you can listen to that, you know, rather than having to like, the daunting part of listen to this is you have to peel through so much shit like there's so much bad"
Rebecca

Rebecca has also recently become a less frequent user of social media, though her top app remains Instagram. She finds the content to be very repetitive and therefore boring, and has a hard time digesting the vast amount of posts if she only uses the app occasionally. For her, she would like to have the option of seeing “top posts” that are universal to everyone’s Instagram, regardless of algorithm, as she believes this could break down the information better for her but also allow her to have more connection and conversations with people she may not otherwise have anything in common with. She likes the idea of creating a “Oscars for instagram” where people can self-submit their posts into categories like “most creative” “best effect” “most comedic” and have these videos voted on by the general public.

> "I opened that search bar, it ends up being like very repetitive kind of content. And then, as a result I don't really click on any of that stuff because like why that's like kind of boring."
> "opens the door for Instagram to provide more of a like educational purpose than it does normally."
> "sometimes in the mood to like kind of shake it up"
> "seeing the same top three content and like, maybe that does break down some boundaries between like partisanship"
> "I'm getting more effective information by it being more general than it being personalized, especially if it's a weekly thing because then it's like really across the board I could run into anyone anywhere, And we would have seen the same Instagram content, even though I wasn't on all week maybe they were on all week and I was on for two hours on Friday."
> "And then and then the fact that everyone in my life, regardless of what their views are but if they all use Instagram that we're all going to see that same thing, you know, opens up I think more lines of communication then the constant personalization of social media."
> "like the Oscars or something, You're like you have basically like a new newspaper, and it's an it's comes in the form of like headlines"

Personas and Empathy Maps

Meet Kimbery and Ashton.

In order to make sense of my secondary research and interviews, I created two personas that match the two primary users for this app and its new features.
Click on any of the personas to view larger in PDF.
Kimberly: Young and willing to try new features, likes to connect to people around the world.
Ashton: Frustrated with one-sidedness of social media and looking to find common tongue with friends and clients.

A Day In The Life

I wanted to make sure I understood how my users use the app and help identify opportunities, I interviewed "Emma" who is part of the ideal persona. This helped me empathize with the user more and start thinking about the architecture of the site and eventually transcribe it into the site map.
Click on image to open full task analysis for app.

Feature Roadmap

After my interviews and empathizing with the user I was ready to decide on the specific features that would be needed. From my interviews I learned that users would also like to have more control over their ad settings in Instagram, but ultimately this feature was abandoned as the app already has some built in controls (just well hidden so most people did not know about them).

Sitemap

Before I started building the app, I wanted to create a Sitemap so that I knew exactly what elements would be needed and how I wanted to structure it.
Click on image to view sitemap in PDF

Wireframes

Once I had a clear structure in mind for the app, I was able to start creating my wireframes. The overview and desired flow is pictured below.
Click on image to expand.

UI Design / Prototype

I drew this crown icon to represent the new feature. It had to match the existing UI and scale well.
The crown icon was added as a menu tab to the top nav as its own separate page.
Since part of the reason for this feature was to expose users to new content, a post from the instagram account featuring some of the top posts was added to the feed. This post is also aimed to help users discover and interact with the new feature. This post was stylized much like the instagram ads, but with a more colorful and prominent button urging users to participate in voting.
The crown was also added to the menu of ways to interact with a post. When a user sees a post in their feed that they really like, they can nominate it by pressing the crown and then selecting a nomination category.
Additional buttons I created for the voting feature.
Creating a few animations was an important part of the prototyping process. This is a tutorial for how to vote on posts.

User Testing

The names in contention:
In order to verify my hypotheses on how users will interact with my new feature, I needed to test it. I ran 3 in-person/zoom tests with users, and had 18 people do a remote test. These tests gave me a tremendous amount of insight into users behaviors, and revealed the same thought and usage patterns across most testers.
Task: Go to the leaderboard overview
(Rebecca's test)

During testing a majority of people tried clicking on the profile of the leaderboard to get to the overview. This was not prototyped in. There was also confusion surrounding the difference between the "instagram profile" and the "leaderboard profile" so these were changed in the final version for clarity.

Task: Go to the "Best Original Song" Category
(Rebecca's test)

Most testers had not formed the association between the "crown" icon and the leaderboard yet or did not notice its appearance in the top nav. This led most people to try and get to the category from the voting page. Though this was not intended to be a path there, it was valuable to see users interact with taht button.

Task: Participate in voting on posts
(Ilayda's test)

The vote screen had a short, automatic tutorial programmed in that was intended to show users to use a swiping motion to vote on the posts, but most people used the buttons towards the bottom to complete that task. Some of this is perhaps due to the test being conducted on a computer and a not a smartphone, so that interaction is not obvious, but other users were confused about what the "voting" system actually accomplished. This was made more clear in the final version.
Other insights from user testing:

Final Design

Welcome screen tutorial
Vote Screen tutorial
Category selection
View the Leaderboard highlights in "stories"
Nominate a post
View Leaderboard
Full Prototype
< Back to Case StudiesBack to topNext Project >