Reimagine HR Client Onboarding Experience
My Role
Leading & executing on design
Team
Business Challenge
The existing onboarding experience, designed based on a Professional Employer Organization (PEO) structure, doesn’t support the setup of human capital management (HCM) capabilities, and has an outdated UI not matching the updated branding.
1 Designer Manager,
1 UX Researcher,
1 UX writer, 1 Product Manager,
2 Engineering Leads,
Customer Transition team
UX Outcomes
-
Established north star vision and the UX/UI framework of one unified onboarding experience for both PEO and HCM.
-
6.8/7 usability rating for prototype. Customer verbatim: “We’re sad we can’t use this yet!”
-
Influenced roadmap to enhance AI support and orchestrated onboarding platform.
Timeline
4 months, 2023 -2024
From the legacy hand-holding approach to a prompt-led, self-service experience with embedded guidance and contextual support that balances automation with personalized assistance.
Existing Experience
Legacy navigation requiring multiple redirects
Layer 1: Client access tasks and track progress on TriNet Platform.
Layer 2: For Company Setup, Benefits and Employee Entry, clients need to enter a separate site from the progress tracker.
Layer 3: Each CTA is linked to a screen with a subtask list. Clients will finally see the form by clicking Start.
Design Proposal
Upfront welcome page and centralized onboarding hub
Upfront Welcome Screen: After login, clients see a welcome screen with timeline and curated helpful information.
Onboarding Hub: A centralized dashboard with user-specific timeline, status tracking, and task access.
Flatter Navigation: Layers of navigational hierarchy are reduced by using accordions and "Hub and Spoke" pattern.
Enhanced Clarity: The process-heavy experience is made more tangible and realistic by giving specific timeline and prompts that set expectations.
Seamless Transition to Functional Platform: Client admins gain access to the platform after they complete core tasks. A consistent UI allows them to easily switch between dashboard and onboarding hub checklist.
Highlighted Progress towards Customer Goal: Clients see a preview of the important dates and know if they are on track.
Legacy setup flows lacking clarity
Stepper-based flows with contextual resources
Single-Column Form: Utilize the vertical real estate to give more space for side rail cards, as well as reduce clients' mental load.
Contextual Awareness: Add a stepper with task break-downs and an overall progress indicator to inform client of where they are and what to expect next.
Contextual Assistance: Curate helpful resources, UI copies, links, and tooltips in context to guide client towards making the right decision.
Progressive Disclosure: Break each task into clear, discrete steps and guides client through them one at a time. If a step requires more thought or actions, it's presented on its own dedicated screen.
Personalization: Ensure that client only see questions relevant to their specific situation by using conditional logic. The system can hide or show certain steps and info based on customer data and actions.
Manual data entry with little access to industry insights
Enabled data-driven decision-making
Benchmarking: For clients who are open to updating their Time-Off Policy, the tailored benchmarking insights enables them to effectively adopt best practices.
Same feature could be applied to Benefits Strategy Setup.
Intelligent Defaults: Time-Off types are defaulted to clients previous policies if they've uploaded during Sales. Smart recommendations are provided for clients without previous policies.
Missing in-context support during onboarding
Knowledge & Chat is only available from the main platform, not the Setup Site, because the existing experience assumes all clients have Implementation Managers who guide them throughout the onboarding.
Embedded Chat and AI Support to reduce friction
Integrated Communication: Client who sign up for self-service onboarding can easily find quick answers from AI-powered chat assistant or reach Live Support for supplemental assistance.
Project Kick-Off
Joining mid-discovery, I analyzed existing research including our UX researcher's shadowing of client onboarding sessions, tracking the complete journey from login credentials through payroll setup.
Knowledge Building: Through sessions with Implementation Consultants and Customer Transition teams, I gained end-to-end process understanding.
Data Analysis: I synthesized insights from customer satisfaction scores, verbatim feedback, and existing UX research to build a complete picture of the current experience.
Simplified PEO Client Onboarding Process
Competitive Research
With limited resources, I conducted strategic competitive analysis using public demos, customer reviews, and social media insights. I systematically compared competitors' features and workflows through Feature Mapping and UX Flow analysis, including mapping our current HCM client onboarding against PEO offerings.
I created a competitive audit matrix documenting findings and recommendations, which became the foundation for collaborative brainstorming with cross-functional teams.
Summary of Findings
HCM Competitors excel at simple, intuitive self-service onboarding with clear step-by-step guidance, though they may lack robust troubleshooting support.
PEO Competitors offer comprehensive setup with dedicated support but can be resource-intensive. Leading providers excel in automated data migration and streamlined workflows.
TriNet stands out through highly tailored, industry-specific solutions with personalized support and compliance-focused onboarding.
Research Challenge: Competitive User Interviews
We initially planned direct user interviews with competitor customers but paused due to legal/ethical considerations and difficulty recruiting participants with authentic onboarding experience.
We gained valuable competitive insights through our own customer interviews instead.
Learnings from Competitors
Experience Consistency
Client onboarding should seamlessly align with the main TriNet platform in functionality, navigation, layout, and messaging.
Customer Understanding
Gather customer insights at sign-up through targeted questions, enabling personalized onboarding experiences tailored to specific roles and goals.
Supportive/Educational Content
Provide contextual content including guides, demos, and instructional copy to help client administrators master the platform.
Customer-Focused Narrative
Frame each onboarding step around client value, demonstrating how completion moves them closer to successful platform adoption.
Contextual Communication
Deploy in-app messaging and contextual assistance to encourage engagement during critical onboarding moments.
Strategic Automation
Implement smart data entry automation to eliminate friction points while preserving manual input opportunities when needed.
Customer Buy-In & Preparedness
Clear communication about required procedures and regulatory compliance significantly improves efficiency and reduces frustration.
Up-Front vs Runtime Setup
Strike balance between comprehensive setup and streamlined efficiency, without creating tedious experiences.
Customer Interview
Our UX Researcher developed a generative research strategy through customer interviews.
As lead designer, I participated in strategy discussions, script refinement, and note-taking during sessions.
Research Questions:
-
What aspects of their recent TriNet onboarding experience succeeded or failed?
-
What would an ideal experience look like, and how could we bridge that gap?
Segmentation: We recruited customers across HCM self-service, HCM guided, and PEO groups, recognizing each segment's unique onboarding needs and behaviors.
Customer Painpoints
Expectation vs. Reality Gap
Clients encounter misalignment between sales promises and actual implementation timelines, often due to information gaps or personnel changes during handoff.
Process Ambiguity
Clients complete tasks without clear guidance about next steps, ownership, or timelines, leading to confusion and delays.
Product Knowledge Gap (PEO)
Excessive hand-holding during implementation leaves client administrators unfamiliar with core product functions during independent use.
Customer Desires
Data-Driven Decision Making
Clients want credible, industry-specific benchmarking information to make informed decisions about HR, payroll, and benefits configuration.
Prompt-Led Onboarding
Clients prefer system-driven, step-by-step onboarding that proactively guides them through required actions rather than navigating independently.
Short & Specific Trainings
Clients value concise, immediately relevant training over lengthy, generic sessions—preferring just-in-time learning for their specific needs.
Synthesized Opportunities
Clear Expectations & Transparent Communication
Bridge the gap between sales promises and onboarding reality through improved expectation-setting, shared timelines, and upfront communication about limitations.
Real-Time, Actionable Status Tracking
Implement comprehensive status tracking with clear task ownership and estimated completion times to guide clients through onboarding.
Progressive Learning & Self-Sufficiency
Balance implementation support with guided, in-app learning that encourages hands-on interaction while maintaining assistance availability.
Benchmarking Integration
Incorporate industry benchmarks and data-driven recommendations directly into onboarding, empowering informed configuration decisions.
Prompt-Led Experience Design
Develop dynamic, step-by-step guidance that prompts actions, explains responsibilities, and provides contextual support adapted to user progress.
Targeted Training Content
Create bite-sized, scenario-based training materials including tutorials and knowledge articles accessible on-demand.
Ideation
Based on the major personas and use cases for client onboarding, I created high-level flows for use in meetings to clarify questions and align the team on the scope of the design work.
In Phase I, I focused on establishing the structure and design patterns for both broader flows and per-step level, building on Company Setup flow - the first task in the checklist.
Usability Study
Recognizing that onboarding experiences impact customer success, we launched a moderated usability testing with clients onboarded TriNet within three months to learn:
-
The learnability and ease of use
-
Usability issues and areas of confusion
-
Comprehension of onboarding content
-
Initial user reactions and expectations
-
User preferences for design options
Prototype Development
Created interactive prototypes for concepts and key flows
Collaboration
Worked with UXR and writers on protocols & interview questions
Expert Input
Partnered with Customer Transition team for validation
Testing & Refinement
Conducted internal testing and multiple review cycles
Active Participation
Attended all sessions for observation and note-taking
Key Results
-
Average ratings of 6.8/7 for layout and functionality, 6.5/7 for content.
-
Strong preference for upfront welcome screens.
-
Universal appreciation for prompt-led flows and sidebar cards.
Impact
The concept received overwhelmingly positive feedback, with one participant expressing disappointment that they wouldn't experience the new onboarding flow.
This research provided crucial insights that informed design iterations and influenced other initiatives including AI-powered Chat Assistant and Service Colleague Experience projects.
Tested Version
Concept A: Upfront Welcome Page + Checklist Hub Page
Concept B: Without Welcome Page, Direct to Checklist View
Participants are given the options of A & B to compare
User feedback:
-
The welcome screen provides clear expectations and feels approachable
-
Love how concept B is consistent and task-focused, with less distractions
-
Time estimates and progress bar could be intimidating
-
Wordy welcome message
-
Resources card on welcome page not helpful
Success Message Banner
At that point, there's no clear usage guideline yet for success message component and interaction. I brought this use case to discussion with design system team and peer designers.
Peer feedback:
-
The full-width alert banner should be used for page-level success state.
-
The prominent color doesn't go along with the subtle color scheme
Centralized Chat & QuickHelp
Discoverability and interpretation of the floating button was an issue.
Participants loved the self-service QuickHelp, but had difficulty accessing it.
Design Iterations
Welcome Page + Enhanced Checklist View
I decided to keep the welcome page, and rearrange the checklist tasks in a timeline format that's easier to follow
Changes made:
-
Replaced irrelevant resources on welcome page with contact information of assigned support team
-
Highlight the important dates that client cares about most. Provide dynamic and personalized estimates
-
Emphasized progress and task status with colors and icons
Reinforced In-Context Success Message
I added an extra screen with success illustration and message inside the setup flow, along with CTAs that guide user to next steps.
After user clicking "Go to Next Task", they still see a success message but in a snackbar component, which goes away automatically.
Separated Live Chat & AI Assistant Placement
The team and I decided to create a new entry point for QuickHelp, separated from existing Chat button.
In first-time experiences, user will see a prompt introducing them to the feature.
QuickHelp will take the form of a virtual assistant, curating relevant knowledge and providing support.
User can get live support via the chat button or the quicklink inside QuickHelp.
