NexaAI
Redesigning the AI tool submission experience
Project timeline
- 2 Months
- Feb - March 2024
My role
- Product design
- Design research
Our team
- PM x 1
- Product designer x 4
- Front-end devs x 3
- Back-end devs x 2
Platform
- Web (desktop)
Redesigning the AI tool submission experience
NexaAI is an AI tools aggregator.
It provides a platform to facilitate:
Through web analytics tool, we discovered that the dropout rate of the new AI tool submissions flow is very high compared to site and industry average.
User experience impact
+86% in completion rate compared to the pre-redesign version.
-35% in time spent to complete the flow.
Business impact
+22% in new tools submissions.
-52% in engineering hours required for scraping and processing new AI tool data.
We conducted research to better understand the problem we faced.
We identified high-dropout rate but lacked clarity on its causes. To gain deeper insights, we conducted interviews with AI tool creators to understand their experience with the submission process and uncover potential pain points.
1. Time consuming
The AI tool creators expressed frustration with the form's length, describing it as relatively long. They also highlighted that certain fields, such as those requiring marketing materials or a financial commitment to paid promotion, demanded additional thinking/preparation time.
This makes it more likely for users to put the process on hold, with some forgetting to return and complete their submission.
2. Confusing requirements
Users consistently reported difficulty understanding the distinctions between certain fields. For example, many struggled to differentiate between "feature highlights" and "use cases."
This confusion led to a lack of confidence in their responses, making users more likely to abandon the form altogether.
How might we help tool creators save time and gain greater clarity when submitting their new AI tool?
"save time"
Solution 1
Streamline the process
We can streamline the form by re-organizing the form elements based on their importance.
"gain greater clarity"
Solution 2
Offer more assistance to confusing fields
We can provide more useful information to clarify the requirements and purpose of the fields.
Let's take a closer look at how I translate these solutions into real design.
Reduce submission time and cognitive load through strategic prioritization.
After identifying these key friction points - particularly the cognitive load from complex form fields and the premature financial decisions - we decided to tackle the root cause through information architecture redesign.
After discussing with our product manager, we prioritized all form elements into four levels of importance. I then re-organized these elements based on their priority.
Please refer to the details below for a comprehensive list of changes.
We decided to move the paid promotion elements out of the submission flow because, as a financial commitment, lingering on this step could discourage users from completing their tool submissions. Instead, we relocated these elements to the account management page, where we have more space to showcase what the paid promotion entails.
Since some of the Priority 2 & 3 elements, such as creator's Linkedin link and Tool gallery, are less important and requires more preparation time, we decided to place them in a second-level menu, accessible via a accordion link. This allows users who wish to promote themselves to fill in these fields, while others can save time by skipping them.
We decided to remove the "Feature highlights" element, as most users included this information in the "Description" field, making it redundant.
With Priority 0 (P0) elements established, we decided to place them on the first page of the form. For users who are not logged in, the first page prompts them to log in or sign up. Being logged in allows us to pre-fill some of the creator's information, reducing the effort required for submission.
Logged-in users can proceed directly to enter tool's basic info.
We introduced a "save progress" button to give users the freedom to complete their submission at their own pace. Now when users encounter fields that require preparation time, such as demo videos or media gallery, they can save their progress and return later when ready.
After redesigning the information architecture, we implemented it with a refreshed design.
During design reviews, teammates noted that while the layout is easy to implement on mobile, it may not use space efficiently on desktop. This could lead to users missing fields or overlooking the "Next" button at the bottom.
Incorporating feedback from design reviews, I refined and improved the previous design.
To reduce confusion around certain fields, we implemented various forms of assistance to guide users and help them complete the form smoothly.
Through our previous interviews, we discovered that most of the confusion occurs when users fill out the additional information for their new AI tool on page 2.
Based on previous interviews and user needs, we identified two key goals for effective assistance.
1. Communicate purpose
Ensure each form field clearly conveys its intent, helping users understand what information is needed and why it's important.
2. Demonstrate previews
Demonstrate how the submitted information will appear, reducing uncertainty and improving confidence during the process.
Through brainstorming, I identified three ways of offering assistance.
Proposal 1: Placeholder text
Provides brief, inline guidance directly within the input field to indicate the expected type of information.
Proposal 2: Text hint
Offers additional context or clarification above the input field to help users understand what to enter.
Proposal 3: Tooltip
Displays supplementary information when users hover over or click on an icon, offering more detailed guidance without cluttering the interface.
We carried out stakeholders discussions for the three plans.
Text hints provide the best tradeoff by offering constant guidance without requiring extra interaction. They remain visible, ensuring clarity while maintaining usability across devices. But some also favored tooltips because they provide clear, detailed explanations, often paired with images to make complex fields easier to understand.
In that case, we decided to combine both approaches. For simpler fields, we’ll use text hints for quick and easy guidance. For more complex fields, like “gallery,” we’ll use tooltips. Instead of an icon for tooltips, we’ll use a text link such as “What is this?” that shows a rich media hint when hovered or tapped. This approach makes it easier to tap on mobile and more accessible for screen readers.
After finalizing the direction with approach #2, I proceeded to design the high-fidelity version and conducted a usability test.
Test setup
The general consensus from usability testing and interviews was positive, with only a few minor adjustments needed to improve the overall experience.
During user testing, while the majority of users successfully navigated the submission process, a few participants mentioned that the abstract nature of the previews made it difficult to envision their tool's final presentation. To address this feedback, we added a final preview step showing exactly how their tool page will appear when it goes live.
We added the "Product Hunt page" field based on user feedback, as they often have this page and wish to promote it.
(if users were not logged in)
(if users were logged in)
One key takeaway from this project is a deeper understanding of form design itself. I always knew it was more complex than it seemed, but now I understand why. Especially on desktop, factors like layout, reading order, and reducing users' cognitive load play a significant role in creating an effective form. I'm grateful for this experience and proud to have designed a form that brings real value to the company.
By combining text hints for straightforward fields and rich media tooltips for more complex ones, I learned how to balance clarity with simplicity to enhance user understanding without overwhelming them.
Product design / Web / Contract
Product design + Design research / iOS / Contract