The more reusable something is, the more it belongs in a design system.įigma recently released design system analytics for organizations, where teams can see how effective different parts of a design system are and help optimize it.įigma provides a design system analytics tool for optimizing a design system in Figma. It’s generally not useful to include highly complex components or those that may only be used once or twice in the product. If developers can reference it for colors, typestyles, or to do work with less input from designers, that’s also a good sign. If multiple designers use it regularly in order to speed up their process, it’s doing a good job. Trying to use a design system like a toolkit is a great litmus test for its effectiveness. Salesforce’s component library is part of their Salesforce Lightning Design System. Additionally, it’s ideal if the library of components is kept in a central location that is easily accessible to all. At this point, it would be advantageous to define the common UX patterns and distill the product into a set of components that are regularly used throughout the product. If a product is a mature one and doesn’t have an existing component library, the design system should already be determined by the current implementation. It’s better to wait until the product design has settled-preferably tested and somewhat finalized. For example, if two primary navigation bars are being experimented with, adding both to a component library would not make sense, as it will confuse everyone on the team. In the early stages of designing a product, the process is still fluid. Sometimes, it can be counterproductive to invest in creating a design system too soon. It speeds up the design process and allows designers more time for experimentation.įor those designers working with Figma, let’s look at how creating a component library in Figma can be a key part of a comprehensive design system. A good design system helps developers understand the logic behind design decisions, and helps to create a more cohesive product. It’s a toolkit that helps designers create new screens, flows, and prototypes faster. More extensive tools like Storybook and Component-Driven Development are also extremely useful resources for implementing and documenting a design system.Ī design system maintains design consistency and should be useful to everyone involved in creating a product. GitHub has even gone so far as to share their Figma component library-a great example of a Figma-based design system. Just like an architect’s blueprint for a building, a design system also serves as the “single source of truth” for the product team while building products, as well as helping to maintain consistency. So what precisely is a design system? Will Fanguy defines it as “a collection of reusable components, guided by clear standards, that can be assembled to build any number of applications.” A design system may include not only a UI component library and a pattern library, but a style guide, best practices, code, and more. As the case for creating a comprehensive design system has been made clear many times over, with companies like Google, GitHub, IBM, and others using them to create better products at greater pace, the question has shifted from “Why should we have a design system?” to “How can we create a great design system?” It is common knowledge among designers that a good design system can have a huge impact on the quality of products we ship and the pace at which we can develop them.
0 kommentar(er)
