Refine 27
Component Library
The component library ensures that a design is consistent and that a design language is easily extensible by creating a tool kit of reusable base elements. Component libraries can be built at the scale of a single product, to maintain consistency within a family of products, or to set standards across entire brands.
The audience of a component library might be designers, engineers, or developers, and the format of the component library will change depending on whether the components are physical or digital. Industrial designers in a company manufacturing kitchen appliances might share a library of common components to ensure that all of their power switches are the same, while a software company might have a component library to make sure that their error handling is consistent across multiple apps and websites. As all elements are gathered into a single place, component libraries are useful for creating assets, and they can even be translated into coded elements to be used and reused across software-development projects.
Buy from Amazon Buy ElsewhereCityBike
Connected Bicycle
The component library for CityBike’s Connected Bicycle focuses on capturing key elements of the app for building out the design and communicating basic behaviors to the development team. Hardware and on-bike display component libraries are maintained separately.
Omniscient
Observations Suite
The sample of elements from Observations Suite’s component library show different states as well as scaling to multiple screen formats. The component library feeds into, and evolves alongside, design guidelines and detailed documentation.
Related Chapters
25
Mock-Ups
How does our product or service look, feel, and sound? How do we communicate this simply to stakeholders?
28
Design Guidelines
How do we ensure that our intentions are carried forward by other teams? Where do we keep track of decisions?
29
Detailed Design
When are we ready to dive into the details? How do we prioritize what we design for communication purposes?
34
Assets
What do engineers and developers need to bring a product to life?