Otobong Okoko

United Bank for Africa · HCM Connect

Designing one HR platform for 20 countries

I led the design of HCM Connect, a 12-module HR platform for United Bank for Africa across 20 African countries. HR had run on seven disconnected third-party tools; HCM Connect rebuilt them as modules and added five new ones. While I was there, it reached 85% adoption across 20,000+ employees.

Key insight

Stakeholders expected to see solutions, not research decks, so I showed them working prototypes.

  • 85%employee adoptionAcross 20,000+ employees in 20 countries, during my time
  • 91%reconciliation automatedOf the 30+ hours a week HR spent reconciling systems by hand
  • 4 hourscompliance reporting timeCut from 3 days to 4 hours
Role
Lead Product Designer
Company
United Bank for Africa, in 20 African countries
Team
Cross-functional squad that grew from 15 to 23
Dates
January 2020 to November 2021

Project at a glance

My role

Lead Product Designer: UX and UI design, user research, the design system and managing the design team.

The team

A cross-functional squad that grew from 15 to 23:

  • Four design roles: me as lead, two junior designers and a content designer
  • Frontend and backend engineers
  • A data analyst, a QA specialist and a project manager

The bank

One of Africa's largest financial institutions: 25M+ customers (end of 2021), 20,000+ employees, in 20 African countries plus London, Paris, New York and Dubai. ₦3.19T gross revenue.

Timeline

  1. January 2020I joined UBA
  2. March 2020Project started
  3. August 2020First module live to employees, five months in; the other modules designed in parallel
  4. November 2021I left UBA
  5. Early 2022Full rollout completed; the wider team shipped the remaining modules

ChallengeThe cost of fragmentation

Every one of UBA's 20 African countries ran HR on the same seven third-party tools: leave management in one, recruitment in another. None of them talked to each other, and subscriptions and other costs kept building up without a single system. Seven separate licenses and the manual work around them weighed on a bank aiming to cut its technology costs by 35% a year.

The cost was only the visible problem. Underneath it were four failures:

  • No single source of truth: an employee's leave balance in one system didn't show in another, and a promotion in one tool didn't update the org chart elsewhere.
  • Every country ran as a silo, with its own workarounds, spreadsheets and processes.
  • No one at headquarters had a full picture of the workforce.
  • HR managers spent 30+ hours a week reconciling systems by hand.

I joined as the first lead product designer on the initiative. By my own assessment, UBA's design maturity was at Level 1: no established design processes, no design system and no history of user research informing product decisions.

Key figures

  • 7third-party HR tools, the same in all 20 countries
  • 30+hours a week of manual reconciliation
  • 35%UBA's annual target for cutting technology costs

Constraints

  • Organizational

    No UX culture to build on

    No shared vocabulary around UX, no feedback loops and skepticism about 'spending time on research.' I led the work of building trust in design thinking while delivering a product.

  • Technical

    20 countries, no shared architecture

    Each country had autonomy to build its own systems during commissioning, and no shared architecture connected them.

  • COVID

    Started as the pandemic began, March 2020

    I built remote research and collaboration workflows from scratch while keeping delivery on track.

ResearchHR needed unified data, with room for each country's rules

Research methods

  • 23stakeholder interviews I conducted with C-suite executives, HR managers and regional leads, across the 12 HR departments
  • 47employee contextual inquiries my team ran, mostly remote because of COVID-19
  • 12process mapping workshops we facilitated, documenting how HR actually worked day to day

All of the research took place in Nigeria. Competitive benchmarking covered BambooHR and Greenhouse.

Key findings

Unified data, not better tools

HR managers needed unified data, not improved versions of disconnected tools. Individual systems worked fine in isolation. They just never connected.

Regional flexibility required

Leave policies, benefits structures and workplace terminology all varied by country. Regional differences were standard operating procedure, and any rigid system would fail across borders.

Solution12 modules: seven tools rebuilt, five new

Each of the 12 modules handled one HR function, and all of them shared one design system, one authentication layer and one data model.

Turning point

The C-suite review of the Core HR prototype

Before

An executive who had been openly skeptical, and hadn't understood what 'design' could do.

What he saw

The Core HR prototype, clickable and working with real employee data.

His reaction

The organizational chart visualization alone would save his team hours of manual work every week.

After: that moment shifted the dynamic

  • Better attendance at stakeholder reviews
  • More engaged feedback
  • Faster decisions

Each prototype test became a proof point for the solution and for the idea that user-centered design could work at UBA.

Decision

Working prototypes, built alongside research

OverPresenting research findings and process flows

Stakeholders had no background in user-centered design and expected to see solutions. Working prototypes, built during research rather than after it, let them experience something concrete.

One platform for the whole employee lifecycle

HCM Connect covered the employee lifecycle in 12 modules, from Core Human Resource and Organisation Structure to Exit Management. Seven rebuilt the existing third-party tools; five were new. Confirmation Management, for example, tracked each employee's confirmation after probation.

I was involved in all 12, from research, user flows and user journeys to solution design. On some modules I handed the design to the other designers and focused on validation and critique sessions.

01 Hire02 Develop03 ManageSystem of record

System of record

Organisation Structure

Departments, units and reporting lines across the bank.

  • Shared by all 12
  • One design system, 120 components
  • One authentication layer
  • One data model
Reads the employee recordFeeds a people decision
The 12 HCM Connect modules along the employee lifecycle. Hire runs into HR Helpdesk, Develop into Organisation Structure and Manage into Exit Management; the three meet at Organisation Structure, which sits on the employee record in Core Human Resource. It plays through each module; pick one to stop on it for a moment.
Wide-screen layout on a lavender backdrop, cut off at the right and bottom: a dark left sidebar (Insights, Employee, Projects, Favourites, History) and a white header whose left part is blurred. Under the heading Recommended Pre-Defined Filters, six cards such as Top Performers, Most Skilled, Top Scholars and Polyglots each have a short description and an illustration; the three in the top row show red View links.
HCM Connect: the Insights screen

Cultural adaptability over universal defaults

A single platform across 20 countries meant every component had to flex for regional HR practices, compliance requirements and terminology without fragmenting the core experience. I designed two parts of that: leave policies each country could configure, and labels adapted to each locale. Regional teams could adapt the platform without engineering support.

Decision

Leave policies configurable per country and locale-adapted labels

OverUniversal defaults across all countries

HR practices, compliance requirements and terminology varied across 20 countries. A rigid system would fail the moment it crossed a border.

First design system at UBA

UBA had no design system before this project. I established the bank's first, with reusable patterns across all 12 modules, and the design-to-development handoff around it. Once the core components existed (form patterns, data tables, navigation, status indicators), each new module came together faster. The system also let me delegate work to two junior designers, with guardrails that kept quality up.

  • 120components in UBA's first design system
  • 65%higher design-to-development velocity with the design system

“The design system approach meant we could scale consistently across all our African operations while respecting local needs. It's become the blueprint for all our digital initiatives.”

UBA leadership

Results85% adoption across 20,000+ employees while I was there

My part: I led the design of the 12-module platform, from research, user flows and user journeys to solution design. I established UBA's first design system and the design-to-development handoff around it, led a four-person design team, mentored two junior designers and an intern who joined the team full time, and set up the research practices.

  • 85%employee adoptionAcross 20,000+ employees in 20 countries, measured during my time, before I left in November 2021
  • 73%fewer HR helpdesk ticketsThan on the old tools, measured during my time
  • 56%faster onboardingFor new employee setup, than on the old tools, measured during my time
  • 91%reconciliation automatedOf the 30+ hours a week HR spent reconciling systems by hand

Additional outcomes

  • 43%higher HR productivity
  • 4 hoursfor compliance reporting, down from 3 days

“The HCM Connect transformation fundamentally changed how our employees interact with HR services. What used to take days now happens in minutes.”

HR team member, UBA

After I left

The wider team shipped the remaining modules and completed the rollout in early 2022, after I left in November 2021.

Design practice at UBA

  • Design maturity, by my own assessment: Level 1 to Level 3. A first design system, research practices and user-centered decision-making embedded in the development workflow.
  • IT and Operations teams began applying design thinking to their own initiatives.
  • The design system and component library became the foundation for later digital initiatives at UBA.

ReflectionThe system outlasted me, and that's the point

The platform, the design system and the team kept shipping after I left UBA in November 2021. The wider team shipped the remaining modules, and the full rollout was completed in early 2022. For me, that is the strongest validation of the work: in a low-maturity environment, delivering a product also means building the capability to keep delivering.

What I’d do differently

  1. Phase the module rollout more deliberately. We took on all 12 modules within one project timeline: the first went live after five months, and the rest were designed in parallel. Starting with 3 or 4 core modules would have given us faster learning cycles and delivered value earlier.

  2. Start the design system as a product, not a byproduct. The component library emerged from the work rather than being planned upfront. Treating it as a deliberate deliverable from week one would have accelerated later modules and made the handoff smoother.

Portable principle

In an enterprise with low design maturity, design for the decision-makers as carefully as for the end users. Lead with proof, not process: real prototypes, built alongside research rather than after it, are the quickest way I know to earn their trust.

More case studies

Get in touch