Intuitive salary benchmarking for Compiify's HR platform
My Contribution
1. Delivered MVP design of salary benchmarking, streamlining employer decisions with intuitive, real-time filtered comparisons.
2. Conducted generative user research and competitive analysis to enhance usability.
2. Conducted generative user research and competitive analysis to enhance usability.
Team
C-Suite
1 Product Designer
3 Engineers
1 Product Designer
3 Engineers
Impact
35% fewer errors and 13% faster completion via new salary benchmarking tools.
May - Aug 2023
Stride (formerly Compiify) is a compensation platform built for HR teams.
Stride empowers companies to make fair and competitive pay decisions for top talent attraction and retention.
In the summer, I focused on developing a salary benchmarking feature within the Benchmarking category, essential for maintaining market competitiveness.
In the summer, I focused on developing a salary benchmarking feature within the Benchmarking category, essential for maintaining market competitiveness.
Salary benchmarking is complicated and confusing
context
Complicated Data
Salary benchmarking is complicated by fragmented and often outdated data from various sources. This inconsistency complicates the benchmarking process.
Confusing User Experience
Salary benchmarking is hindered by outdated systems and complex spreadsheets, making navigation and interpretation confusing and overwhelming.
Shipped Swift Filtering & Seamless Comparing.
solution
Streamlined selection and comparison processes.
I reimagined the salary benchmarking user flow to streamline selection and comparison processes.
The data is now organized within a well-structured information hierarchy and presented through a mordern, high-contrast, and accessible interface, enhancing user engagement and comprehension.
The data is now organized within a well-structured information hierarchy and presented through a mordern, high-contrast, and accessible interface, enhancing user engagement and comprehension.
Understanding the domain through competitive analysis.
competitive analysis
Strengths of our competitors.
Clear separation of functions like retrieval, filtering, and export makes data easy to find, while diverse visualizations like charts and heat maps enhance intuitive understanding. Subtle cues provide additional insights without cluttering the interface.
Clear Hierarchy,
Streamlined Navigation
Streamlined Navigation
Multi Data Visuals,
Enhanced Understanding
Enhanced Understanding
Subtle Design Details,
Richer Insights
Richer Insights
Limitations of their solutions.
The platforms present data in various data visualization methods but without a cohesive link between them. Also, while the platform offers depth in individual data sets, it falls short in straightforward comparisons.
New data visualization = New tab
Can't compare different data in the same tab
Interview stakeholders to understand their needs.
interview & synthesis
I conducted interviews with test flight users to understand their needs and thoughts. Below are the insights derived from these discussions.
Synthesis: from user needs to design opportunities.
I've chosen to utilize a 2x2 mapping to strategically assess our feature priorities. By plotting the novelty of a feature against our developer bandwidth, we can make informed decisions about where to allocate resources. From a product designer's view, we have selected the three top-priority needs for the design and iteration of the MVP.
Information Architecture and Low-Fi Sketching.
ideation
Information architecture
User flow
Layout explorations
We explored 8 different layouts for four information sections: filter selection, bands info, salary table, and chart.
Data stack form testing
Comparison is central to salary benchmarking. We explored various layouts to effectively stack and present data, aiming for readability.
Low-Fi Detailing
With the two selected layouts, we designed more details and zoom-in view to have a sense what it would be look like.
Wireframing based on selected layouts.
testing & Refine
Low-fi Prototype 1 ❌
We crafted the filter bar and data view sections. However, the two data visualizations lack a cohesive connection, and the left-to-right transition isn't intuitive.
Low-fi Prototype 2 ✅
In the second layout, we integrated the filter bar with the display panel. Now, adding a comparison is as simple as clicking an 'add' button, which brings up the filter section. The two data visualizations are presented side by side.
Iteration based on user testing and feedback.
iteration
A1. Charts Merging
The two data visualizations are presented side by side, merging the headings could enhance clarity.
A2. Zebra Striping
By alternating row colors, we ensure users can easily differentiate and track information across columns.
A3. Highlighting
The highlighting box draws attention to priority information amidst dense content.
A4. Visual Assistance
Guide users' eyes when comparing multiple data points, aids in contrasting information.
B1. Overlay Filter
The filter panel enables adding comparisons during salary benchmarking.
We tested vertical and horizontal layouts to optimize accessibility and readability.
We tested vertical and horizontal layouts to optimize accessibility and readability.
B2. Hover Details
Hover details are categorized into data from our company and the comparison company.
Our company's data highlights salary band details and distribution, while comparison data emphasizes reliability, sample size, and fit quality.
Our company's data highlights salary band details and distribution, while comparison data emphasizes reliability, sample size, and fit quality.
MVP benchmarking delivery
final design
Cohesive Data Presentation
The final MVP features cohesive data presentation, seamlessly combining tables and range charts to simplify data retrieval.
Swift Filter Selection
A key feature of the MVP is the streamlined filter selection, which clearly distinguishes parameters, removes redundancy, and improves data readability—enabling users to make data-driven decisions with ease.
Subtle Hover Details
The MVP uses subtle hover details to showcase salary bands for internal data and confidence levels for external data, improving usability and boosting trust in the information presented.
