Keeping living design systems alive

@wilkowskidom Keeping living design systems alive

Dominik Wilkowski Developer at Thinkmill @wilkowskidom

@wilkowskidom What do I mean by Design System?

@wilkowskidom Smarter Closer Faster

@wilkowskidom ‣ Sketch library ‣ Component library ‣ Content guide
‣ Design tokens ‣ Design language ‣ Color system ‣ Iconography ‣ React components ‣ Patterns ‣ Templates ‣ Illustrations ‣ Animations Things that might be in your design system…

@wilkowskidom Your digital brand

@wilkowskidom Your source of truth Your digital brand

@wilkowskidom Living & funded internal product Your source of truth
Your digital brand

@wilkowskidom The trap

@wilkowskidom We obsess about the first 9 months and forget
about the next 18 years The baby trap

@wilkowskidom How to avoid the trap?

@wilkowskidom People Design systems are for Jina Anne • @jina
https://noti.st/jina/nhIW0G

@wilkowskidom People Built by

@wilkowskidom …should be the central concern for a healthy design
system People

@wilkowskidom Bringing people together Community Getting people to work together
Collaboration Tracking success Motivating & holding accountable Communication Document as much as you can People

@wilkowskidom Community Collaboration Track your success Communication

@wilkowskidom M. Conway Organizations which design systems … are constrained
to produce designs which are copies of the communication structures of these organizations.

@wilkowskidom M. Conway… paraphrased To make sure we build the
right community, we need to cross organizational boundaries

@wilkowskidom M. Conway… paraphrased more A good design system is
made up of a lot of different people

@wilkowskidom a lot of different people = community

@wilkowskidom How do you build community?

@wilkowskidom

@wilkowskidom Design system love day

@wilkowskidom Research Space for

@wilkowskidom

@wilkowskidom Research Elevate arguments w/ Space for Spread empathy w/
Do your

@wilkowskidom Research Designer User Accessibility Content author Legal

@wilkowskidom Excitement levels

@wilkowskidom EXCITEMENT DESIGNERS DEVELOPERS

@wilkowskidom EXCITEMENT DESIGNERS DEVELOPERS = Rigid rules

@wilkowskidom Frequent showcases

@wilkowskidom Keep up the momentum

@wilkowskidom Donation model

@wilkowskidom Product Team A Product Team B Product Team C
Design System Team

@wilkowskidom Learn from the best: deadly viruses

@wilkowskidom ‣ One team. One dream ‣ Exchange for time
saved ‣ Exchange for code built ‣ Exchange for up-skilling people ‣ Great on boarding experience Encourage donations by…

@wilkowskidom Community building is so HOT right now https://www.sciencemag.org/careers/2018/02/building-community-career https://www.researchgate.net/publication/265891662_Online_Communities_and_Online_Community_Building

@wilkowskidom ‣ Design system love day ‣ Research ‣ Showcases
‣ 50/50 excitement ‣ Donation model Community

@wilkowskidom Team models for scaling a DS Nathan Curtis •
@nathanacurtis “Team Models for Scaling a Design System” (on Medium)

@wilkowskidom Centralized Solitary Federated

@wilkowskidom Curation

@wilkowskidom Provides consistency Curation

@wilkowskidom Gives confidence Provides consistency Curation

@wilkowskidom Helps with communication Gives confidence Provides consistency Curation

@wilkowskidom Listen

@wilkowskidom

@wilkowskidom Note what people tell you (Literally, write it down)

@wilkowskidom Repeat in your own words what people told you

@wilkowskidom Make those issues a sprint goal or your KPI

@wilkowskidom Alphas

@wilkowskidom

@wilkowskidom Create a space to try things out

@wilkowskidom Create time for feedback

@wilkowskidom Test drive your assumptions

@wilkowskidom Tools that have worked for us are Slack &
Discourse

@wilkowskidom

@wilkowskidom Meaningful collaboration is not a solved problem

@wilkowskidom ‣ Make it meaningful ‣ Requires upfront engagement ‣
Create fertile soil for engagement ‣ Deal with problems head on ‣ Handle ownership fairly How to promote meaningful collaboration (2017) https://dea.nu/sites/dea.nu/ﬁles/how-to-promote-meaningful-collaboration.pdf

@wilkowskidom A cautionary tale…

@wilkowskidom

@wilkowskidom We should have educated our users about security

@wilkowskidom ‣ Curate (regardless of model) ‣ Listen (really listen)
‣ Alphas ‣ Learn from your mistakes Collaboration

@wilkowskidom To make yourself accountable

@wilkowskidom People are happier working towards a goal

@wilkowskidom Helps keep your project funded

@wilkowskidom What is success?

@wilkowskidom What is success? Asset downloads?

@wilkowskidom Design consistency? What is success? Asset downloads?

@wilkowskidom Time saved? Design consistency? What is success? Asset downloads?

Lost in translation issues?

Lost in translation issues? Love day attendance?

@wilkowskidom Frame metrics to be meaningful

@wilkowskidom Focus on the impact

@wilkowskidom Less reinventing the button = more tax payers money
for […]

@wilkowskidom More developers star your DS = less don’t know
about design

@wilkowskidom More consistent your interface = less users have to
learn

@wilkowskidom Celebrate your wins

@wilkowskidom A design system love publication

@wilkowskidom

@wilkowskidom Milestones tracking on the website

@wilkowskidom

@wilkowskidom Be fabulous as a team so people want to
join you

@wilkowskidom Builds trust and authenticity by publishing

@wilkowskidom ‣ Define success ‣ Make it meaningful ‣ Celebrate
your wins Track success

@wilkowskidom Docs, docs and more docs

@wilkowskidom But who are you writing for?

@wilkowskidom Separate docs for designers and developers?

@wilkowskidom Let your users focus and drill into the content?
Combined docs for designers and developers?

@wilkowskidom Combined docs for designers and developers?

@wilkowskidom Expose them to the concerns of others and create
empathy

@wilkowskidom Separate docs for designers and developers? Combined docs for
designers and developers? or

@wilkowskidom Chose one. Don’t try to do both.

@wilkowskidom What to document?

@wilkowskidom Document Research Do your

@wilkowskidom Document Research Do your Alpha releases

@wilkowskidom Document Research Alpha releases How you collaborate

@wilkowskidom Document Research Alpha releases How you collaborate Roadmap

@wilkowskidom Delight your readers

@wilkowskidom

@wilkowskidom Made a huge difference to morale and happiness

@wilkowskidom ‣ Docs, docs, docs ‣ Who to write for?
‣ What to document? ‣ Delight your readers Communication

Ready for the big summary?

Ready for the big summary? ‣ DS love day ‣
Research ‣ Showcases ‣ 50/50 excitement ‣ Donation model Community Keeping living design systems alive

Research ‣ Showcases ‣ 50/50 excitement ‣ Donation model Community ‣ Curate ‣ Listen ‣ Alphas ‣ Learn from mistakes Collaboration Keeping living design systems alive

Research ‣ Showcases ‣ 50/50 excitement ‣ Donation model Community ‣ Curate ‣ Listen ‣ Alphas ‣ Learn from mistakes Collaboration ‣ Define success ‣ Make it meaningful ‣ Celebrate your wins Track success Keeping living design systems alive

Research ‣ Showcases ‣ 50/50 excitement ‣ Donation model Community ‣ Curate ‣ Listen ‣ Alphas ‣ Learn from mistakes Collaboration ‣ Define success ‣ Make it meaningful ‣ Celebrate your wins Track success ‣ Docs, docs, docs ‣ Who to write for? ‣ What to document? ‣ Delight your readers Communication Keeping living design systems alive

@wilkowskidom Finally, iterate

@wilkowskidom More community More collaboration More tracking success More communication

@wilkowskidom Keep playing

@wilkowskidom Don’t be afraid to break things

@wilkowskidom But communicate it

@wilkowskidom People

@wilkowskidom Thanks ♥ Tell me how your DS is going

Keeping living design systems alive

Keeping living design systems alive

Other Decks in Technology

Featured

Transcript