HR dashboard
Global tech companies trust Ravio for real-time total reward benchmarking, market trends and compensation management.
I was responsible for designing Ravio’s first overview dashboard; a central hub for HR leaders to quickly assess overall company performance, track key metrics, and ensure their employee data was up to date and seamlessly synced with Ravio. From a business perspective, the dashboard also served as a strategic tool to showcase our suite of products, drive engagement across the platform, and create upsell opportunities.
Hypothesis: Providing users with an overview of their company performance will decrease time to realise value and increase usage of the whole Ravio platform.
Year: 2024
Role: Sole Product Designer (UX/UI) covering the full end-to-end process
Team: Product Manager, 4 full stack engineers, Customer Success Manager and Head of Sales.
Company: Ravio - Seed Stage Start-up in HR tech
Starting with an idea
Our founders envisioned an overview dashboard for Ravio, telling us, “Ravio needs a dashboard—let’s build an overview dashboard.” With this being a solution, and not the typical problem to solve, our Product Manager and I saw an opportunity to explore the core needs behind this idea:
1. What problems can a dashboard solve for a HR leader?
2. What are the main use cases for dashboards today?
3. What examples can we find of HR dashboards?
Uncovering problems to solve
To try to answer our initial questions I conducted interviews with customers, and our Customer Success and Sales team. Here are some of the key insights:
-
Customers don’t know how their overall company is performing against the market for employee compensation or how to diagnose compensation issues
-
Customers land on the base salary benchmarking page when they first login and don’t often explore the rest of the platform
-
Customers are unsure when their employee data was last refreshed in Ravio
-
There’s not enough time in a first Sale demo to showcase all our products
-
Customers are not inviting colleagues to join Ravio
-
Only a small percentage of customers have provided variable and equity compensation data to Ravio.
Ideating dashboard structure and layout
Building on my research into core use cases of existing dashboard products and the problems we identified, I began ideating with a focus on structure and layout. I shared these early concepts with the team to gather feedback on feasibility and align on the project’s design direction. Key takeaways from our discussions:
-
Since this was an MVP, engineers favoured a simplified card or module-based design for easier implementation.
-
Structuring the page into clear sections made it straightforward to organise different content types
-
Exploring ways to display account progress and highlight key insights was seen as a valuable addition.
Evolving content for early feedback
Collaborating with our Product Manager, we focused on defining the content, particularly how to present aggregate views of company performance for our key products: market comparison, band placement, and pay equity. We identified core metrics most relevant to HR leaders—number of employees, attrition rate, and hiring rate. Addressing the common pain point of customers lacking visibility into their data sync with Ravio, we also introduced an integration health status as an essential feature.
With these ideas in mind, I began wireframing, continuing to explore modular layouts as agreed. This process led to three wireframe designs for testing:
-
Design A – Metrics with small visualizations and a prominent left-hand panel.
-
Design B – Account progress-focused, leading with metrics and contextual insights.
-
Design C – Two sections (Your Company and Getting the Most Out of Ravio) with larger visualizations.
Here were the key feedback themes:
-
Preference for larger visualisations – Dashboards with larger visual elements felt less overwhelming and were easier for customers to engage with.
-
Value of contextualised insights – Customers found insights intriguing and saw them as a helpful starting point for investigating compensation issues. They preferred insights to be placed within relevant sections of the dashboard for better clarity and usability.
-
Integration health noticed immediately – Customers quickly noticed the integration health section and highlighted how helpful this feature would be for them.
-
Strength of high-level metrics – The selected metrics resonated well with customers, providing clear and concise summaries of their performance.
-
Limited interest in account progress – Some customers felt this section was more relevant to Ravio than to them. As a result, dashboards where this was less prominent were generally favored.
-
Preferred layout with a large left-hand panel – Customers preferred a design that emphasized their company’s performance in the main section, as this was the most valuable information for them.
Modules and milestones
Working with our Product Manager and Engineering team, we prioritised key modules to develop for our MVP based on customer feedback:
-
Company metrics
-
Market comparison (visualisations, metrics & insights)
-
Band placement (visualisations, metrics & insights)
-
Integration health
-
Content centre (quick links to resources)
Discussing each of this individually, we soon realised the complexity of each module. For example, the integration health module alone required mapping four data integration types against five health statuses.
To manage this, I proposed breaking the project into key milestones, allowing us to tackle each module separately and deliver the dashboard incrementally. The team agreed, and we outlined milestones that accounted for cross-team dependencies.
Using principles to evolve the designs
In Figma I continued to evolve designs for each module and crafted a set of design principles to guide my work:
-
Scalability – Continue developing a flexible layout that accommodates future widgets without disrupting the overall structure or usability.
-
Consistency – Maintain uniform alignment, spacing, and styling to create a structured and cohesive user experience. Use the design system where relevant to maintain consistency across the platform.
-
Visual Clarity – Use visual indicators like colour, icons, and typography to guide attention and enhance data comprehension.
-
Brand Cohesion – Ensure all elements follow a consistent visual style, reinforcing usability and a polished look as the dashboard evolves. This was particularly important because we were linking to different parts of the platform.
This meant I was able to design the different states and content of each module and then finesse the UI further in terms of layout, colour and iconography when bringing them together to build the overall dashboard.
Creating a flexible insights system
With the positive feedback on the interactive insight statements, example “30% of your engineering team is paid below market target”, I began to refine this idea further. Working with Customer Success and Engineering we soon realised there were many factors to consider:
-
The numbers in the statements could be positive or negative.
-
Statements needed a neutral tone, as companies have different benchmarks for "good" or "bad."
-
We had data on departments, locations, levels, and roles—how could we craft flexible, interchangeable statements?
Given this was the first time testing these insights we opted to create statements which would work across multiple data sets, whilst still testing breadth of types of insights. From here I created a flexible Notion insights database, pairing with engineering to refine and simplify where necessary.
The solution
We built a flexible homepage dashboard MVP, with several widgets, which solved key customer problems by providing aggregate views of how employee salaries compare to the market and where employees sit within salary bands, as well as showcasing core metrics related to hiring and attrition.
The integration health widget helped identify previously undetected broken integrations, allowing us to resolve issues, enhance the customer experience, and improve real-time data accuracy. We also saw an increase in customers switching from manual to live integration.
Additionally, the Sales team found the new homepage dashboard valuable for showcasing the full scope of our offerings more effectively. By developing a scalable modular design this meant a month later we were able to easily add in widget for pay equity, allowing customers to see their overall gender pay gap.
With Ravio being a seed-stage start-up and this being the MVP of the dashboard I don't have any metric improvements to show you. Check out my Gousto Homepage Redesign if you'd like to see how I use data in my designs and track impact of design on business metrics.
More projects
Gousto
Homepage redesign
Redesign of the Gousto homepage to best showcase our choice and variety. Result was a 4.8% increase in overall sign-up conversion rate, generating £4.2 million profit over a year from sign-up.
