Payroll Ecosystem Redesign

Stabilizing the backlog of pay-related issues impacting federal employees

Client
Federal Government of Canada
Role
Product Design Lead
Duration
Mar 2019 – Jan 2021
Solution
Web Application
GenAI Chatbot & Search Tool
Cloud Platform Automation

Overview

Existing systems have caused thousands of delays and inaccuracies in pay and benefits for the government of Canada. At IBM, I helped design MyGCPay, a web-based ecosystem addressing these issues.

Design Challenge

1) Design an experience for pay error identification
2) Offer a simple view of HR and pay-related data
3) Consolidate valuable data from legacy systems

Responsibilities

I was initially onboarded to improve the pay info dashboard. My role evolved to lead designer and I managed the design direction across other product areas: Manager Dashboard, HR Systems Integration, Virtual Chat & Live Agent Support, AI Policy Search Engine.

Design & Strategy Team

Liam Lawlor, Lindsay Reynolds, Julie Bock, Nour Al-Safi, Laila Abou

the Pre-work

We tackled the pay issues from a human-centred data perspective. The project scope was initially ambiguous and required groundwork. We got our hands dirty working with messy data.

01
Research
  1. Stakeholder interviews across 5 federal departments

  2. Conducted 154 contextual inquiries with public servants

  3. Developed 6 personas based on research insights

  4. Conducted ongoing usability studies

I conducted ethnographic observations of various federal employees in their workflows by capturing data from disparate systems and mapping them to specific actions.

02
Strategy
  1. Faciltiated workshops with business and technical teams

  2. Developed a roadmap based on prioritized user stories

  3. Drafted service blueprints for relevant product areas

Held after in-depth departmental interviews, organization-wide workshops helped bridge silos by uncovering information flows and gaps in interdepartmental relationships — as well as aligned stakeholders on key pain points.

ONGOING
analyzing systems data

I collaborated with data scientists to contextualize and refine raw pay and HR data from disparate systems into a usable state. This required answering the following questions: How was this data being used? What's missing? What systems were involved? This process was important for capturing both technical and design requirements.

A data architecture diagram was made to visualize the data requirements for each wireframe of the manager dashboard, which involved building data pipelines and developing the backend system.

pain points

Our research revealed a domino effect: pay issues trickled downstream starting from managers to pay triage agents.

1. Silos and disparate employee data

Managers have limited insight into job records. Errors were a result of incomplete information across disparate systems from the manual compilation of contract details and pay data. Silos across organizations and systems exacerbated these issues.

2. Lack of transparency & issue tracking

Employees and their managers couldn’t see compensation in advance nor track the status of an open pay issue. Employee calls to the help desk overwhelmed staff.

3. Complicated policies & procedures

Pay triage agents strenuously navigated pay and HR-related documents, including policies and procedural forms.

SOLUTION: at a glance

There was a lot of problem-solving — but to keep things simple, here is a summary of key experience upgrades:

employee & manager dashboards

Dashboards showed aggregated views of total pay across acting roles and a historical view of pay slips. This eliminated manual labour for managers and provided transparency to employees.

Streamlined Pay Escalation

We reworked the escalation process to provide smoother hand-off of pay cases. Employees can monitor open cases through self-help features. Call staff had access to drill-down pay data to contextualize and create a ticket.

AI-powered procedural support

We built an AI search engine powered by Watson to support HR and pay triage teams find relevant policies, forms, and instructions within their internal help hub.

ITERATIONS

Data visualization was not always smooth sailing — in fact, I encountered technical challenges that required brainstorming, iteration, and negotiations with developers.

EXAMPLE
Optimizing keyboard accessibility
Before

We initially used a table layout for the pay history to improve accessibility, but screen readers read out too much information at once without a clear hierarchy.

After

To address this, we switched to a list format, allowing users to tab through each paystub individually before hearing its associated details.

The numbered sequence below shows the order in which users can navigate the content using the "Tab" key and how it is read by a screen reader.

Before
After

Impact

MyGCPay contributed to ongoing efforts of preventing and resolving pay issues within the public service sector

Estimated Benefits
  • 10-15% reduction in pay issue tickets

  • 30% increase in pay case processing

Accomplishments
  • Successful roll-out to 300,000 federal employees

  • Repurposed data from a shelved project and turned it into a 0→1 design project

  • Most importantly, support from users!

Positive feedback
kept us going!

After the first roll-out, MyGCPay was met with a lot of buzz. We received over-pouring support from both users and leadership.

We could not have done it without the trust and collaborative efforts of our public servants.

(NEXT PROJECT)

Grocery Website redesign