Upgrade to Pro — share decks privately, control downloads, hide ads and more …

10 key mistakes the Design Systems team makes a...

Avatar for anilbms75@gmail.com [email protected]
September 29, 2021
Design
1
270

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

Avatar for anilbms75@gmail.com

[email protected]

September 29, 2021
Tweet

More Decks by [email protected]

See All by [email protected]
Enhance Developer Experience by community - Dublin DevRel Meetup
Avatar for anilbms75@gmail.com anilkumar
0
44
Unlocking a world of accessibility: how internationalization is the key
Avatar for anilbms75@gmail.com anilkumar
0
74
Enhance Developer Experience by community - Code.talks 2023
Avatar for anilbms75@gmail.com anilkumar
0
110
Internationalization(i18n) of your Next.js 13 apps using i18next - enterJS 2023
Avatar for anilbms75@gmail.com anilkumar
0
97
Enhance Developer Experience by community
Avatar for anilbms75@gmail.com anilkumar
0
28
DX IS NOT THE SAME AS UX
Avatar for anilbms75@gmail.com anilkumar
0
41
10 Key Mistakes In Your API Docs and How to Avoid Them - API conference 27th April 2023
Avatar for anilbms75@gmail.com anilkumar
0
25
DESIGN-STAGE LOCALIZATION
Avatar for anilbms75@gmail.com anilkumar
0
33
why-pair-programming-is-the-best-usability-testing-technique
Avatar for anilbms75@gmail.com anilkumar
1
43

Other Decks in Design

See All in Design
Echoes Boomerang
Avatar for Cloud Yu artcloudyu
PRO
0
250
portfolio_YumiYasuda
Avatar for yumi yasuda yum0418
0
290
Мышление историями. Как текстовые модели поведения помогают дизайнеру проектировать
Avatar for Andrew Shapiro ashapiro
0
110
Storyboard Honey
Avatar for Rocío Parrón rocioparronrubio
0
280
Saudade typeface
Avatar for Tiago Porto tiagoporto
0
330
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
0
110
The Golden Whitney
Avatar for OhTristanArt ohtristanart
PRO
0
550
読書シェア会 vol.5 / Yumemi.grow 20250526
Avatar for Rakus_Dev rakus_dev
0
1.6k
Tools for Design Engineers other than LLM in the LLM era
Avatar for takanorip takanorip
1
310
バイアスを凌ぐデザインとコード ―異動直後にどうふるまうか―
Avatar for kkaru kkaru
0
450
Yumika Yamada Portfolio
Avatar for Yumii yumii
0
650
21 Ways to Call American Airlines Customer Care Full Guide USA
Avatar for Sonny americanhub
0
180

Featured

See All Featured
It's Worth the Effort
Avatar for 3n 3n
185
28k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
107
19k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
184
22k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
48
2.9k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
110k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
11k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
346
40k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
126
17k

Transcript

  1. 10 key mistakes the Design Systems team makes and how

    to avoid them? By ANIL KUMAR @anilbms75
  2. None
  3. None

  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

  8. None

  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
  26. None
  27. None

  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: [email protected] Linkedin: linkedin.com/in/anilkrishnashetty