Adding a ‘Story’ feature in AJIO — UX Design Case Study

Targetting User Engagement and Retention

This project was done as a part of a 48-hour Product Design Challenge.

📍The aim was to add a ‘stories/reels’ feature to the ‘AJIO’ app, a marketplace for Fashion Brands. This would provide a unique and engaging way for users to discover new and upcoming products from their favourite brands.

🔵 The Final Product

Here is a comparison between the current screen and the redesigned screen after adding the new feature:

📍The Store Section:

The ‘Store’ section in the Ajio app features brands, collections and categories revolving around Fashion.

Working prototype:

🔵 Index

I’ve documented the process along with the learnings in the case study below.

Go to any section by clicking on it (or keep scrolling):

🔹What | Why | How — Introduction

🔹Who are my users?

🔹How do my users understand stories as a feature? — Research

🔹How can we do this in Ajio? — Wireframing

🔹Let’s see if it works — Prototyping and Testing

🔹Iterations — The revised UI and Prototype

🔹What could I’ve done differently? — Reflection and Learnings

🔵 Introduction

The UXM community, under the mentorship of UX Anudeep, organized a 48-hour Product Design Challenge. The objective was to design a feature, create wireframes and prototypes, conduct usability testing, iterate on the design, and create the final UI prototype within 48 hours!

The challenge began on Friday at 9 pm. The following schedule was followed during the 48-hour challenge:

Schedule of the challenge

My team was assigned the Fashion Marketplace app ‘Ajio,’ and each of us chose a different feature to work on.

📍Core Idea of the feature:

The core idea of the feature is to provide users with a visually appealing and interactive way to discover new and upcoming products from their favourite brands. Brands can create and publish short videos or images showcasing their latest collections, trends, and products. Users can easily access these stories from the app’s ‘store’ screen, where they will be presented with a carousel of stories from various brands.

📍Impact on Business Metrics:

The Brand Stories feature is expected to increase user engagement and retention, as users will have a more personalized and immersive way to discover new products from their favorite brands. This, in turn, is likely to increase sales and revenue for Ajio, as users will be more likely to make purchases through the app.

📍How it helps users:

Users can easily access these stories from the app’s ‘store’ section, and they can swipe through them to view different products and collections. This feature also allows users to stay up-to-date on the latest fashion trends and get inspiration for their own fashion choices.

📍Constraints:

One of the main constraints is ensuring that the content published by brands in the Stories feature is high-quality and engaging. Ajio will need to establish guidelines for brands to follow when creating their stories to ensure that they provide value to users. Additionally, there may be technical constraints related to the storage and playback of video content within the app.

📍Assumption to be taken beforehand:

One assumption that Ajio can make is that users are interested in discovering new and upcoming products from their favourite brands. Another assumption is that brands will be willing to create and publish content for the Brand Stories feature.

Back to Index

🔵 Who are my users?

Fashion Enthusiasts.

These users are typically young adults or teenagers, aged 18–25, who are passionate about fashion and enjoy exploring new trends and styles. They shop considering the label and brand.

Young adults form the second largest group of visitors to Ajio (35.81%). Source.

They might be students, freelancers, or entry-level professionals, living in metropolitan cities such as Mumbai, Delhi, Bangalore, etc.

Their interests include fashion, beauty, lifestyle, and social media.

Back to Index

🔵 Desk Research

The main aim of secondary research was to understand this:

‘How does my target audience interact with stories on existing platforms that they are most familiar with?’

Another question was this:

‘How can I design so that users intuitively know what to do and expect from stories in a marketplace?’

For this, I began studying the apps my target users use the most. Mainly,

• Instagram
• Snapchat
• Facebook

I also looked out for direct marketplace competitors to see if any of them uses stories.

Myntra has a studio section. Though it doesn’t exactly use stories, it was referred to understand the type of content that might go on the feature.

📍Conclusions from secondary research:

Users understand a feature as a ‘story’ by depicting it in one of two ways:

1. Story highlights through coloured strokes in circles where users know who has updated a story by their username but don’t know what content to expect unless they’re aware of the type of content being shared by particular accounts — like Instagram and Snapchat.

2. Rectangular thumbnails giving a preview of content where users can know what to expect from the story and click on the ones they’re interested viewing in— like Facebook, Myntra and Snapchat Subscriptions

The placement of stories is generally on the upper part of screens where they are more discoverable and any updates are conveyed as soon as the user lands on the screen.

Also following the heuristic ‘recognition rather than recall’, stories usually consist of the display picture and account holders’ name which is visible before a story is previewed.

Back to Index

🔵 Wireframing

I had two options to choose from. A) The Circular Story update or B) the Thumbnail Preview story update.

I went ahead with the thumbnail preview for stories.

The reason was this: Ajio already had a circular UI element with stroke on the homepage i.e. The Categories. Having another feature with same design might be confusing for the users as they may confuse Stories with Categories and vice versa.

Back to Index

🔵 Prototyping and Testing

I began making the UI by deciding the components I’ll need and designing them.

📍I’ve designed the thumbnails and screens to:

🔹Make sure the user understands a new feature update

🔹Knows intuitively how to interact with it

🔹Can go to the product description screen from the story content.

Here’s the working prototype I used for testing:

📍Users I tested with:

For finding the users, I sent out a broadcast message on my socials, asking if my contacts know any people ( whom I don’t know) who fit in my target group. The following criteria were laid out:

1. Age to be between 18–25
2. Should live in tier 1 or 2 city
3. Should have an active social media life
4. Should be a fashion enthusiast

I tested with 2 users fitting the criteria:

User 1: A female young working professional, age 23, living in Mumbai (Tier 1 city), frequently shops from top brands and likes to be up with the market trends.

User 2: A male university student, age 19, living in Nagpur ( Tier 2 city ), wants to define his own style and is working on his glow-up.

Back to Index

🔵 Revised UI and Prototype

The following changes were made based on the feedback collected:

Working prototype:

Testing with the new prototype:

The user for the second round of testing was selected in a similar manner as the first round. Following are the user details:

User 3: A male working professional, age 24, living in Pune( Tier 1city ), Shops from selected brands frequentl and keeps experimenting with his style

📍Outcomes of the test:

1. The user clearly identified the thumbnails as stories and tapped to view them
2. The user clearly understood what product was being promoted
3. The user understood the CTA in the tag and figured out that it’ll take them to the description screen

Back to Index

🔵 Future Scope and Learnings

For the content that goes in the stories, I scoped down the project to imagery content. The stories with video content for a marketplace like Ajio still remain unexplored for me. Hence, the area of the use of video and animation to promote products in stories can be explored further.

📍Few things I learned along the way and at the end:

I learned the importance of testing your designs and collecting feedback as early and as often as possible.

I understood the importance of understanding user behaviour.

I learned the impact research can have, even if it’s little, on the approach we take while deriving a solution.

Thank you for reading till the end

I would feel more thankful if you clap for this article and give your feedback!

Connect with me on LinkedIn: www.linkedin.com/in/sanyukta-awasarmol

Lastly, I would like to thank my mentor, the volunteers and my teammates for giving their guidance and help whenever I needed it!

#studentforlife