In recent years, the Atacadão supermarket chain has grown in both volume and brand recognition, gaining market share alongside Carrefour and going through a major internal restructuring. With this growth, new management challenges emerged — including the solution developed to meet the needs of the HR team. The goal: to serve as a training and education platform, integrated with the group’s other applications.
Abstract
The project started with the challenge of replacing the current learning platform with an in-house tool — one that could evolve over time according to business needs. The first step was to understand the essential requirements, the desired features, and the key value deliveries to prioritize in the backlog.
At that point, I was brought into the project. I started by structuring a benchmark of the main enterprise learning platforms, as well as B2C course platforms. After that, I conducted individual studies on the client’s specific needs, priorities, and wishes.
At the same time, we outlined some workflows to bring user needs to the center of design decisions.
There were many screens, edge cases, flow studies, improvements, and presentations. We pivoted the solution when needed, turned it into a white-label format to cover other brands within the Carrefour group, and prepared the style guide to make product scaling easier and to facilitate the future creation of a Design System.
Proccess
Understanding the challenge
The first step is to understand which problems need to be solved, list them, and structure them into a plan.
Desk research and benchmark
General research phase to look for references on similar problems and to gain a global understanding of the problem and the market. Here we evaluated several learning platforms.
Adapting the Style Guide
We used the app’s style guide for the new platform proposal, planning the application of colors in a white label format to meet the demands of the Carrefour group, not just Atacadão.
Defining the opportunities
After understanding more about the scenario, the project proposal was defined: a hub with the main needs of SAE and the mobility market.
Divide and conquer
With all the information gathered, the project is broken down into deliverables in order to achieve the best result within the schedule defined with the client.
Style definitions
Before defining the main screens, some studies are done to define which visual language will be adopted.
Prototyping
Starting with wireframes and moving to high-fidelity mockups in Figma, this is the longest stage of the process — after all, there are screens for both web and app navigation.
Validation
With the mockup created, it is time to test and present it to the client. For this stage, usability tests were conducted with people matching the identified persona profile, as well as with other age groups.
Solution
As a result, we delivered a complete and modular platform that will meet the needs of each store network according to its demands and internal policies. Additionally, the platform became responsive, gained new features for users, and had its terms and general text simplified to better serve over 40,000 employees.
Flows with web/mobile and light/dark variations. All screens are already based on Figma variables, allowing the user to select the store network and the mode, and then view the screen with the final visual.
