Role: Senior Product Designer · UI Leadership

Duration: 7 months

Copec HR platform — benefits discovery, plan selection, and account screens

Copec, founded in 1934, is the leader in fuel and lubricant distribution in Chile, holding more than 40% of the market. The company has expanded into mobility, sustainability, and convenience services, operating more than 620 stations nationwide. It directly employs close to 13,000 people, which underscores the significant impact of its internal digital platforms.

The Challenge

Digitize an HR process that, until then, was largely manual. This created a heavy operational burden for administrators and significant uncertainty for employees, who had no visibility into the status of their requests — resulting in constant, fragmented communication among employees, managers, and HR.

In an organization the size of Copec, with more than 13,000 employees, this situation had become unsustainable. Compounding the problem was the need to implement a new flexible benefits model capable of adapting to different employee profiles — single, partnered, or with a family group — while incorporating co-payment schemes shared between the company and the employee.

Copec benefit plan comparison: Base, Individual, Family, and Duo plans

The Solution

The approach centered on designing a centralized, standardized platform capable of responding consistently to the needs of the different profiles interacting with the system.

For employees, the priority was a clear and transparent experience that would allow them to:

  • Understand the available benefit plans.
  • Compare plans based on their personal situation.
  • Simplify the plan selection and change process.

The platform was also defined as the single channel for managing work-related requests, providing:

  • Visibility into the status of each request.
  • Traceability of processes.
  • An accessible history of each transaction.
Copec employee benefits experience: requests history, insurance card, benefits catalog, family plan recommendation, and homepage

Process and My Contribution

Building the Right Thing

Kickoff

  • Kickoff
  • Data analisis
  • Aproach definition
  • Strategy

Research

  • Stakeholders workshop
  • Stakeholders interviews
  • User survey
  • User persona
  • Costumer journey maps

Definition

  • Original processes BPMN mapping
  • Optimized BPMN mapping
  • Platform Sitemap definition

Building It Right

Design

  • UI design
  • Design System
  • UI patterns and template design
  • Responsive design

Impact

  • User Test
  • UX/UI iteration
  • Handoff
  • UX QA

lead

contributor

support

Building the Right Thing

contributor

During the initial phase, I took part in collaborative work with various stakeholders through workshops and one-on-one interviews, aiming to align expectations, define the project scope, and identify key organizational and operational constraints from the outset.

In parallel, user research was conducted through a large-scale survey and individual interviews, which helped define the user personas who would interact with the platform and provided a deep understanding of their needs, pain points, and expectations regarding the service redesign.

Journey maps were also developed for each profile, providing an end-to-end view of the processes, identifying key friction points, and surfacing opportunities to improve the existing experience.

Study results are confidential.

Definition

support

Building on the previous stage's findings, the definition phase began with mapping existing processes using BPMN diagrams, aiming to understand in detail how current flows worked and to identify opportunities for improvement.

Based on this analysis, the team worked on optimizing each process with digitization of the service in mind. This stage was carried out collaboratively with the project's various stakeholders, integrating technical, business, and user-experience perspectives to redefine flows that were more efficient, clearer, and scalable.

+30 flows

Mapped and optimized for digitization

≈40%

Reduction in request processing

Building It Right

lead

During the design phase, I was responsible for defining a strategy that would allow the team to move forward consistently and in a controlled way, given the scale and complexity of the platform. To that end, I prioritized designing a set of base screens that would establish the product's overall experience. These early definitions were tested with users and validated with stakeholders, which allowed for early iteration and confirmed that the proposal worked both in terms of experience and visual and interaction guidelines.

This approach laid the groundwork for scaling the design of the rest of the platform in a coherent and sustainable way.

Design System

lead

This approach led naturally into building a base design library that established the foundations of the platform's design system. Building on the earlier validations, reusable components and interaction patterns were defined, enabling faster and more consistent screen production.

The design system became a key part of the process, allowing the product to scale without losing consistency across sections, flows, and benefit types. Reusable templates were also defined for different scenarios, ensuring a consistent experience for all users. The entire system was built with a responsive approach, enabling access from both desktop and mobile devices.

Copec design system UI kit: colors, selection components, inputs, notifications, dropdowns, and text styles

Worker Platform

lead

For the employee-facing platform, we prioritized a clear, consistent, and easy-to-learn experience. The design relied on a defined visual guide, using color strategically to highlight key actions and interactions.

One of the main areas of focus was enabling users to review, compare, select, and change benefit plans based on their personal context — simplifying decisions that were previously complex and hard to track.

We also designed continuous feedback mechanisms to keep employees informed about the status of their requests, through messaging, stage-based traceability, and access to a full history. Standardizing flows and interactions was a key pillar in unifying the experience across a high volume of processes, significantly reducing the learning curve and improving platform adoption.

Copec worker platform: benefits homepage, insurance detail, plan recommendation, and request form
Copec worker platform: employee couple photo alongside insurance detail and benefits recommendation screens
Copec worker platform: life insurance request form, activity declaration, and my requests list
Copec worker platform: benefits phone screen alongside a confident employee photo

Administrator Platform

lead

For the version aimed at HR administrators and managers, design principles consistent with the employee experience were applied, prioritizing clarity, standardization, and operational efficiency. The goal was to reduce the learning curve given the high volume of tasks and flows these profiles needed to manage within the platform.

Consistent interaction patterns and a clear structure were defined to facilitate request management and tracking, allowing administrators and managers to view the status of each case and improve communication with employees when needed. This approach helped optimize daily operations without increasing the system's complexity.

Copec admin platform: requests manager, payments, reporting, and monthly pre-closing screens
Copec admin platform: benefits list, create new benefit, benefit description editor, and employee profile
Copec admin platform: dynamic form builder with component editor and live preview

Results

≈ 80% Reduction

Reduction in manual HR processes

+300

Reusable components, organized into a scalable UI library

4.4/5

CSAT score for HR requests