The goal was to connect HR operations: give employees, managers and HR partners a shared platform for requests, approvals and employee information.
- Company
- United Bank for Africa
Visit UBA (opens in a new tab) - Industry
- Banking, Enterprise HR
- Role
- Product Designer
- Tools
- Figma, Whimsical, Research, User Interview, Prototyping
- Team
- 3 product designers, 16 engineers, 1 product manager, 2 QA engineers
- Period
- January 2020 · 12 months
HR requests depended on fragmented Salesforce processes, paper forms, spreadsheets and email. HCMConnect brought employee self-service, manager approvals and HR administration into an in-house platform.
Impact TLDR:
- I contributed to the enterprise HR platform’s design, working with the wider design and engineering team.
- The platform served a workforce of 10,000+ employees and improved HR efficiency by 30%.
- The wider move to in-house automation contributed to approximately $960K in annual enterprise licence savings.
Why HR needed a new platform
HR business partners handled daily requests from more than 10,000 employees. Manual processing created delays, errors and backlogs. Even routine questions about leave entitlement or payslips required HR to find information spread across different sources.
The shift to remote work during Covid-19 made those dependencies harder to manage. Employees and HR partners were away from the offices, files and documents they relied on to complete their work.
HCMConnect became the shared place for employee management. The design had to connect the person making a request, the manager reviewing it and the administrator responsible for processing it.
Discovery and priorities
Discovery combined interviews with employees and HR business partners with a literature review. We examined how requests were raised, how information was found and how approvals moved between people.
What the research revealed
- Requests were handled manually
- Paper forms, Excel and Word carried the work. Email threads handled communication and approvals, making requests difficult to track.
- Employee information was dispersed
- Leave entitlement and payslip inquiries depended on data held in different places. Finding that information added to the backlog.
Define the platform around core HR needs
The information architecture grouped a broad set of HR modules by priority. Organisation design and core HR sat at the centre: structures, job descriptions, grades, the employee database, employee and manager self-service, and e-filing.
Performance, personnel and talent management formed the next group. Payroll, recruitment, manpower planning, training and alumni services formed the outer group. The priority map gave the team a common view of the platform’s scope.
Connecting the workflows
User flows made the transitions between employees, managers and administrators visible. They helped us identify gaps, discuss the process with engineering and align the interface with the APIs needed to support it.
Explore the process before refining the interface
Sketches and wireframes let us work through the HR sanctions journey before moving into detailed mockups. These artifacts show how the workflow developed from early ideas into structured screens.
Design and usability testing
The high-fidelity designs developed the two connected sides of HCMConnect: employee self-service and HR administration. Employees needed to find information and raise requests; administrators needed the detail and controls to review and process them.
Review each module with the people using it
After prototyping each module, we reviewed it with HR staff, administrators and selected employees over Microsoft Teams. Each module went through an average of two to three sessions before sign-off for implementation.
Feedback from those sessions led to iterations before handoff. Testing remained part of the module-by-module delivery process.
From design to delivery
The final designs connected employee-facing journeys with the corresponding administrative work. Onboarding, recognition and course requests sat alongside request validation, appeals and other HR processes.
Make the handoff explain the journey
Handoff files were arranged in flows, with connectors showing how screens related to one another. Notes supplied additional context so engineers could understand the behaviour as well as the final interface.
Visit HCMConnect (opens in a new tab)
Related UBA communication design
Results and recognition
- 30%
- Improvement in HR efficiency
- ≈$960K
- Annual enterprise licence savings
These were business outcomes of the team’s delivery. My contribution as a Product Designer covered understanding HR needs, workflow design, prototyping, testing and engineering handoff.
Excellent Project Delivery Award
“This letter serves to commend you for your immense contribution towards the delivery of the HR automation platform which is currently live and in use. This is a sterling achievement borne out of your dedication, result-oriented approach and willingness to go the extra mile to ensure delivery of all envisioned and ad-hoc requirements of the platform. You are therefore issued a LETTER OF COMMENDATION.”