Edenred Hub
Better serving millions of public and private sector employees, worldwide.
Background
Edenred is a leading digital platform for services and payments and the everyday companion for people at work, connecting more than 60 million users and 2 million partner merchants in 45 countries via close to 1 million corporate clients.
Edenred Hub is intended to be the portal that connects Edenred's many individual products and replace Edenred's EEP (Employee Engagement Platform), a platform used by millions of public and private sector employees, worldwide. EEP is a legacy platform which has evolved and grown organically over more than 20 years as more products were added and new technologies became available. Still a market leader, it was showing its age and the user experience had become fragmented and fallen behind the times and users' expectations.
The Edenred Hub project aimed to bring EEP fully up to date with a refined and consistent user experience across the platform and products within, and bring enhanced accessibility features for those users with additional needs.
Edenred Hub - Figma Prototype
Background
Edenred is a leading digital platform for services and payments and the everyday companion for people at work, connecting more than 60 million users and 2 million partner merchants in 45 countries via close to 1 million corporate clients.
Edenred Hub is intended to be the portal that connects Edenred's many individual products and replace Edenred's EEP (Employee Engagement Platform), a platform used by millions of public and private sector employees, worldwide. EEP is a legacy platform which has evolved and grown organically over more than 20 years as more products were added and new technologies became available. Still a market leader, it was showing its age and the user experience had become fragmented and fallen behind the times and users' expectations.
The Edenred Hub project aimed to bring EEP fully up to date with a refined and consistent user experience across the platform and products within, and bring enhanced accessibility features for those users with additional needs.
Edenred Hub - Figma Prototype
Background
Edenred is a leading digital platform for services and payments and the everyday companion for people at work, connecting more than 60 million users and 2 million partner merchants in 45 countries via close to 1 million corporate clients.
Edenred Hub is intended to be the portal that connects Edenred's many individual products and replace Edenred's EEP (Employee Engagement Platform), a platform used by millions of public and private sector employees, worldwide. EEP is a legacy platform which has evolved and grown organically over more than 20 years as more products were added and new technologies became available. Still a market leader, it was showing its age and the user experience had become fragmented and fallen behind the times and users' expectations.
The Edenred Hub project aimed to bring EEP fully up to date with a refined and consistent user experience across the platform and products within, and bring enhanced accessibility features for those users with additional needs.
Edenred Hub - Figma Prototype
Objective
To deliver a redesigned, white label EEP platform under the Edenred Hub name, ready for a tender submission for renewal of UK Government's employee benefits business (a significant client for Edenred, encompassing over 20 government departments and their employees).
Objective
To deliver a redesigned, white label EEP platform under the Edenred Hub name, ready for a tender submission for renewal of UK Government's employee benefits business (a significant client for Edenred, encompassing over 20 government departments and their employees).
Objective
To deliver a redesigned, white label EEP platform under the Edenred Hub name, ready for a tender submission for renewal of UK Government's employee benefits business (a significant client for Edenred, encompassing over 20 government departments and their employees).
Role
I worked alongside main contractor AND Digital on this project. AND provided FE & BE Development, PM and Research resources, as well as Design towards IA, Homepage, Navigation and Benefits Landing Pages. My responsibilities were for:
Adding & managing benefits
Log in and related tasks (MFA, Password Reset, etc.)
User account management
Employee wellbeing section
Prototyping
Design System & Client 'Themes'
Role
I worked alongside main contractor AND Digital on this project. AND provided FE & BE Development, PM and Research resources, as well as Design towards IA, Homepage, Navigation and Benefits Landing Pages. My responsibilities were for:
Adding & managing benefits
Log in and related tasks (MFA, Password Reset, etc.)
User account management
Employee wellbeing section
Prototyping
Design System & Client 'Themes'
Role
I worked alongside main contractor AND Digital on this project. AND provided FE & BE Development, PM and Research resources, as well as Design towards IA, Homepage, Navigation and Benefits Landing Pages. My responsibilities were for:
Adding & managing benefits
Log in and related tasks (MFA, Password Reset, etc.)
User account management
Employee wellbeing section
Prototyping
Design System & Client 'Themes'
Adding & managing benefits
Benefits are the core of Edenred Hub. The challenge around managing employee benefits is the wide range of mechanics, providers and legal treatments for each. It was essential to collate and unpick all of the existing benefit journeys to identify common themes, where there was divergence and if there was any scope to eliminate any unnecessary steps. Once these journeys were deconstructed and fully understood, I was able to reconstitute a streamlined journey with optimised and standardised patterns defined for data collection and validation, configuration of options, processing of legal agreements and user feedback points. Validation of these proposals from the product team during collaborative workshops was essential, and adjustments were made for instance where a manual process was still present in the journey and needed to be catered for.
Edenred Hub - Figjam was used to help visualise the processes
While AND were looking after the Benefits landing page, I was responsible for designing everything from the benefit product page to the benefits checkout flow.
With the anatomy of the benefits clearly understood, and the benefit of extensive eCommerce experience that I have, I designed an efficient PDP template which could flex to accommodate the requirements of the various benefits.
Edenred Hub - Sliding modal side panel
The next phase was to create the tools to add/manage benefits from the PDP. For this I created a modal sliding side panel component. This component is flexible enough to be used for the multi-step configuration needed for the benefits, as well as being able to work across all breakpoints, including mobile, with no alterations. This same component was also able to be repurposed and used extensively for other tasks such as managing user account data, enabling us to deliver more features more quickly.
The PDP and slide panel designs were prototyped and widely tested and reviewed; internally by the team and other Edenred employees, and externally with customers and clients.
Benefits fall into two categories; Anytime benefits which can be added/amended throughout the year (no surprises there), and Flex benefits which can only be had during a period of time called an 'Election Window'. The final 'transaction' for Anytime benefits is handled off-site by the partner, Flex benefits require a checkout function, however. I designed and tested the checkout flow, which was a drastic improvement over the incredibly confusing and badly structured current implementation.
You can see the entire journey for adding and amending benefits in the video of the prototype I built, further up the page.
Adding & managing benefits
Benefits are the core of Edenred Hub. The challenge around managing employee benefits is the wide range of mechanics, providers and legal treatments for each. It was essential to collate and unpick all of the existing benefit journeys to identify common themes, where there was divergence and if there was any scope to eliminate any unnecessary steps. Once these journeys were deconstructed and fully understood, I was able to reconstitute a streamlined journey with optimised and standardised patterns defined for data collection and validation, configuration of options, processing of legal agreements and user feedback points. Validation of these proposals from the product team during collaborative workshops was essential, and adjustments were made for instance where a manual process was still present in the journey and needed to be catered for.
Edenred Hub - Figjam was used to help visualise the processes
While AND were looking after the Benefits landing page, I was responsible for designing everything from the benefit product page to the benefits checkout flow.
With the anatomy of the benefits clearly understood, and the benefit of extensive eCommerce experience that I have, I designed an efficient PDP template which could flex to accommodate the requirements of the various benefits.
Edenred Hub - Sliding modal side panel
The next phase was to create the tools to add/manage benefits from the PDP. For this I created a modal sliding side panel component. This component is flexible enough to be used for the multi-step configuration needed for the benefits, as well as being able to work across all breakpoints, including mobile, with no alterations. This same component was also able to be repurposed and used extensively for other tasks such as managing user account data, enabling us to deliver more features more quickly.
The PDP and slide panel designs were prototyped and widely tested and reviewed; internally by the team and other Edenred employees, and externally with customers and clients.
Benefits fall into two categories; Anytime benefits which can be added/amended throughout the year (no surprises there), and Flex benefits which can only be had during a period of time called an 'Election Window'. The final 'transaction' for Anytime benefits is handled off-site by the partner, Flex benefits require a checkout function, however. I designed and tested the checkout flow, which was a drastic improvement over the incredibly confusing and badly structured current implementation.
You can see the entire journey for adding and amending benefits in the video of the prototype I built, further up the page.
Adding & managing benefits
Benefits are the core of Edenred Hub. The challenge around managing employee benefits is the wide range of mechanics, providers and legal treatments for each. It was essential to collate and unpick all of the existing benefit journeys to identify common themes, where there was divergence and if there was any scope to eliminate any unnecessary steps. Once these journeys were deconstructed and fully understood, I was able to reconstitute a streamlined journey with optimised and standardised patterns defined for data collection and validation, configuration of options, processing of legal agreements and user feedback points. Validation of these proposals from the product team during collaborative workshops was essential, and adjustments were made for instance where a manual process was still present in the journey and needed to be catered for.
Edenred Hub - Figjam was used to help visualise the processes
While AND were looking after the Benefits landing page, I was responsible for designing everything from the benefit product page to the benefits checkout flow.
With the anatomy of the benefits clearly understood, and the benefit of extensive eCommerce experience that I have, I designed an efficient PDP template which could flex to accommodate the requirements of the various benefits.
Edenred Hub - Sliding modal side panel
The next phase was to create the tools to add/manage benefits from the PDP. For this I created a modal sliding side panel component. This component is flexible enough to be used for the multi-step configuration needed for the benefits, as well as being able to work across all breakpoints, including mobile, with no alterations. This same component was also able to be repurposed and used extensively for other tasks such as managing user account data, enabling us to deliver more features more quickly.
The PDP and slide panel designs were prototyped and widely tested and reviewed; internally by the team and other Edenred employees, and externally with customers and clients.
Benefits fall into two categories; Anytime benefits which can be added/amended throughout the year (no surprises there), and Flex benefits which can only be had during a period of time called an 'Election Window'. The final 'transaction' for Anytime benefits is handled off-site by the partner, Flex benefits require a checkout function, however. I designed and tested the checkout flow, which was a drastic improvement over the incredibly confusing and badly structured current implementation.
You can see the entire journey for adding and amending benefits in the video of the prototype I built, further up the page.
Design System & Theming
Edenred Hub - Client Themes
Concurrent with the design development of EEP, I was building a Design System, with the intention for it to be used for other Edenred projects going forward. Built on Atomic Design principles, and initially geared towards Edenred's brand style guide, this has also been structured in such a way to facilitate 'Themes'.
This is essential to Edenred as the majority of their clients opt for a white label version of the product, modified to their own brand style.
Previously, this has been a laborious manual process but the new Edenred Design System has been structured to drastically reduce this, making it possible to deploy a new theme with significant client customisation but with minimal effort and improved assurance that accessibility has been maintained.
Edenred Hub - Design System
Design System & Theming
Edenred Hub - Client Themes
Concurrent with the design development of EEP, I was building a Design System, with the intention for it to be used for other Edenred projects going forward. Built on Atomic Design principles, and initially geared towards Edenred's brand style guide, this has also been structured in such a way to facilitate 'Themes'.
This is essential to Edenred as the majority of their clients opt for a white label version of the product, modified to their own brand style.
Previously, this has been a laborious manual process but the new Edenred Design System has been structured to drastically reduce this, making it possible to deploy a new theme with significant client customisation but with minimal effort and improved assurance that accessibility has been maintained.
Edenred Hub - Design System
Design System & Theming
Edenred Hub - Client Themes
Concurrent with the design development of EEP, I was building a Design System, with the intention for it to be used for other Edenred projects going forward. Built on Atomic Design principles, and initially geared towards Edenred's brand style guide, this has also been structured in such a way to facilitate 'Themes'.
This is essential to Edenred as the majority of their clients opt for a white label version of the product, modified to their own brand style.
Previously, this has been a laborious manual process but the new Edenred Design System has been structured to drastically reduce this, making it possible to deploy a new theme with significant client customisation but with minimal effort and improved assurance that accessibility has been maintained.
Edenred Hub - Design System
© Dave George Design Ltd. 2023