Instagram Case Study
Role: UX Designer
People use Instagram to meet new people and connect with those with whom they've lost touch, but Instagram needs a better way to facilitate these potential connections. That's why I designed a discovery swiping feature for Instagram that allows users to swipe on nearby profiles and connect with those around them.
Read through this case study start to finish, or click the headings below to explore different sections.
As you read through this case study, click on images to view them in more detail. If you would like to browse my figma file, you can do so by clicking here.
Introduction
Problem
People often give out their Instagram handles as a contact method. However, sometimes people meet and forget to exchange information. This could result in lost friendships, romances, or even business opportunities. Instagram needs an added discovery feature that helps people re-discover missed connections.
Goal
Develop a proximity-based discovery feature which allows users to swipe on accounts of people they may know or be interested in knowing. In short, create a feature similar to tinder, but for Instagram.
Duration
In total, it took about 80 hours to complete this project. Working approximately 20 hours a week, it took about 4 weeks.
Constraints
The main constraint I faced while working on this project was figuring out how to design a feature within existing UI.
Research
Research
Comparative Analysis
I looked to Tinder, Bumble, and Hinge for design inspiration. Of the three, tinder is by far the most downloaded app with the simplest interface, so I took most of my UI inspiration from there.
My market research revealed that most young people are content to stay single, so I decided to allow for different types of connections. Similar to Bumble's model, I would include Instagram Date, Instagram Friends, and Instagram Business. The user would select whichever mode they wanted in their user settings.
Hinge is perfect for creating long term connections, but it's not intended for casual users. For this reason, I didn't include many of its features. However, I did like that Hinge allows users to select a location anywhere in the world, and set a radius from there. This gives users more freedom to choose where they want to look and who they want to connect with. I made the decision to include this in my design.
User Interviews
I gathered 4 Instagram users in their 20s to talk about their online dating experiences, Instagram experience, and any experiences they had with meeting people through a social media website. 2/4 participants expressed frustration with Instagram's algorithm, and felt that they were suggested random people to follow. Another participant who used Instagram as an art portfolio felt that it was difficult to be discovered, and that they had to "play a game" to be noticed. 3/4 participants said they had met someone online before—one person for business, one made a new friend, and one found a romantic interest through social media.
These findings confirmed my belief that Instagram needed a new way for people to find each other. A discovery swiping feature would make it easier for profiles to be noticed, and for users to find new follows.
Define
Persona
My persona was based on my user interviews, and would help my empathize with their needs during the design process. I kept "Jake" in mind as I decided which elements to include, and which to forgo.
Sitemap
I went through each of Instagram's pages on my phone and thought about how to integrate my feature into the existing interface. Later on, I decided to simplify the process of turning on the feature by giving it its own tab labeled "discovery swipes" under settings. The Discovery Swipes feature would be accessible from two places: the main timeline integrated between posts, and the search page which is already populated by advertisements and suggested posts.
User Flows & Task Flow
I created one user flow to determine how someone would turn on the feature in settings. I wanted to give users the option to turn the feature off for the sake of privacy. This process helped me determine what pages I would need to create and what features I would need to integrate. My second user flow mapped out how a user would access the feature and follow a profile from here.
For my task flows, I outlined the two main ways I saw users accessing the feature: via their discovery page or via their timeline. Now that I knew which pages I would need and how I would link them, I was ready to start wire-framing.
Design
High Fidelity Wireframes
High Fidelity Wireframes and Prototyping
Testing
User Tests
I gathered Instagram users in their 20s to test my feature. My testing objectives read as follows:
-
Determine if/how easily users can access the swipe feature.
-
Determine if/how easily users can manage settings.
-
Determine if/how easily users can get to the “edit profile” page.
-
Record any errors, frustrations, confusions, and successes encountered by the user.
I wrote out the three following scenarios with corresponding tasks for users to follow:
-
You want to enable Instagram’s new discovery swipes feature. How do you proceed?
-
You want to begin swiping on profiles to see if you are interested in connecting with anyone. How do you proceed?
-
You want to access your discovery swipes profile in order to view and edit it. How do you proceed?
Flow Completion Rate: 100%
Error Free Rate: 58%
I attribute most of the errors to limits of the prototype rather than faults of the feature itself.
Affinity Mapping
I used the results of my user tests to create the affinity map shown below.
Revisions
The main issue I thought could and should be solved was the tendency for users to click on the main profile icon in the tab bar to access their discovery swipes profile. I decided to make the discovery profile accessible both within the discovery feature itself, and from Instagram's profile settings. The profile access points are circled below in blue.
Conclusion
What I learned
This project helped me understand what users value in a social media app, and how they might be better served by the apps they choose to frequent. I learned that creating redundancy can help cater to the needs of different users who expect to use things in different ways. Most importantly, I learned how to integrate a new feature into an app's existing UI.
Next Steps
I would like to run another round of user tests to evaluate my revisions and see if new issues arise with different participants.
Final Product
Click here to view all frames.