Building a design system at Juriba is instrumental to its transition into a product led /focused company. At the moment we have a guide in Confluence, but it’s set to be static which impacts fluidity and improvements as it’s a documentation highlight with attached screenshots. This is where Figma comes in. Style Guide documentation in the form of a write-up is great, but it’d be redundant if there’s no active collection of design components and variants in a design tool such as Figma where it can be in sync with app files and also easily and constantly maintained on the go.
So Why Should We Maintain Our Design System?
- Consistency: With a design system, we ensure consistency in the design of products and services. This consistency creates a cohesive and seamless user experience, regardless of which designer or team is working on a particular project. But also it can be out of date and hence lack consistency, this is why it must be maintained from a central location that is not just written words and screenshots.
- Efficiency: It will help us to streamline the design process by providing reusable components, templates, and guidelines. This will help the design team to work faster and more efficiently, reducing design and development time and costs. It will be much easier to duplicate, and reuse components and in the event that we have some changes to make, we can do it on the master and it’ll be reflected across files.
- Scalability: A well-maintained design system can easily accommodate the needs of a growing organization. It can be expanded and updated as new features are added, ensuring that the design remains consistent across all products and services.
- Collaboration: It fosters collaboration between designers, developers, and stakeholders. It provides a shared language and framework, enabling all team members to contribute to the design process.
- Branding: It also helps to maintain a consistent brand image across all products and services. This consistency reinforces brand recognition and trust, helping to establish a strong and recognizable brand identity. Design, Sales, and Marketing teams will be in sync as all components are consistent and be used easily by all.
How Do We Achieve This?
- Document and communicate: Document the design system thoroughly, including guidelines, assets, and components. Communicate the design system to all team members, stakeholders, and vendors, so that everyone understands the system and how to use it. We already do this, but we can review and update the documentation in Confluence while building out a library in Figma (recommended) to ease usage, maintenance, and collaboration. We can model the Ant Design library they offer components similar to our style guide and we can purchase it and recreate it in Figma (should we be going in that direction).
- Regular updates and maintenance: Regularly update and maintain the design system. As new features or requirements emerge, update the system accordingly. This includes reviewing existing components and guidelines and testing the system regularly to ensure that it remains accurate and effective. When new tasks/features influence new components/variants that are not existing in our library, we log it and ensure it’s made a component and added to the library.
- Create a feedback loop: We create a feedback loop between designers, developers, and stakeholders to gather feedback on the design system. This feedback can help to identify issues, gaps, and opportunities for improvement.
- Continuous improvement: Continuously improve the design system. This includes incorporating feedback from team members and stakeholders, as well as staying up-to-date with industry best practices and design trends. By continuously improving the design system, it can remain an effective and valuable tool for the organization. At the end of each quarter, we set aside a day to review our design system, compare the industry latest practices, and make necessary changes.