Product Design, feature update
OrderMyGear
I redesigned the inventory feature to better communicate product availability by distributor, helping store-builders avoid out-of-stock sales. This reduced returns, rebuilt trust, and drove a 20% increase in product sales.
Role
Lead Product Designer
Team
Product Manager, Engineering Manager
Constraints
6 Weeks
Technical restraints — possible server overload
What OMG does
Order My Gear is a multi-product platform that enables store-builders to design online pop-up stores selling branded products to their specific customer base.
Store-builders can source products from partner brands (e.g., Adidas, Gildan) and customize them with their own logos before adding them to their stores.
The inventory feature retrieves real-time stock data from partner brand servers, helping store-builders decide whether to purchase and customize a product for resale.
The Challenge
It’s 2021, and you're hanging out with your Zoom community, waiting for the custom sweatshirt you ordered over a month ago.
During the pandemic, shipping and distribution delays left customers frustrated, leading to unfulfilled orders.
This caused financial losses for our clients and eroded trust in their online stores.
Research
I conducted user interviews with 3 of our clients to uncover their needs, pain points and goals around inventory.
Key Findings
2 out of 3 participants don't want customers ordering low-stock or out-of-stock products, as it erodes trust in their service and creates profit loss from returns.
Define
Using the research findings, I reframed the data as How Might We Questions, to facilitate brainstorming and feature prioritization with stakeholders and developers.
How Might We
How might we keep our data up to date to build trust around OMG’s inventory information without overloading our partners' servers?
How might we accurately communicate to our clients when inventory is low?
Priority Matrix
MVP Features
- Products are automatically removed from the storefront once inventory hits the threshold set by store-builders, preventing sales of items likely to sell out before the store closes and the order is placed.
- User-initiated inventory checks will decrease the technical overload of partner servers, ensuring our clients receive the most up-to-date inventory information.
- Display a "last updated" timestamp to build trust and transparency around the inventory data provided.
Technical Parameters
Our partner brands were concerned that constant inventory updates would overload their servers.
To balance system performance with store-builders’ need for up-to-date information, we designed the inventory tab to display a timestamp showing the last update.
Store-builders could manually refresh the data by reloading the page, giving them control without straining partner systems.
User Flow
- The inventory page displayed product availability and allowed store-builders to set thresholds that triggered low-stock alerts.
- Alerts would be sent to them via email.
Test
In order to test my solution, I partnered with customer service to find 5 store-builders who had previously reported issues with our current inventory experience.
Scenarios
- You’re adding a product to your store and want to confirm it’s in stock with the supplier before your store closes. Check your supplier’s inventory to be sure.
- One of your suppliers is more reliable than the others. For the less reliable supplier you want to change your supplier threshold level.
- You want to see what stores have been impacted by low inventory levels. Check which stores have been impacted.
Key Findings
- All participants want to check inventory while building a store.
- All participants checked the product tab for inventory.
- 3/5 participants were confused with how to use "edit thresholds" modal.
- 3/5 participants want inventory per product, 2/5 wanted to set thresholds by supplier.
Conclusion
Our store-builders can confidently build stores knowing that if a product reaches a low inventory threshold, it will immediately be pulled off of the storefront.
Our store-builders will also be provided with up-to-date inventory information on product variants so they can make educated decisions around product selection and setting thresholds.
Next Steps
Analyze post-launch data to assess success and inform future iterations of the inventory feature.
Conduct customer experience surveys to gather feedback and adjust based on user insights.
Finalize and enhance the onboarding process to guide users through the Inventory Manager Experience, reducing the need for customer service calls.
Design
Wireframes
- Inventory data visualization designed to show clients how many of their stores carry low-inventory products, enabling proactive decision-making.
- Product List that helps clients quickly identify low-inventory products the store-builder has in their stores and view variant availability by supplier.
- Supplier List helps users identify suppliers with low-stock products and take action—such as adjusting thresholds or switching to more reliable suppliers.
By using the OMG Design System that I had spearheaded as a foundation, I built the UI with reusable components that not only accelerated my design process but also ensured visual consistency and made developer handoff more efficient and error-free.
I had previously spearheaded the OMG Design System, so I used it as a foundation to design the application’s UI and tested its efficacy.
By leveraging its reusable components as building blocks, I streamlined my workflow, ensured visual consistency, and facilitated smooth collaboration and handoff with developers.
After implementing the design system, collaboration efficiency improved: meeting time decreased by 25%, and the number of revision cycles was reduced by 18%, streamlining design-development alignment and accelerating delivery.
Next I digitized the wireframes in Figma while making any necessary adjustments to ensure a straightforward display of inventory information and threshold setting process.
