Sr. UX Designer, Product
WorkLLama
AI-Driven Unified Talent Acquisition Platform
Team
Overview
WorkLLama set out to revamp its product UI with the primary goal of improving usability and visual appeal for both business customers and end-users—primarily job candidates.
As the Senior Designer for Product, Brand & Strategy, I collaborated with a design team to create a comprehensive, scalable design system for WorkLLama’s suite of white-labeled products: the Enterprise Portal, Candidate Portal, and Branded Career Sites. This project was aimed at delivering a consistent user experience across all platforms, simplifying the implementation of custom themes, and supporting B2B2C adaptability
Discovery & Research
Customer Interviews & Market Research: To ensure that the design system met the needs of all stakeholders, I conducted customer interviews and analyzed market research across WorkLLama’s primary verticals. This allowed us to identify key differences in user behavior and requirements based on role, motivations, compensation models, and job lifecycles.
User Personas
Developed talent personas for primary user categories, using real data points. Each persona was accompanied by a sample UI component (e.g., job card) to align user needs with design solutions effectively.
Talent Personas and User-Centric Insights
Personas highlighted distinct motivations and needs across job lifecycle stages, helping to tailor the design system to support relevant user flows and enhance usability.
These personas served as a foundation for crafting modular, flexible UI components that could accommodate variations in candidate experiences and job-seeking motivations.
User Persona
User interviews
User Surveys
System Structure & Transition Xd to Figma
System Transition: Initially, the design team used Adobe XD, but we identified the transition to Figma as an opportunity to unify our workflow and leverage Figma’s collaborative features.
Design System Architecture: The Figma design system was structured into extension files and partials representing different inheritance levels. This setup enabled us to maintain a single source of truth for base components while allowing product-specific variations for B2B and B2C applications.
Component Libraries and Inheritance
Base Components: We created a core library with foundational components used across all platforms. Each product had its unique set of components that extended the base library, supporting the specific needs of either business customers or job candidates.
B2B vs. B2C Customization: This hierarchical structure allowed for easy customization and ensured consistency across white-labeled products. For example, the Enterprise Portal could inherit base styles while using B2B-specific components.
Documentation & Client Customization
Client Style Guide: Auto-Generating Custom Themes
Client Tier Customization: The design system included a Client Style Guide page, which allowed business customers to generate customized themes. This was achieved through auto-generated color palettes and brand assets within Figma components.
“Start Here” Page: A dedicated “Start Here” page in Figma provided a straightforward entry point, linking to customizable placeholders for client-specific branding.
Comprehensive Documentation and Consistency Matrix
Documentation Matrix: As components were developed across products, the team cataloged them in a matrix to ensure consistency. This matrix allowed designers working on different products to collaborate and align styles and functionality.
Shared Communication Channel: We established a dedicated communication channel for sharing updates as the system evolved. This channel facilitated collaboration across product managers, developers, and designers, ensuring everyone had visibility into system changes and progress.
Key Features
AI-Powered Chatbot Design and Implementation
Objective: To enhance candidate engagement and automate common tasks for recruiters, we integrated Sofi, an AI-powered chatbot, into the Candidate and Enterprise Portals.
Conversational Design: I designed intuitive, conversational flows to support job discovery, application assistance, and FAQs. Sofi’s interface allowed candidates to engage seamlessly with the system, while recruiters could focus on higher-value tasks.
User-Friendly Interface: Sofi’s design prioritized simplicity and accessibility, making it easy for users to interact and navigate through the AI-driven assistance.
Implementation and Iteration: Conducted several rounds of testing and iteration based on user feedback to ensure the chatbot was accessible, easy to use, and valuable for both candidates and recruiters.
Reusable Design Components
Building Blocks for Efficiency: The design system featured a library of reusable components, such as job cards, navigation bars, and form elements. This significantly reduced the time-to-market for new features by enabling quick assembly and customization.
75% Reduction in Time-to-Market: With reusable design components, our product team achieved a 75% reduction in time-to-market for new features, resulting in greater efficiency across development cycles.
Accessibility & Inclusive Design
ADA/WCAG Compliance: I ensured all components adhered to ADA and WCAG standards to promote inclusivity. This included accessible color contrasts, larger clickable areas for mobile users, and support for screen readers.
Proactive Accessibility Testing: Each component underwent accessibility testing to identify issues early, allowing us to address them before release. This not only improved usability but reinforced WorkLLama’s commitment to inclusive design.
Key Takeaways
Power of Collaboration Across Teams: Early and continuous collaboration with product managers, engineers, and stakeholders helped align on solutions that balanced user needs with technical feasibility.
Inclusive Design as a Core Principle: Ensuring accessibility at every stage resulted in a product that was both inclusive and user-friendly, underscoring the value of proactive accessibility efforts.
System Thinking for Long-Term Scalability: The modular, component-based design system facilitated rapid product development and scalability, enabling future growth and innovation without sacrificing consistency.