10 key mistakes the Design Systems team makes and how to avoid them?

Transcript

1. 10 key mistakes the Design Systems team makes and how to avoid them? By ANIL KUMAR @anilbms75
4. Experience
5. Contentful Contentful Web app Customers/ Partners Custom app Developer Content creators /editors Websites
6. 1. Documentation Image source: Unsplash
7. Documentation is not for just you, its for your consumers
9. 2. Getting started Image source: Unsplash
10. Source: reactjs.org/docs/getting-started.html
11. Time for value Source: f36.contentful.com/
12. Source: chakra-ui.com/docs/form/icon-button
13. Stripe friction logs technique Source: Suz Hinton shoptalkshow.com/409/#t=08:34
14. Onboarding Image source: Unsplash
15. Chakra onboarding Source: chakra-ui.com/docs/getting-started
16. 3. Feedback Image source: Unsplash
17. GitHub issue is not the only way to receive Feedback Image source: Unsplash
18. Next Js Documentation Feedback Source: nextjs.org/docs
19. Google Cloud Docs Feedback
20. 4. Purpose
21. Source: twitter.com/ashlie/status/1425506038506147840
22. Source: twitter.com/ashlie/status/1425506038506147840
23. Source: design.gitlab.com/
24. 5. Beyond UI Image source: Unsplash
25. “People don’t want a quarter-inch drill. They want a quarter-inch hole.” - Theodore Levitt Jobs to be done of your consumer Image source: Unsplash
28. 6. Design systems entropy Image source: Unsplash
29. Single source of truth Image source: thenounproject
30. 7. Contribution Image source: Unsplash
31. Consumer VS contributor Image source: Unsplash
32. Contributions from outside Source: seek-oss.github.io/braid-design-system/guides/contribution/
33. Ways to contribute Source: mantine.dev/contribute/
34. Clear steps Source: hds.hel.fi/contributing/before-contributing
35. Celebrate the contribution Source: github.com/contentful/forma-36
36. 8. Layout Image source: Unsplash
37. Commercetools UIKit Source: uikit.commercetools.com/
38. Braid Design System Layout Source: seek-oss.github.io/braid-design-system/foundations/layout
39. 9. Information architecture Image source: Unsplash
40. Helsinki Design System Source: hds.hel.fi
41. 10. Maintenance Image source: Unsplash
42. Create new reusable components Image source: Unsplash
43. Deprecate components Image source: Unsplash
44. Pair Programming with your consumers Image source: Undraw
45. Do You Have Any Questions? Image source: thenounproject
46. Thanks Twitter: @anilbms75 Email: anilbms75@gmail.com Linkedin: linkedin.com/in/anilkrishnashetty