Project Overview

A rapid design journey toward intuitive, scalable solutions to introduce the multi-channel management product’s first AI-driven category recommendation feature that quickly became indispensable to our users, evidenced by a 60% adoption rate post-launch.

This milestone not only demonstrated the feature's immediate value but also set the stage for ongoing product evolution and enhancements.

My Role

As Lead Designer for our multi-channel management product, I guided a team of two designers to conceptualize and finalize our first AI feature within one week.

Having been the cornerstone of this product's design and research efforts for four years, I brought great depth of customer insight to the project. This extensive background enabled me to effectively mentor the new team members, offering them nuanced feedback and design recommendations that were deeply informed by our users' needs and preferences.

Goals

Business Goal: Position the product in the market as having AI capabilities for increased competitiveness

Product Goal: Quickly integrate the first AI-driven feature into the multi-channel management product.

Context

While fully engaged with another project, I took on the leadership role for this multi-channel management product amid its extensive enhancement queue.

Unexpectedly, stakeholders prioritized integrating AI features, demanding a swift release without regard for ongoing improvements or the established design process. This urgent directive challenged us to innovate within tight constraints, as the project manager sought to limit disruptions to the development team's focus on existing commitments by advocating for minimal changes to the UI and backend.

Requirements Gathering

I initiated a discussion with the Project Manager to understand this AI initiative and his perspective, emphasizing the importance of user research and the potential impact on user trust. I proposed a compromise that balanced the PM's desire for a quick launch with my concerns for usability and accuracy. I suggested iterative development, starting with a basic version of the feature to gather user feedback for future enhancements.

My goal was to ensure that the design was user-friendly as well as scalable and accurate, aligning with our long-term vision for the product.

Research

The team considered the workflow of similar products and learned that while some offered a workflow that set themselves up for better AI categorization, it wasn’t ideal for listing the product error-free and would have introduced a lengthy redesign and implementation.

Competitor Workflow (with AI):
User fills out a dozen basic generic product properties —> Selects sales channels to sell on —> AI attempts to categorize from basic properties

Our Original Workflow (sans AI):
User adds only product SKU & Title —> Selects sales channels to sell on —> Categorizes —> Fills out all required product properties

Pros:
-Users know which product properties are required to successfully list (this workflow had been previously optimized to mitigate listing errors by presenting all required channel properties which are only known once we know the channel category)
-Can keep the workflow users are used to which has been optimized to provide them with value

Cons:
-Potential for less AI accuracy or no recommendations

After a quick evaluation of similar products, we decided to keep our existing workflow.

(have this be a scrolling or clickable image)

The existing design to add a product only required a product title and SKU for it to be added to the system. If users wanted to continue listing the item, they needed to complete a series of fields in the subsequent wizard. The first wizard page asked users where to list the product and then categorize the product for each channel. Based on prior user feedback, we had implemented a categorization shortcut to pick from those most recently used. Based on the channel categories, the system knew which product properties to display on the subsequent wizard page.

The Problem

How do we keep our current workflow and integrate AI categorization?

Proposed Ideas: (this could be a panel with callouts on Travis’s mock pointing these out)
One idea was to duplicate the description field in the initial dialog so we’d have more information to provide the AI. The PM favored this and mocked up his thoughts visually to communicate this thinking to us.

Add a description field on the “Add Product” dialog before the user selects their sales channels in the subsequent wizard to supply the AI with information to generate a category recommendation more effectively
Select channels and have the AI automatically generate recommendations for the user with confidence ratings along with the ability to continue to select categories manually

Design Exploration

Design discussions were conducted via Figma comments, helping facilitate communication across our international time zones.

Screenshot of one of the Figma project pages with my comments in the green “C” bubble

The primary designer for this project started with a visual refinement of the PM’s concept, but there were gaps in this design and many areas for improvement.

Then he and the other designer worked on these two concepts…

I provided feedback with supplementary designs to help explain my suggestions...

(show checkbox as an interaction gif)

They revised the designs, incorporating my feedback…

(show scrolling images)

The Final Design

The final design looked like this…

(show full prototype)

The Released Feature

The released version included the removal of the initial description input as it was deemed unnecessary, during implementation, for the AI categorization to produce suggestions, thus reducing further dev and UI changes.

In addition, the high and medium confidence level indicators were removed so our recommendations would instill trust and there wouldn’t be any implication of anything other than high confidence recommendations.

(screenshot or create a free trial and take a video)

The Impact

The feature was implemented with a plan for iterative updates based on user engagement. About 60% of our users adopted the feature, validating its value.

Learnings

This experience taught me the importance of balancing innovation with usability and the power of constructive dialogue in resolving differences. It also underscored the value of compromise and iterative development in product design.

This experience reinforced the importance of empathy, both for team members and users. It taught me that embracing different viewpoints can lead to innovative solutions that better serve user needs. I've since applied this learning to foster more inclusive and effective collaboration in my projects.

Next Steps

I’d like to gather user feedback for this AI category feature and continue iterating.
(mock up some ideas with the thumbs up)

Here are some UX design ideas that could further enhance the design of the AI category recommendation tool:

Visual Hierarchy: Ensure that the most important elements stand out. For instance, the "AI Recommendations" could be more visually distinct from the other category options.
Information Clarity: It may be beneficial to provide a brief explanation or tooltip for what "High confidence" and "Medium confidence" mean to the user to make the AI's recommendations more transparent.
Feedback Loop: Include an option for users to give feedback on the AI's recommendations. This could help improve the AI’s accuracy over time and also make users feel involved in the process.
Progressive Disclosure: Use this principle to keep the UI uncluttered. Show only the most necessary options first, and provide the ability to drill down for more information if the user needs it.
Consistency: Ensure that the design language is consistent across different channels. The checkboxes for eBay and Shopify look different from the radio buttons used for Amazon and Walmart, which might confuse users.
Error States: Plan for how the system will communicate when the AI is unsure and provide guidance for manual category selection.
Help and Support: Incorporate an easily accessible help feature or guide for users new to the AI feature to enhance usability.
Cross-Channel Comparison: If users manage multiple channels, they might benefit from a comparative view that suggests categories across all channels simultaneously to quickly identify discrepancies.
Performance Indicators: Show how the use of AI recommendations could potentially affect their sales with predictive analytics, which could encourage usage and trust in the system.
Personalization: Over time, tailor the AI's recommendations based on the user's history and preferences to create a more personalized experience.

Remember, user testing is key to identifying which areas need improvement, so obtaining and incorporating user feedback into iterative design updates is invaluable.

To work in a feedback loop (#3 from the tips) into this design, consider the following UI/UX strategies:

Inline Feedback Option: Next to each AI-generated category recommendation, you could include a small icon (like a thumbs up/thumbs down or smiley face/frowny face) that users can click on to quickly indicate whether the recommendation was helpful or not.
Post-Selection Feedback Prompt: After a user selects a category, prompt them with a quick one-question survey asking if the AI recommendation was useful in their decision-making.
Feedback Section in Modal/Popup: When a user hovers over or clicks on the confidence level indicator, a small modal or popup could appear, asking "Was this recommendation correct?" and provide a yes/no toggle.
Detailed Feedback Form: In the tool's settings or in a separate dedicated feedback area, include a form where users can provide more detailed feedback about the AI recommendations, which can help the data team improve the algorithms.
Contextual Inquiry: Embed a small ‘Feedback’ link or button near the recommendations. When clicked, a sidebar or modal can slide in asking the user contextual questions, such as “Did the recommendation meet your expectations?” or “How can these recommendations be improved?”
Periodic User Surveys: Occasionally invite users to participate in a survey or an interview to provide more comprehensive feedback about the AI feature and their overall experience with the product.

Implementing any of these options should be done with careful consideration of not disrupting the user's workflow. The feedback mechanism should be intuitive and require minimal effort from the user to ensure higher engagement rates.

(I really like the thumbs up and down. Would it be better to put it next to each category recommendation or at the top right of each AI recommendation card in the light purple header portion? Should the thumbs up or down be ordered first?)

AI-Driven Product Category Feature

Transforming multi-channel management with AI ✨