Blinkit's Dynamic Collection Creation Tool
INCREASING OPERATIONAL EFFICIENCY
ABOUT THE COMPANY
Blinkit (formerly Grofers) is an Indian quick-commerce unicorn trusted by millions. The platform delivers 5000+ products in a blink and is India's biggest 10-minute delivery platform.
PROJECT OVERVIEW
Blinkit's collection creation tool is used to categorize over 5,000 products into multiple collections; however, this process is time-consuming, requires continuous manual intervention, and often results in multiple errors on the Blinkit app.
The goal is to design a dynamic collection creation tool that automatically fetches and adds products to collections based on specific filters.
MY ROLE
User research, UX design, testing, and delivering the product considering both development constraints and user needs.
OUTCOME AND IMPACT
→ Enhanced customer experience by delivering real-time updates and ensuring a seamless, error-free experience.
→ Streamlined the workflow for the merchandising team (users) by creating a system that automatically generates collections based on predefined criteria, ultimately saving them time and effort and minimizing human errors.
TEAM
Designer, Product Manager, Merchandising Team (users), Developers
TOOLS
Figma, Slack, Trello
TIMELINE
2 Months
RESEARCH - UNDERSTANDING THE BRIEF
This step was crucial in gaining insights into both the existing collection creation tool and the collection creation process. I collaborated with the users (Director of Growth and the Merchandising Team), observing their collection creation process. Additionally, I created a test collection to gain a deeper understanding of the process.
I focused on the following points to understand the collection creation process:
UNDERSTANDING THE BACK END AND THE FRONT END
All products are mapped to the parent categories (L0s) in the "Shop by category" section, which have several subcategories (L1s and L2s) mapped to them in the backend. When creating a collection, the system retrieves data based on these mappings.
FRONT END - EXAMPLE OF COLLECTION
Collections are groups of products created based on various factors, including brand promotions, themes, offers, partnerships, and cross-selling.
HOME PAGE
COLLECTION
COLLECTION L1 VIEW
COLLECTION LISTING
IDENTIFYING ISSUES WITH THE CURRENT SYSTEM
Most collections collections require manual entry of product IDs (PIDs), and the available filters in the portal are not very useful. This leads to the collections having the wrong products many times.
The system lacks essential functionalities for managing product collections, such as removing duplicates, viewing the final collection list, and downloading the collection list. This makes it difficult to keep track of products in a collection, retrieve data about products in a collection, and analyze data for merchandising purposes.
OLD DASHBOARD FOR CREATING STATIC COLLECTIONS
Multiple products in the system are mapped to multiple parent categories and subcategories. When a product is added to a collection, the system fetches all the categories mapped to a product which negatively impacts the user experience.
EXAMPLE
Suppose a collection of the following items is made and grouped by L1 view:
ANOTHER EXAMPLE
What if a brand, say 'Super Glow,' wants to promote its collection on the app? In this scenario, the displayed products will belong to the 'Super Glow' brand, but the L1 image (sidebar image) might show the image of some other brand 'Ultra Bright.' This is because 'Super Glow' is mapped under the 'Oral Care' L1 category, which has the 'Ultra Bright' L1 image mapped.
This situation could lead to a dispute between the brand and the platform.
PROBLEM STATEMENT
The manual process of adding product IDs (PIDs) to create collections often leads to collections containing wrong products.
This static collection creation process negatively impacts the browsing experience on the front end.
STATIC COLLECTIONS
The contents of a static do not update automatically. They require manual intervention to add or remove products and there's a high probability of errors which reflect on the front end.
SOLUTION
To develop a dynamic collection creation tool for the merchandising team. This tool will automatically fetch and add products to collections based on specific filters.
This will improve the accuracy and browsing experience on the front end.
DYNAMIC COLLECTIONS
The contents of a dynamic collection update automatically, reducing reliance on manual intervention. Dynamic collections can be modified based on certain criteria or conditions. This allows for real-time adjustments and ensures that the collection reflects the most current and relevant items.
INFORMATION ARCHITECTURE
We integrated a collection creation section into the CMS dashboard, replacing the Merchandising Dashboard (old dashboard). This change aligns with the CMS being the source of data for collection creation.
The final information architecture was created after multiple rounds of feedback from the development team, users, and senior designers.
FINAL DESIGNS
SIGN IN
The current sign in screen of Blinkit's CMS will be used for individuals with a Zomato or Grofers / Blinkit ID. However, it is important to note that not all employees will have permission to access the collections feature on CMS.
EMPTY STATE - NEW DASHBOARD
This dashboard is not designed for individual use, therefore, there are no empty state screens for new users. Instead, the empty state screen is specifically meant for the first user since this dashboard is new and contains no collections.
CREATE NEW COLLECTION
Scenario - The user needs to create a new collection. “Name” of the collection - This serves as the collection name for the backend, as multiple collections can have the same name. Subsequently, the user must provide the "Collection display name," which will be visible on the front end (app side).
ADD PRODUCT - FILTER
The creator has to add filters to make a collection. The system will use these filters to get data from the catalogue. Each filter can have an "and" or "exclude" condition. This is important in the case of excluding some products. The user can decide if it’s an “and” filter or an “exclude” condition. The filters include "P-type" (Product Type), "Brand," and the requirement to fetch products from "L12, L1, or L0."
FILTERS - ADD OR EXCLUDE PRODUCTS
The exclude condition will be applied when a particular set of products needs to be excluded/removed. In this collection, all the P-types mapped to the brands Plum and Vega, which are mapped under the L2 categories Lip Tint and Lip Care and the L1 categories Personal Care and Beauty, will be added to the collection except for the P-type Lip Scrub.
PRODUCT PREVIEW - EXCLUDE CONDITION
During the initial design iterations, instead of using the "and" or "exclude" condition and the "add product group" functionality, there was only a "remove" option available in the preview to exclude products. However, this approach proved to be inefficient when dealing with a large number of products, as it would require manual exclusion of products.
Moreover, the users needs to refresh the preview after adding any filter to check the updated preview. The reason being that in this case the API requires an action / trigger to refresh ad reflect the changes made.
ADD PRODUCT GROUP | ADDED PIDs
Adding a new product group mirrors the fields and filters, allowing creators to add another set of filters. This feature is necessary when the "and" or "exclude" conditions are insufficient to specify product exceptions. These different product groups make creating collections on the backend more convenient.
Example: What if you need to add the P-type "Lip Scrub" but only for some specific brands? In the previous product group, the P-type "Lip Scrub" was excluded.
List of PIDs: This list is essential for PID-level verification and to maintain a record of the PIDs included in a collection, as the backend operates at a PID level. Additionally, these PIDs are necessary for data analytics purposes.
PRODUCT GROUPING - SINGLE LIST VIEW
In this case the products are grouped using a “Single list” depicted in the app preview. In this kind of grouping there are no sub categories visible on the app, though products are still mapped to L1 / L2s and L0 at the backend. This is simply the list of all products added into the collections, it’s usually used when there are less number of products or no further division is required.
"Boost PIDs" can be used when the sorting criteria requires manual override. Here, the user needs to add the PIDs or product names that will always be at the top of the collection list and override any sorting criteria. This is mostly used in the case of sponsored products.
PRODUCT GROUPING - L1 VIEW/SIDE NAV BAR
Grouping by either of these criteria: “Group by L2”, “Group by L1”, “Group by L0”, or “Group by P-Type” will lead to a side nav bar layout. The criteria for data fetching will be different. In case of a “Group by L1” criteria, the system will fetch all the L1s mapped to the products into the nav bar. The same data fetching process will be applied for other grouping criteria.
Within the side nav bar, the the items referred to as "L1s" can be rearranged. Additionally, an option to combine multiple L1s and make edits to their names or images is also included. This flexibility is particularly useful in cases where there may be multiple L1s (subcategories) with the same name, image, or products associated with them, as mentioned earlier in "Multiple Mappings."
COMBINE L1 GROUPS
In the previous system, there was no function to combine multiple L1s or change the image or name of an L1 exclusively for a specific collection.
There are thousands of collections live on the app and manually adding PIDs to create collections becomes a tedious process, particularly when a single collection can have hundreds or sometimes thousands of products.
Once the grouping criteria are selected, the user can successfully create a collection.
COLLECTION LISTING
This list will include the collection ID, which will be used to enable the collection, display name, collection status if it is enabled on the app or disabled, updated by, and updated on.
TESTING
We conducted several rounds of testing to evaluate the product before releasing it to end users. This exploration phase involved numerous attempts, culminating in the final designs.
Overall, the transition to dynamic collection creation has saved time and effort, improved the relevance and responsiveness of collections, and resulted in a more engaging and tailored experience for users.
The product has been successfully launched on the CMS of Blinkit.