Enhancing Save option in Instagram
Introduction
This is precisely my first Case study in my UX design journey. This is a part of the 2 week UX design Kickstart program with UX Anudeep from Growth School.
The task was to Identify a Design challenge from any running application and improvise it. The app I choose was Instagram and the feature was the “Save” option. It was fun exploring different aspect of this field while doing the design challenge. lets explore!
How I got through the complete process
Identifying the Design challenge and evaluating the idea
The Instagram app was evaluated on the basis of heuristic principles and problems were identified and noted down.
The problem was that users were to go to a different screen to categorize their saved reels after clicking on to the save option, this violates the “User control and freedom” heuristic principle. Let us evaluate this challenge by Ideating, Prototyping, and User testing phases.
Solution Ideas to the problems identified
- Idea 1: Save option can be replaced with “save to collection” and after that an overlay can display the available collections and the collection can be selected in which a reel is to be saved.
- Idea 2: From the Save to collection option a new screen can be connected where all the categories are presented and reels can be saved in particular collection. This step takes up 2 screens.
- Idea 3: Save to collection option can be displayed after the post is saved and when that is selected an overlay is displayed where the collection categories are shown. This again is a 2 screen process.
Out of all these ideas the First idea of replacing the button to Save to collection and saving in particular collection is more convenient for the user and it decreases the screen timing of the user.
Visualizing by Creating Prototypes:
Paper prototypes(Low-fidelity)
To turn my ideas into prototype I created a Low-fidelity prototype using pen and paper and observed its working through Marvel App. I thought wireframes which includes multiple screens would need validation and hence I connected the screen through links. It was exciting to see my idea up in action.
High-fidelity prototype
To transform my Paper Wireframes into High-fidelity prototype I used Figma software where different icons and texts can be placed in a screen and screens can be connected using navigation menu through links that connect them.
This final output closely resembles the Interactive representation of the screens and will help the users understand the design better.
Redesign of the Instagram Save screen
Validating the solution through User testing
Since Instagram is a common application and almost everyone is using it, I just went out at random people to do the User testing if users could easily understand the design and use it or not .I have been given feedback on the same.
Task and Key Observations:
I asked Two the user if they could save a reel from the design and observed them.
- Both the users were easily able to find the Save to collection option
- They were able to save the desired reel in the appropriate collection in the same step itself
- Users were able to navigate properly between screens
- The only difficulty was that the user was not able to view the saved reel in the upcoming screens and asked me if I could enhance it in the design.
Improving my Redesigned Screen after Usability testing
In Usability testing I found out that Users were disappointed that they were not able to view the saved reel, so I redesigned the final screen in such a way that after adding it to a particular collection there will be a saved and View prompt at the bottom of the screen which will take the user to the saved category page.
Final UI after usability testing
Initial flow of the Save option
Redesigned Flow of the Save option
Key learnings
This case study endowed me with a lot of exposure, I have gradually learnt a many lot right from learning about UX design fundamentals, evaluating from existing design and many small concepts.
Thank you for reading 🤝. If you liked my case study, then you can let me know by giving some claps 👏 or by commenting 💬
Also do let me know if you didn’t like anything or if anything could be improved, or just any general feedback for me is very much welcomed 📭
You can connect with me on Linkedin or Instagram you can mail me at sabeelisamanyuwidha@gmail.com for talks related to my work.
Thank you :)
