Product design for both web and mobile is evolving at a fast pace. As the range of devices and platforms continues to expand, so do the various design considerations. Design systems help a design team build a framework that meets their needs by bringing together all of the critical design components — including style guides, pattern and UI libraries, CSS frameworks and other resources.
In this session, I will share:
- Strategies for how to approach, design and build an effective design system
- How to successfully maintain the system to ensure ongoing usefulness
- Elements that design systems need in order to be sustainable that are critical for success
Design systems bring together style guides, patterns, UI libraries, CSS frameworks, and brand to help design teams build clear, efficient, consistent, and beautiful products. But, where does a design team or a solo designer begin?
Jina, a designer who has helped build design systems for smaller design agencies and large-scale enterprise ecosystems alike, shares her process and experience so you can begin a design system of your own, and have the structure and insight needed for ongoing success.
In this workshop, you’ll explore key steps in the process:
- Starting with research: talking to who's involved, to better understand why we're doing this.
- Conducting a UI inventory: find the user interface elements, and group them by common patterns.
- Documenting the concerns: open questions and action items.
- Defining the vision: decide on the design principles, create the user stories and roadmap, and determine the metrics.
- Creating a style guide: why they should be living documents, abstracting with design tokens.
- Creating a UI kit/UI library: whether in Sketch/Photoshop or in HTML, follow best practices.
- Refactoring & realigning UI: moving legacy UI over.
- Where to from here: intro to automation and testing, and how to survive over time.