The first design system for a client of OWW Studio

The first design system for a client of OWW Studio

18 Jun 2024

18 Jun 2024

Embarking on the first journey to implement a design system for a client at OWW Studio was an exciting yet challenging experience. As a designer, I knew this project would not only enhance our skills but also significantly contribute to our client's product development process. This blog post details my journey, the challenges faced, and the invaluable lessons learned along the way.

Understanding the Client's Needs

In 2022, I approached Umar Aji Pratama, the Creative Director at OWW Studio, with the suggestion to immediately implement a design system for the Medatus Health project. This project was large-scale, encompassing everything from mobile applications to websites. Given the scope, it was clear that a robust design system was essential to maintain consistency and efficiency.

Research and Planning

This was our first time using a design system on such a large scale, so I suggested leveraging the MUI Design System library as a starting point. We conducted several meetings and workshops to gather insights into the client's design and development processes. The goal was to create a cohesive design system that would streamline their workflow and ensure consistency across their products.

Building the Foundation

With a clear understanding of the client's needs, the next step was thorough research. I explored various design systems to draw inspiration and understand best practices. This phase also involved planning the structure of our design system, deciding on components, and setting up guidelines. We started by defining the foundational elements: colors, typography, spacing, and grid systems. Establishing these basics was crucial as they would serve as the building blocks for all components.

Component Library Development

Next, we moved on to developing the component library. This included buttons, forms, modals, and other UI elements. Each component was designed to be reusable, ensuring that they could be easily integrated into different parts of the client's applications. We documented the usage guidelines for each component to maintain consistency.

Collaboration and Feedback

Throughout the project, collaboration with the client’s team was key. Regular feedback sessions helped us stay aligned with their expectations and make necessary adjustments. This iterative process ensured that the design system was both functional and aligned with the client’s vision.

Integration with Development

A crucial aspect of the project was ensuring smooth integration with the development team. We worked closely with developers to ensure that the design system components were easily implementable. This collaboration helped in identifying potential issues early and addressing them promptly.

Testing and Refinement

Once the design system was developed, we conducted extensive testing to ensure its robustness and usability. This phase involved real-world application of the components and gathering feedback from end-users. Based on the feedback, we refined the components and guidelines to ensure they met the highest standards.

Personalizing the Design System

In the second iteration, we moved beyond the MUI Design System library to create a personalized design system tailored specifically for Medatus Health. This involved customizing components to better fit the client's brand and user needs, ensuring a unique and cohesive visual identity across all platforms.

Launch and Training

With the design system ready, we launched it to the client’s team. We provided detailed documentation and support to ensure a smooth transition.

Reflecting on the Journey

Implementing a design system for a client at OWW Studio was a transformative experience. It taught me the importance of collaboration, meticulous planning, and the need for continuous improvement. The final design system not only enhanced the client’s product development process but also empowered their team to create cohesive and visually appealing applications.

Conclusion

The journey of implementing a design system was filled with learning and growth. It reinforced my belief in the power of design systems to bring consistency, efficiency, and scalability to product development. I am proud of the work we did and look forward to more such challenging projects in the future.

By sharing this journey, I hope to inspire other designers embarking on similar projects and highlight the value of a well-implemented design system.

Embarking on the first journey to implement a design system for a client at OWW Studio was an exciting yet challenging experience. As a designer, I knew this project would not only enhance our skills but also significantly contribute to our client's product development process. This blog post details my journey, the challenges faced, and the invaluable lessons learned along the way.

Understanding the Client's Needs

In 2022, I approached Umar Aji Pratama, the Creative Director at OWW Studio, with the suggestion to immediately implement a design system for the Medatus Health project. This project was large-scale, encompassing everything from mobile applications to websites. Given the scope, it was clear that a robust design system was essential to maintain consistency and efficiency.

Research and Planning

This was our first time using a design system on such a large scale, so I suggested leveraging the MUI Design System library as a starting point. We conducted several meetings and workshops to gather insights into the client's design and development processes. The goal was to create a cohesive design system that would streamline their workflow and ensure consistency across their products.

Building the Foundation

With a clear understanding of the client's needs, the next step was thorough research. I explored various design systems to draw inspiration and understand best practices. This phase also involved planning the structure of our design system, deciding on components, and setting up guidelines. We started by defining the foundational elements: colors, typography, spacing, and grid systems. Establishing these basics was crucial as they would serve as the building blocks for all components.

Component Library Development

Next, we moved on to developing the component library. This included buttons, forms, modals, and other UI elements. Each component was designed to be reusable, ensuring that they could be easily integrated into different parts of the client's applications. We documented the usage guidelines for each component to maintain consistency.

Collaboration and Feedback

Throughout the project, collaboration with the client’s team was key. Regular feedback sessions helped us stay aligned with their expectations and make necessary adjustments. This iterative process ensured that the design system was both functional and aligned with the client’s vision.

Integration with Development

A crucial aspect of the project was ensuring smooth integration with the development team. We worked closely with developers to ensure that the design system components were easily implementable. This collaboration helped in identifying potential issues early and addressing them promptly.

Testing and Refinement

Once the design system was developed, we conducted extensive testing to ensure its robustness and usability. This phase involved real-world application of the components and gathering feedback from end-users. Based on the feedback, we refined the components and guidelines to ensure they met the highest standards.

Personalizing the Design System

In the second iteration, we moved beyond the MUI Design System library to create a personalized design system tailored specifically for Medatus Health. This involved customizing components to better fit the client's brand and user needs, ensuring a unique and cohesive visual identity across all platforms.

Launch and Training

With the design system ready, we launched it to the client’s team. We provided detailed documentation and support to ensure a smooth transition.

Reflecting on the Journey

Implementing a design system for a client at OWW Studio was a transformative experience. It taught me the importance of collaboration, meticulous planning, and the need for continuous improvement. The final design system not only enhanced the client’s product development process but also empowered their team to create cohesive and visually appealing applications.

Conclusion

The journey of implementing a design system was filled with learning and growth. It reinforced my belief in the power of design systems to bring consistency, efficiency, and scalability to product development. I am proud of the work we did and look forward to more such challenging projects in the future.

By sharing this journey, I hope to inspire other designers embarking on similar projects and highlight the value of a well-implemented design system.

Embarking on the first journey to implement a design system for a client at OWW Studio was an exciting yet challenging experience. As a designer, I knew this project would not only enhance our skills but also significantly contribute to our client's product development process. This blog post details my journey, the challenges faced, and the invaluable lessons learned along the way.

Understanding the Client's Needs

In 2022, I approached Umar Aji Pratama, the Creative Director at OWW Studio, with the suggestion to immediately implement a design system for the Medatus Health project. This project was large-scale, encompassing everything from mobile applications to websites. Given the scope, it was clear that a robust design system was essential to maintain consistency and efficiency.

Research and Planning

This was our first time using a design system on such a large scale, so I suggested leveraging the MUI Design System library as a starting point. We conducted several meetings and workshops to gather insights into the client's design and development processes. The goal was to create a cohesive design system that would streamline their workflow and ensure consistency across their products.

Building the Foundation

With a clear understanding of the client's needs, the next step was thorough research. I explored various design systems to draw inspiration and understand best practices. This phase also involved planning the structure of our design system, deciding on components, and setting up guidelines. We started by defining the foundational elements: colors, typography, spacing, and grid systems. Establishing these basics was crucial as they would serve as the building blocks for all components.

Component Library Development

Next, we moved on to developing the component library. This included buttons, forms, modals, and other UI elements. Each component was designed to be reusable, ensuring that they could be easily integrated into different parts of the client's applications. We documented the usage guidelines for each component to maintain consistency.

Collaboration and Feedback

Throughout the project, collaboration with the client’s team was key. Regular feedback sessions helped us stay aligned with their expectations and make necessary adjustments. This iterative process ensured that the design system was both functional and aligned with the client’s vision.

Integration with Development

A crucial aspect of the project was ensuring smooth integration with the development team. We worked closely with developers to ensure that the design system components were easily implementable. This collaboration helped in identifying potential issues early and addressing them promptly.

Testing and Refinement

Once the design system was developed, we conducted extensive testing to ensure its robustness and usability. This phase involved real-world application of the components and gathering feedback from end-users. Based on the feedback, we refined the components and guidelines to ensure they met the highest standards.

Personalizing the Design System

In the second iteration, we moved beyond the MUI Design System library to create a personalized design system tailored specifically for Medatus Health. This involved customizing components to better fit the client's brand and user needs, ensuring a unique and cohesive visual identity across all platforms.

Launch and Training

With the design system ready, we launched it to the client’s team. We provided detailed documentation and support to ensure a smooth transition.

Reflecting on the Journey

Implementing a design system for a client at OWW Studio was a transformative experience. It taught me the importance of collaboration, meticulous planning, and the need for continuous improvement. The final design system not only enhanced the client’s product development process but also empowered their team to create cohesive and visually appealing applications.

Conclusion

The journey of implementing a design system was filled with learning and growth. It reinforced my belief in the power of design systems to bring consistency, efficiency, and scalability to product development. I am proud of the work we did and look forward to more such challenging projects in the future.

By sharing this journey, I hope to inspire other designers embarking on similar projects and highlight the value of a well-implemented design system.

Siap untuk memimpin masa depan?

Yogyakarta | Singapura

©2024, rajeshsiburian

Siap untuk memimpin masa depan?

Yogyakarta | Singapura

©2024, rajeshsiburian

Siap untuk memimpin masa depan?

Yogyakarta | Singapura

©2024, rajeshsiburian