A lively and diverse city, historic North Charleston wanted a campaign that reflected its vibrant atmosphere and signaled that it’s a worthy destination in its own right. As a result, I developed this colorful, eclectic map illustration that highlights the unique features of the city. Our campaign presented North Charleston as a hub from which nearby downtown Charleston, Mount Pleasant, and West Ashely are accessible, but also highlighted some of the fun and exciting aspects that make the city stand out.
Fetcher
Enhancing user satisfaction and task efficiency through the redesign of the Fetcher extension
Fetcher is a SaaS company that assists recruiters and companies in identifying and sourcing ideal candidates. Utilizing artificial intelligence, Fetcher identifies suitable candidates and then includes a human verification step to ensure an accurate match. Once suitable candidates are identified, Fetcher then sets up a system of automated email touch-points, freeing clients to focus on relationship building and prioritizing communication with their prospective candidates.
Overview
Fetcher's extension, while functional and capable of fulfilling its intended purpose, faces a significant user problem resulting in widespread dissatisfaction. Numerous users, both new and experienced, struggle with understanding the extension's flows, encountering unfamiliar terminology, and relying on trial and error to navigate its functionality effectively.
Team:
Jasmine Agosti, Hillary (Sr. Product Manager), Chris (Chief Product Officer)
My Role:
Lead Product Designer
Tools:
Figma, Figjam, Jira, Pen and paper
Goals
Streamlined Workflows:
Fetcher's extension aims to streamline and simplify tasks, eliminating unnecessary steps and enhancing overall efficiency for users. By reducing complexity, users can complete common actions more quickly and with fewer barriers.
User-friendly Interface:
Fetcher prioritizes a user-friendly interface that is intuitive and easy to navigate. By designing an interface that is accessible and visually appealing, users can have a positive experience and easily understand how to maximize the extension's capabilities, reducing the learning curve for new users.
Error Prevention and Handling:
Fetcher is committed to preventing errors and handling them gracefully when they do occur. The extension provides informative error messages that guide users in resolving issues effectively. By addressing errors in a user-friendly manner, Fetcher helps users avoid frustration and minimizes the time spent on troubleshooting.
Discovery
In collaboration with Senior Product Manager, Hillary, interviews were conducted with 10 clients who use the Fetcher Extension. Open-ended questions were asked using Google Meet to gain a comprehensive understanding of the users' perspective, comprehension, usage, challenges, requirements, and desires for the extension. Detailed notes were taken, quotes were collected, and users' behavior was observed as they demonstrated pain points and navigated the extension. Additionally, users occasionally shared competitor features they would like to see incorporated.
Participants
1O Clients
Conditions:
Moderated Google Meet
Method:
Open-ended qualitative questions
Design
Fetcher, as a company, relies on Figma as its primary design tool. We are equipped with a versatile design system that caters to both internal and external applications.
However, when faced with the challenge of adapting Fetcher's web-focused design system to the extension, we approached it head-on with unwavering determination. I eagerly embraced the exhilarating task of redesigning numerous components, embarking on a thrilling journey of exploration. With each deep dive into the intricacies, I discovered hidden possibilities and infused our cherished components with a refreshing touch of modernization. The process was nothing short of transformative, igniting personal growth and a profound sense of fulfillment.
As I honed my skills in the art of reconfiguration, I breathed dynamic new life into Fetcher's extension design. The result is a design that exudes innovation, setting Fetcher apart from the competition.
Testing
To validate our designs, we conducted testing with the following goals:
Usability testing with A/B testing:
Testing the red routes to evaluate user success and performing A/B testing to determine the most effective prototype.
A/B preferences:
Gaining insights into user preferences and comparing them with actual performance in the usability test.
Usability Testing
To validate two different hypotheses of successful minimum viable product (MVP) designs, we conducted A/B testing.
Prototype A: designed and hypothesized by Chris (CPO)
Prototype B: created by myself, was tested.
Our objective was to assess the success rate of specific MVP features on both prototypes. Additionally, we asked open-ended questions to gain insights into the decision-making process of the users and understand the reasoning behind their choices.
MVPS/ Red Routes
1. Save the profile’s LinkedIn PDF to Fetcher Extension
2. View Email Address
3. View Profile History
4. Add Profile to Fetcher
5. Send Email/Contact Candidate
6. Vetting Candidate
A/B Preferences
To gain subjective insights from the users, we presented them with a side-by-side comparison of the two options. By visually highlighting the differences, we aimed to facilitate a rational and thoughtful evaluation of their preferences. This approach allowed us to understand the users both subjectively and objectively, gaining a comprehensive understanding of their preferences and thought processes.
During the evaluation, the users voiced their thoughts aloud, enabling us to grasp what aspects resonated with them and what did not. This valuable feedback allowed us to discern which elements were effective and which required improvement, ensuring that we gained a clear understanding of their perspectives.
List of A/B Preferences
1. Location of instruction to upload a profile
2. Button and instructions to upload a profile
3. Email CTA
4. Transfer Profile to Fetcher
5. Layout
Testing Results
After conducting A/B testing and usability testing with six clients/testers, we gained valuable insights into their needs and preferences. Through usability tests, we observed their behavior, insights, and expectations. They also provided subjective feedback by choosing between the A and B preferences. While there were some initial disconnects between perceived superiority and functionality, most testers' preferences aligned with their successful completion of the MVPs.
Usability Testing Results
During the usability testing, we discovered that three out of the five minimum viable product (MVP) features were not successful, while the remaining two were. To gain insights into the reasons behind these outcomes, we asked follow-up questions to understand why the unsuccessful MVPs presented challenges for the users. Conversely, we analyzed the factors that contributed to the success of the MVPs to gain a deeper understanding of their effectiveness
A/B Preferences Results
The unanimous preference of all users was Prototype B over Prototype A. Through careful analysis of the A+B preferences and user feedback, I gained a clear understanding of the reasons behind their choices. It became apparent that users favored assets that were clear, bold, and simple, aligning with their design preferences. Additionally, users expressed the desire for a consolidated selection of criteria in a single, easily accessible location, as opposed to being scattered across different areas
Final Design
After carefully examining the test results, we identified areas that needed improvement. As a result, we made significant changes to the Fetcher Extension in order to achieve our goals. These key modifications were implemented.
Fetcher Intro:
In order to enhance usability, we prioritized placing the instruction directions at the top of the extension instead of burying them under the keywords tab. This change was implemented to ensure easy access and clarity for users.
Background:
During our evaluation of the former extension and the prototypes we tested, it became evident that users were struggling to identify the initial steps and comprehend the instructions. To address this issue, we recognized the importance of incorporating a prominent contrast color in the background, coupled with the relevant text, to direct users' attention effectively. By implementing this solution, we aimed to provide a clear visual cue for users to easily identify and focus on the desired instructions.
Hover over vs. Modal:
Incorporating clear and concise instructions, we introduced an instructional hover-over above the disabled button. Initially, we considered utilizing a modal with a graphic, but given recruiters' emphasis on speed and efficiency, we prioritized streamlining the process and minimizing unnecessary steps. Therefore, the instructional hover-over was implemented as a more effective solution.
Email Button Dropdown:
In the initial version of the extension, a single button labeled "Email" lacked contextual clarity for users. To address this, we introduced a dropdown menu with multiple options. Through user feedback, we found that "Email Now" was the preferred choice, aligning with users' primary needs. However, we also included additional options in the dropdown to accommodate diverse preferences. Notably, during testing, all users unanimously expressed a preference for this revised approach over the original single-button design.
Terminology:
To ensure clarity for users, we made terminology changes across the Fetcher extension. We replaced "Matches" with "Keywords" to accurately represent word matches between LinkedIn profiles and job criteria, as validated by user feedback. Additionally, we switched from "+Add Profile" to "Add to Fetcher" to clearly indicate that a profile had been added to the Fetcher. These adjustments were implemented based on user validation and aimed to enhance user understanding and provide a more intuitive experience.
Add to Fetcher Flow:
In the previous extension, users were required to use their leads (currency) to view candidates and determine their suitability. In the updated version, we reversed the flow to allow users to assess the candidate's compatibility before utilizing their leads. This new approach allowed users to determine if it was a good match before investing their leads to contact the candidate. Feedback from users indicated that they preferred this revised flow compared to the previous method. By prioritizing the evaluation phase before lead expenditure, we aimed to enhance user satisfaction and optimize their decision-making process within the extension.
Communication Status:
Previously, users had to access different statuses of their communications with candidates through a web browser, which required navigating away from the extension. To improve convenience and accessibility, we implemented updates within the extension itself. Users can now view and access all communication updates with candidates directly within the extension, eliminating the need to switch to a separate web browser. This enhancement allows for a more streamlined and efficient workflow, providing users with immediate access to the latest information on their candidate interactions without any additional steps.
In summary, these were the key changes we made to the extension, resulting in improvements to workflow, user-friendliness, and error prevention. Numerous additions were implemented, enhancing various aspects of the extension. We conducted a final testing round with a user, and all minimum viable products (MVPs) achieved a 100% success rate. Currently, we are actively collaborating with the engineering team to implement these changes.