Researching pain points and designing a new valuable feature

INSTAGRAM: SEARCH FILTER

OVERVIEW

*This project has no affiliation with Instagram

ROLE

  • UX Researcher

  • Product Designer

TOOLS

  • Figma

  • Miro

  • Loom

  • G-Suite

TIMELINE

  • 80 hours

  • 2 weeks

Background

Instagram is one of the most popular social networking apps and has become a world of connection, discovery, shopping, endorsements, and more. In a world where apps are competing against one another to gain the most users, Instagram has held a powerful spot for a long time. However, some competitors are starting to surpass Instagram’s user base, and Instagram has been looking for ways to stay ahead of their rivals.

Problem

While Instagram has an immense amount of content, it is not being utilized to it’s best value. They have a search bar that is terribly limited - delivering very broad, vague results from different decades, locations, and even unrelated topics. Other times, it provides no results at all.

If Instagram had a search function that was more robust with filter capabilities, users would be able to access relevant, valuable results from the extensive collection of content they have to offer. Instagram could essentially add a Yelp or Google Search to their toolbox.

SOLUTION

RESEARCH

Secondary Research

Prior to diving into this project, I researched the scope of Instagram today. The data revealed that Instagram is still one of one of the largest active user bases among all social media platforms. By developing a deeper search function, Instagram could capitalize on the potential of their existing user base and fortify their position against competitors.

Competitor Analysis

There are a some big organizations who have a similar function - so I did a deep dive into these companies to identify and compare their strategies and gaps. While these competitors have strength in customer reviews and the number of results, they do not have the myriad of pictures, videos, and tags that Instagram does.

User Interviews

After gaining a deeper understanding of the competitors in the market, I wanted to speak with avid users of all of these apps (Instagram, Yelp, Google, TitTok). I conducted 5 in-person user interviews and usability audits.

My goal was to understand what users found valuable in search engines, and also collect feedback regarding Instagram’s current search function.

Usability Audit

DEFINE

In order to ideate how users will interact with this new filter feature, I created this user flow to map out the steps they’ll take through the app. I synthesized strategic methods from competitors with user feedback on priorities and preferences.

The happy path shows how the average user would navigate utilizing the filters to customize their results.

User Flow

Low Fidelity Wireframe

With Instagram’s current structure and my research findings in mind, I drafted these low fidelity wireframes to conceptualize how this new feature will be added in.

I introduced a filter icon, location search bar, and new results tabs.

DESIGN

Design System

I created this UI kit based on Instagram’s existing typography, color palette, icons, button styles, and design patterns.

Mid Fidelity Wireframes

I started adding Instagram’s UI components to the lofi wireframes.

I shared the wireframes in group critique discussions and with my mentor, and received feedback that the filter page did not exactly match Instagram’s UI - the colors, shapes, and layout.

Thanks to this feedback, I updated this wireframe to be more consistent with Instagram’s current design system before moving onto the higher fidelity prototypes.

TEST

Prototypes & Usability Tests

To evaluate the usability of the new search feature, I tested my prototypes with 7 users with the following tasks below. The tasks starts with an action users are already familiar with within Instagram, then the new and updated features appear in the process.

1. Find some pictures/videos of sushi

2. Find some sushi locations nearby

3. Apply filters: most liked + 3 miles away

4. Find some sushi profiles

Results

Positive Insights

7/7

provided positive feedback that the flow was intuitive

7/7

agreed the filtered search would entice them to utilize Instagram more

7/7

completed all 4 tasks 100% successfully without roadblocks

Critical Insights

  • 6/7 believed the new feature was not explicit or apparent enough at the start of the flow

  • 5/7 would not really use the “caption included” feedback

  • 6/7 recommended additional filters for me to add

Iterations

FINAL DESIGN

CONCLUSION

WHAT I LEARNED

1) I gained a better understanding of timeline constraints and scope of a project. My original wireframes included a price filter because that’s what I envisioned in a fully developed version. However, through discussion during tests and iterations, I realized the price addition drastically increased the scope of this project, so I decided to push it after the MVP.

2) I learned to navigate within an established design system, utilizing existing design patterns and components. I utilized the same components as users are already accustomed to them, and deviating has the potential to impact usability negatively.

3) I developed better interview discovery skills. It can be challenging to ask questions without bias like “Would a filter make this feature better?”, as this type of question is can lead the interviewee to an assumption when the focus is to be discovering user insights and pain points. I initially assumed I was going to build just a location filter - however through more open ended questions and discussions with my interviewees, they suggested a collection of multiple filters that would be vital.

Future Design Considerations

  • Review/Testimonials

  • Prices

  • Booking ability