A presentation at Clarity by Daniel Banks
An Introduction to Multi-Platform Design Systems Danny Banks @dbanksdesign bit.ly/clarity2020-multiplatform
Less than 10% of public design systems support platforms other than the web.* * dbanks.design/blog/multi-platform
Differentiating factors
Consistency Cohesion
Applications don’t need to look exactly the same across all platforms.
Foundations Principles Brand Content strategy Localization Communications
Design tokens Foundations
Definitions Design tokens Foundations
Component Definitions <example-banner variant=”warning” title=”Uh oh” description=”Something bad happened” />” <com.example.component.Banner app:variant=”warning” app:title=”Uh oh” app:description=”Something bad happened” />” let banner = Banner( variant: .warning, title: “Uh oh”, description: “Something bad happened” );
“ We design and build in parallel so any discussions on details that come up during implementation (and there are usually many) get addressed and considered together. A system built on parity: How to treat all of your users equally by Linzi Berry, Kathy Ma, Sam Soffes from Lyft
Systems should support how creators work.
Efficiency Autonomy
Low friction environments
Lowest fidelity to express intent Rely less on mockups Get to code quicker Designer & developer pairing
Spread ownership Distribute creation Own the full experience Meet creators where they are
Cohesion Autonomy
Over 25% of public design systems support multiple platforms next year.
Thank You! Danny Banks @dbanksdesign bit.ly/clarity2020-multiplatform
You already have amazing design systems with battle-tested components, thorough documentation, and a frictionless developer experience - there’s just one small problem: it’s web-only. Let’s expand our design systems thinking to create a cohesive multi-platform experience that works for customers and creators. In this talk we will explore the environments, ergonomics, and economics of building design systems on multiple platforms.
for free. You
can too.