Redesigning Instagram, improving product discovery experience (UX Case Study)

 

Instagram, one of the most popular photo sharing sites in the world. As an avid user of Instagram who guiltily opens Instagram almost whenever I unlock my phone, I felt there was one area of the experience that could be improved. The area is, discovery of products on Instagram. I am not alone in this, according to Instagram, 70% of shopping enthusiasts turn to Instagram for product discovery(source).

From time to time, my friends would share with me exciting products they saw on their Instagram feed, but yet when I tried searching from them through hashtags and a sea of images it felt impossible to find it. This problem sparked a curiosity in me to explore more about possible suggestions and solutions that could properly tackle this problem. The exploration of this developed into the following short case study that you are reading now.

Research Goals

  1. Current user behavior on the Instagram

  2. Uncover their discovery patterns when they search for products on Instagram

User Research

With the research goals in mind I have conducted a survey with Instagram users if they encounter any problems or difficulties using the app. I had a hunch that other users had the same issue when it comes to searching via Instagram and using it to discover new products or content.

Insights

  1. Users who search for products via hashtags could not find the post or product they were searching for

  2. When it comes to purchasing from sellers on Instagram, users either have to go to a site to purchase the product which tends to be the link in the bio page of the seller or purchase through direct messages (DMs).

  3. Current Instagram products may be tagged, but product information is not clear as to where the Seller is based in and whether the product is sold or delivered to the country that the interested buyer is in.

User Persona

Persona.png

Design goals

  • Enhancing the search function of the hashtags

  • Improving on relevant details showed on the product page on Instagram

  • Increasing the product discovery of the product

After researching on the discovery pathways within the application, I have identified a some key areas for the redesign

3 page.jpg

From my user research, users primarily discover products through the search page where they would use hashtags to find products. Where they would use hashtags to narrow down their search results. After they landed on a product page that captured their interest, they could head on with the purchase, however it was a bummer only to realise that the product is not available in their country at the end of the checkout page.

With the desire to enhance the process of discovering new products, one potential method would be allowing other users of Instagram to suggest more information about the product and providing their knowledge and reviews to other shoppers about the product information.

#search.jpg

Another area of improvement could be with the current Hashtag search, from the screens above, there are multiple ways for people to search for the product, A lot of the search results that the users get is dependent on the vocabulary that they use when entering into their search bar.

Prototyping

Off to the races! I quickly sketched down how I think the product would look like and did up the mock-up of the screens. Special thanks to Wonder Network for the Instagram 2020 mock-up so I could spend most part of the prototyping delving into the more essential portrayal of the flow and discussion

My initial wireframe of tagging the product, I have copied the present way of how the current location is being tagged. However, I have received feedback from users that, “I don’t know if I am tagging it to the right source”. My iteration was to combine the current feature of tagging people with the tagging of product description.

Redesign the returned results of hashtag search (‘Relevant’ feature)

Search-2.png

As shown with the problem of searching via hashtag as shown above, using different vocabulary yields different results. However this is not the user’s intention, for example if the user wants to search for cookies that are baked or made in Singapore, user could search for #CookiesSingapore/ #CookieSingapore/ #CookiesSG or other words trying to get to their desired results. All different hashtags point to different results even though it was the same intention or pointing to the same desired outcome. To overcome this issue, I was thinking of the idea of breaking down components of a hashtag using machine learning in understanding the user’s desired outcome, much like ranking a post based on a certain relevancy score to the hashtags they typed. There could be an algorithm in place at the time of this writing that I have yet to know. To make it known to the users that this is a feature to show relevant posts based on the search via hashtags, I classified it under the ‘Relevant’ tab.

Redesigning the product page

types of product.jpg

In the redesigned version of the product page there are a few minor tweaks that I have made. Firstly, the currency of the product will be displayed in the currency that the country used, if the product is perishable such as homemade cookies it will display the country that is based in. If the product is available to be purchased and shipped to the user’s country, delivery to the user’s country would be stated, otherwise it would be left as blank.

While redesigning the product page, I thought about 3 different product use cases for the product page. Firstly, it would be a product page for the main distributor of the product where users could purchase the product directly off the website. An example here would be Apple, where you are able to purchase products directly from their website. Second type of product page would be for sellers who sell their products directly on Instagram via direct messages. An example here would be sellers who sell homemade cookies where buyers could custom order the cookies and arrange for their own deliveries by chatting with the seller. Direct messages allow flexibility in the ordering process for both the seller and the buyer. The third type of product page would be for products where the official website that carries the product is not sold on the site but only available for purchase via an official retailer. An example here would be Rolex, where they do not sell the product on their website and can only be bought through official distributors in Singapore.

User Flow

Product page user flow

Product page user flow ( Click here to view the whole flow)

Product page user flow ( Click here to view the whole flow)

The current existing user flow on Instagram is such that, when a user looks at the post, there is a shopping bag icon indicating more information can be revealed. Upon tapping on the icon, more information will be displayed such as the name and price of the product. Another tap on the name or price will bring the user to the product page. Product page would be where the user would be able to navigate to the main website to purchase or find out more information. A minor redesign that I have done on the product page was to display the price in the currency used in the user’s country and also provide shipping details of the product. This would provide users with better context of the price as well as letting them know if the product could be shipped to their country.

User Flow from Search to Product Inquiry via Direct Messaging

User Flow from Search to Product Inquiry via Direct Messaging ( Click here to view the whole flow)

Users would be directed to the search page via the search icon on the navigation bar. Where the user would be able to perform a search of the product they would like to find. In this case, if the user is searching for cookies that are made or sold in Singapore. “cookiessingapore” search was typed in the search bar, where the user would be suggested possible accounts and hashtags. When the user selects the hashtag, they would be presented with the results page displaying relevant results where it would display posts of the same category to help users find relevant post to their search. After viewing the posts, the user could select one that they are interested in. In this scenario, if the user is interested in Annie’s Chocolate chip cookies, he/she could tap to view more information on the cookie and tap again to the cookie’s product page. On the product page the user could see the call to action(CTA) of messaging Annie’s Cookies to inquire for more information. Upon tapping on a message to inquire, the user would lead to a direct message chat with Annie’s cookies where they could ask Annie on purchasing the cookies or any specific inquiries they would like to make.

User flow of posting with the tag product feature

User flow of posting with Tag Product Feature ( Click here to view the whole flow)

From the post icon, user would be directed to the page where they could select photo from their gallery. After selecting the photo, they could customise and edit the photo by editing filters or manually configuring the image colour settings. After doing so, they would be directed to the New Post page where they would be able to add caption, tag people, products and location to the post. In this case, the user would like to tag the product, he/she could tap on tag products where they will be presented with a familiar user flow as one would usually tag other users on Instagram. Users could tap on an item/ product in the picture that they would like to Tag, which opens up the search products feature. Here they will see the company’s profile next to the product to know which account they will be tagging to. After selection, a preview of the tag will be displayed, and simply tapping on the “Done” button would bring them to edit their posts if they wishes to do so before finalizing their post and share it. Upon tapping on share, the post will be published on their news feed.

User Flow with my redesign ( Click here to view the whole flow)

User Flow with my redesign ( Click here to view the whole flow)

Conclusion

This mini case study took me about 4 days and it was exciting, uncovering areas of the app that were previously less known to me. I have learnt a lot about the current user behavior when they navigate and discover on Instagram. As this is my first time doing a redesign of such a massively popular social media app, I wondered constantly on how my new feature would affect the existing user flow. Trying to add features as small of a change as possible to see what I could get away with, as well as thinking of how the features I would be adding would integrate in the current user flow and design. Hence, a major part of my design decisions was not to disrupt the user’s existing mental model of the app while integrating my solutions.

Next steps

Deeper User research

  1. Due to time constraints, I have only asked the users of the platform that were available to me. If I had more time to build on this project, I would like to interview not just the users on the platform, but also the sellers on the platform. Currently most sellers that i have encountered who primarily use Instagram as their shop and facilitate the transactions via direct messages. I would like to understand the obstacles they faced through selling on Instagram via DM and the workarounds they did through the process.

  2. As I was typing out my case study, I have learnt that Instagram had a full checkout process where users are able to purchase products directly off Instagram which is available only in the United States. Upon reading an article about it, it makes me wonder about the user flow for the merchant side on Instagram.

User testing

Due to the short time frame I had with this project, I would like to conduct a usability test of my user flow and uncover deeper insights to how users would react to my redesigns. I have tried my best to share pieces of my wireframes to the friends whom I surveyed and got some feedback. Some questions that I would like to find out more are.

  1. Do users know related search display search results that are outside of the current hashtag that they have selected?

  2. Does the product page that provides the relevant information about where and how the product is sold ?

  3. When the user tags the products would they understand the labels displayed?


Thank you for reading through this case study! I hope you enjoyed reading my thoughts and design as much I enjoyed make it. This is my first medium post of a case study, redesigning a popular social media app. I would love hear your feedback and thoughts and learn from you !

Stay safe everyone!

If you are interested in learning more about me or get in touch with me, check out the following links.

LinkedIn / Email

Previous
Previous

All in one diary app

Next
Next

Redesign of National Library Board Mobile App (Short)