pathfinder
Leveraging AI for instant career insights for students and career switchers
Role
UX/UI Designer
Timeframe
2023-2024 (4 months)
Team
2 Designers
1 Product Manager
6 Engineers
TLDR
PathFinder is an early-stage startup on a mission to improve transparency in career paths for students and career switchers transitioning into or starting a career to pursue their passions.
As a UX/UI Designer, I spearheaded the redesign of the landing page and integration of generative AI to encourage people to visit the site and increase product awareness.
After a month of launching the generative AI feature and the redesigned landing page, it resulted in 100+ sign-ups, an 80% satisfaction rate, and a 40% click-through rate for using the generative AI feature.
100+
Customer sign-ups
80%
Satisfaction rate
40%
Click-through rate
problem
PathFinder has a 19% clickthrough rate on the searchbar, consumers were confused about what the site is about when landing on the page, and some of the colors don't meet the WCAG 2.1 AA standards
Solution
Introducing to our new generative AI feature and redesigned landing page. With this feature, students and career switchers can ask career questions and receive insights instantly to save time and get a feel that this is a new product compared to the previous design
constraints
What are the constraints?
⚛️
No design system
PathFinder had no design system and the designs were not WCAG 2.1 AA compliant.
⏱
Time
Working through an Agile process requires us to consider a tight deadline and narrow down the scope.
💸
Budget
We had to design and develop our solutions with a limited budget as we are an early stage startup.
research
Students and professionals find a lack of content on the site and were confused about what it is about
PathFinder’s low product market fit led me to conduct 5 interviews with tech students and professionals to learn about their career paths, issues with the site, and how we can increase engagement. Here are the findings from research:
🤔
Students and professionals were confused about what the site is about when they landed on the homepage.
🧭
Students and professionals still need more career guidance through their career journey.
🫤
When going through the site, they want to see more posts about the professionals career experience.
💰
Students refuse to pay for premium plans for a high cost to upgrade to unlimited features.
ideation
Prioritizing generative AI and landing page redesign to achieve its product-market fit and increase engagement
From our research insights, my team and I discussed solutions to increase engagement and make PathFinder a valuable product. With the rise of AI and narrowing the scope of feasible features for the engineers within the timeline, we decided to redesign the landing page and integrate a generative AI feature.
Design iterations
Evaluating Generative AI and Landing Page Effectiveness
The designer and I began with design iterations through moderated usability testing and user feedback via Zoom on high-fidelity prototypes to validate whether the design was easy to use, observe any confusion, and align with the team’s requirements before launching the product. Doing these methods on high-fidelity prototypes will help give consumers a feel for a launched product. Here's what I learned from usability testings:
Landing page: Showcase how the generative AI works for more clarity and the rest of the websites' features
Generative AI: Be clear on how the generative AI feature would work by its visual design
DESIGN handoff
Scrutinize the design to foster smooth engineering collaboration
As we are improving the visual design and creating new components, I kickstarted documenting design specs through Figma to leverage Figma's new component properties to speed up the process and foster smoother engineering collaboration.
final DESIGN
Where we landed: Providing AI-driven and personalized guidance for career path navigation
Students and tech professionals can now ask career questions with our generative AI feature to get answers, sources, and view professional's stories instantly that are relevant to the question to save time.
RESULTS
100+ number of sign-ups
The introduction of the chatbot led to over 100 sign ups, highlighting the effectiveness of using the instant, accessible support in enhancing customer loyalty.
80% satisfaction score
From usability testing, consumers were satisfied with the generative AI's, resulted in high customer satisfaction score.
40% click-through rate
The integration of generative AI demonstrated that consumers were using the generative ai feature more than the previous search bar.
REFLECTION
Consider using other Figma features to speed up the design process
When the designer and I were designing screens, we discovered that using Figma's features, auto layout and components helped us to design faster than without using them.
Understand how generative AI works behind machine learning
One of the challenges I faced was understanding how AI works, as this is my first time designing generative AI. From my product manager who has a background in machine learning, it is important to consider the queries from the existing stories of the professionals’ career experiences.
