Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout - including recurring payments set up through Bit.
View case study
UP NEXT
Solution
Through my understandings I built the system based on the atomic design method this would enable it to be scalable.
I believe this was the best solution to the challenges we faced.
Year
2022
Platform
Mobile, Desktop
My role
Product design
Rotem Digmi. All rights reserved.
Design system
Creating Meuhedet's design system to support scale and alignment.
The design system was implemented in a components library in Figma.
We followed the industry's best practices based on the atomic design method.
Meuhedet
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams.
In this case study, I would like to share my experience of developing a new design system, finding a systematic approach and enabling continuous progress within an environment of a large flow of accompanying tasks and changing priorities.
Research
My research included studying the structure of other companies and how they solved similar challenges while deepening my understanding of the specific needs of Meuhedet through cooperation with engineers leading the component library, frontend and engineering managers.
What’s next?
Design systems are evergreen.
They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots,
I would recommend adding templates and pages.
Problem
No design system
=
Inconsistencies in the platform
=
Disconnected user experience.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
Design system
Design system
Creating Meuhedet’s design system to support scale and alignment. The design system was implemented in a components library in Figma. We followed the industry’s best practices based on the atomic design method.
Creating Meuhedet’s design system to support scale and alignment. The design system was implemented in a components library in Figma. We followed the industry’s best practices based on the atomic design method.
Meuhedet
Year 2022
Year 2022
Platform Mobile, Desktop
Platform Mobile, Desktop
My role Product design
My role Product design
Background
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams. In this case study, I share the process of developing a new design system and enabling continuous progress.
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams. In this case study, I share the process of developing a new design system and enabling continuous progress.
Problem
Problem
No design system
Inconsistencies in the platform
Disconnected user experience
Research
Research
My research included studying how other companies solved similar challenges while deepening my understanding of Meuhedet’s specific needs through cooperation with the engineers leading the component library, frontend, and engineering managers.
My research included studying how other companies solved similar challenges while deepening my understanding of Meuhedet’s specific needs through cooperation with the engineers leading the component library, frontend, and engineering managers.
Solution
Through my understanding, I built the system based on the atomic design method. This would enable it to be scalable and provide the best response to the challenges we faced.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
What’s next?
Design systems are evergreen. They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots, I would recommend adding templates and pages.
Year
Year
2022
2022
Platform
Platform
Mobile, Desktop
Mobile, Desktop
My role
My role
Product design
Product design
UP NEXT
UP NEXT
Payment Requests & Standing Authorizations
Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout — including recurring payments set up through Bit.
Consent and authorization flows for an Open Banking rollout — including recurring payments set up through Bit.
View case study
© Rotem Digmi. All rights reserved.
© Rotem Digmi. All rights reserved.
Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout - including recurring payments set up through Bit.
View case study
UP NEXT
Solution
Through my understandings I built the system based on the atomic design method this would enable it to be scalable.
I believe this was the best solution to the challenges we faced.
Year
2022
Platform
Mobile, Desktop
My role
Product design
Rotem Digmi. All rights reserved.
Design system
Creating Meuhedet's design system to support scale and alignment.
The design system was implemented in a components library in Figma.
We followed the industry's best practices based on the atomic design method.
Meuhedet
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams.
In this case study, I would like to share my experience of developing a new design system, finding a systematic approach and enabling continuous progress within an environment of a large flow of accompanying tasks and changing priorities.
Research
My research included studying the structure of other companies and how they solved similar challenges while deepening my understanding of the specific needs of Meuhedet through cooperation with engineers leading the component library, frontend and engineering managers.
What’s next?
Design systems are evergreen.
They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots,
I would recommend adding templates and pages.
Problem
No design system
=
Inconsistencies in the platform
=
Disconnected user experience.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
Design system
Creating Meuhedet’s design system to support scale and alignment. The design system was implemented in a components library in Figma. We followed the industry’s best practices based on the atomic design method.
Meuhedet
Year 2022
Platform Mobile, Desktop
My role Product design
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams. In this case study, I share the process of developing a new design system and enabling continuous progress.
Problem
No design system
Inconsistencies in the platform
Disconnected user experience
Research
My research included studying how other companies solved similar challenges while deepening my understanding of Meuhedet’s specific needs through cooperation with the engineers leading the component library, frontend, and engineering managers.
Solution
Through my understanding, I built the system based on the atomic design method. This would enable it to be scalable and provide the best response to the challenges we faced.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
What’s next?
Design systems are evergreen. They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots, I would recommend adding templates and pages.
Year
2022
Platform
Mobile, Desktop
My role
Product design
UP NEXT
Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout — including recurring payments set up through Bit.
View case study
© Rotem Digmi. All rights reserved.
Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout - including recurring payments set up through Bit.
View case study
UP NEXT
Solution
Through my understandings I built the system based on the atomic design method this would enable it to be scalable.
I believe this was the best solution to the challenges we faced.
Year
2022
Platform
Mobile, Desktop
My role
Product design
Rotem Digmi. All rights reserved.
Design system
Creating Meuhedet's design system to support scale and alignment.
The design system was implemented in a components library in Figma.
We followed the industry's best practices based on the atomic design method.
Meuhedet
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams.
In this case study, I would like to share my experience of developing a new design system, finding a systematic approach and enabling continuous progress within an environment of a large flow of accompanying tasks and changing priorities.
Research
My research included studying the structure of other companies and how they solved similar challenges while deepening my understanding of the specific needs of Meuhedet through cooperation with engineers leading the component library, frontend and engineering managers.
What’s next?
Design systems are evergreen.
They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots,
I would recommend adding templates and pages.
Problem
No design system
=
Inconsistencies in the platform
=
Disconnected user experience.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
Design system
Creating Meuhedet’s design system to support scale and alignment. The design system was implemented in a components library in Figma. We followed the industry’s best practices based on the atomic design method.
Meuhedet
Year 2022
Platform Mobile, Desktop
My role Product design
Background
As a developing company the UI across the system was highly fragmented and inconsistent. We had no library, and with the massive scaling we were experiencing, we needed something to support our growing teams. In this case study, I share the process of developing a new design system and enabling continuous progress.
Problem
No design system
Inconsistencies in the platform
Disconnected user experience
Research
My research included studying how other companies solved similar challenges while deepening my understanding of Meuhedet’s specific needs through cooperation with the engineers leading the component library, frontend, and engineering managers.
Solution
Through my understanding, I built the system based on the atomic design method. This would enable it to be scalable and provide the best response to the challenges we faced.
Atoms
In order to unify the entire system I created the following Atoms: color, typography, border radius, shadow and elevation.
Molecules
The molecules I created were based on the characteristics defined earlier.
Organisms
I used the auto layout method to create the organisms to enable flexibility and structure.
What’s next?
Design systems are evergreen. They are living systems that require a dedicated team actively involved in their growth and maintenance. In the future, when the system has stronger roots, I would recommend adding templates and pages.
Year
2022
Platform
Mobile, Desktop
My role
Product design
UP NEXT
Payment Requests & Standing Authorizations
Consent and authorization flows for an Open Banking rollout — including recurring payments set up through Bit.
View case study
© Rotem Digmi. All rights reserved.