THE STORY
Funxtion is a smart digital fitness company focused on large gym chains in the whole world. With 3 core products; mobile app, web platform and interactive screens at the gym, the development cost was high and user experience inconsistent. The company needed a solid design system to improve the overall quality of the product, while taking into account the Whitelabel business strategy of the organization.
MY ROLE
As an emerging UX/UI designer who just started working at Funxtion, I led end-to-end the process of this project in collaboration with the development team.
THE CHALLENGE
The main challange was transforming the product into responsive, and that required redesigning all interfaces and creating all components from a scratch. The assets were scattered across different files and not reusable.
PROCESS
First I needed to decide on the structure of the design system by reviewing the current components and discusing ways of working with the dev team. After that, I began optimizing existing components one by one to be responsive and whitelabel friendly. I created design tokens to keep everything organized and accessible for the developers and created appropriate description for each component to finalize the process.
OUTCOME
The modular design system I created has optimized maintenance, enhanced team collaboration, and significantly increased the speed of designing new interfaces. Each library within the design system included an introduction page that provided a helpful overview of its contents and purpose. All components were organized on a dedicated "component board," which displays key information such as design tokens, component behaviors, sizing, and examples of use.
👉 Visit Funxtion
THE STORY
Funxtion is a smart digital fitness company focused on large gym chains in the whole world. With 3 core products; mobile app, web platform and interactive screens at the gym, the development cost was high and user experience inconsistent. The company needed a solid design system to improve the overall quality of the product, while taking into account the Whitelabel business strategy of the organization.
MY ROLE
As an emerging UX/UI designer who just started working at Funxtion, I led end-to-end the process of this project in collaboration with the development team.
THE CHALLENGE
The main challange was transforming the product into responsive, and that required redesigning all interfaces and creating all components from a scratch. The assets were scattered across different files and not reusable.
PROCESS
First I needed to decide on the structure of the design system by reviewing the current components and discusing ways of working with the dev team. After that, I began optimizing existing components one by one to be responsive and whitelabel friendly. I created design tokens to keep everything organized and accessible for the developers and created appropriate description for each component to finalize the process.
OUTCOME
The modular design system I created has optimized maintenance, enhanced team collaboration, and significantly increased the speed of designing new interfaces. Each library within the design system included an introduction page that provided a helpful overview of its contents and purpose. All components were organized on a dedicated "component board," which displays key information such as design tokens, component behaviors, sizing, and examples of use..
👉 Visit Funxtion
THE STORY
Funxtion is a smart digital fitness company focused on large gym chains in the whole world. With 3 core products; mobile app, web platform and interactive screens at the gym, the development cost was high and user experience inconsistent. The company needed a solid design system to improve the overall quality of the product, while taking into account the Whitelabel business strategy of the organization.
MY ROLE
As an emerging UX/UI designer who just started working at Funxtion, I led end-to-end the process of this project in collaboration with the development team.
THE CHALLENGE
The main challange was transforming the product into responsive, and that required redesigning all interfaces and creating all components from a scratch. The assets were scattered across different files and not reusable.
PROCESS
First I needed to decide on the structure of the design system by reviewing the current components and discusing ways of working with the dev team. After that, I began optimizing existing components one by one to be responsive and whitelabel friendly. I created design tokens to keep everything organized and accessible for the developers and created appropriate description for each component to finalize the process.
OUTCOME
The modular design system I created has optimized maintenance, enhanced team collaboration, and significantly increased the speed of designing new interfaces. Each library within the design system included an introduction page that provided a helpful overview of its contents and purpose. All components were organized on a dedicated "component board," which displays key information such as design tokens, component behaviors, sizing, and examples of use.
👉 Visit Funxtion