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

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

Avatar for Anil Kumar krishnashetty Anil Kumar krishnashetty
September 29, 2021
Design
280
1

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

Avatar for Anil Kumar krishnashetty

Anil Kumar krishnashetty

September 29, 2021

More Decks by Anil Kumar krishnashetty

See All by Anil Kumar krishnashetty
Enhance Developer Experience by community - Dublin DevRel Meetup
Avatar for Anil Kumar krishnashetty anilkumar
0
60
Unlocking a world of accessibility: how internationalization is the key
Avatar for Anil Kumar krishnashetty anilkumar
0
89
Enhance Developer Experience by community - Code.talks 2023
Avatar for Anil Kumar krishnashetty anilkumar
0
140
Internationalization(i18n) of your Next.js 13 apps using i18next - enterJS 2023
Avatar for Anil Kumar krishnashetty anilkumar
0
130
Enhance Developer Experience by community
Avatar for Anil Kumar krishnashetty anilkumar
0
39
DX IS NOT THE SAME AS UX
Avatar for Anil Kumar krishnashetty anilkumar
0
65
10 Key Mistakes In Your API Docs and How to Avoid Them - API conference 27th April 2023
Avatar for Anil Kumar krishnashetty anilkumar
0
45
DESIGN-STAGE LOCALIZATION
Avatar for Anil Kumar krishnashetty anilkumar
0
42
why-pair-programming-is-the-best-usability-testing-technique
Avatar for Anil Kumar krishnashetty anilkumar
1
81

Other Decks in Design

See All in Design
AI時代、デザイナーの価値はどこに？
Avatar for Ryotaro Takahashi tararira
2
1.9k
染み出し好きの、 染み出しコントロール論
Avatar for Takeru Mukai mukai_takeru
0
420
「バイブコーディングって何？」から始まった、 AIとの一年間と、その先のこと
Avatar for 瀬戸英晴 seto
0
1.1k
PAMPHLET.pdf
Avatar for M-HAND,Inc. mhand01
0
1.7k
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
Avatar for Ayumi Suzuki ayumidesign
0
200
Decksh keywords
Avatar for Anthony Starks ajstarks
0
120
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ～継承と挑戦を両立するデザイン手法～
Avatar for Cygames, Inc. cygames
PRO
3
5k
Edmonton River Slidedeck
Avatar for Edmonton River edmontonriver
0
230
「見せる」登壇資料デザインの極意
Avatar for takanorip takanorip
7
1.5k
Signull 団体説明資料
Avatar for Signull signull
0
790
デザインの文脈を理解する：エンジニアがデザインカンファレンスに参加して得た学びと気づき
Avatar for 蛋白（たんぱく・TANPACT） hypebeans
0
280
Jun Wei Portfolio 2026
Avatar for Wong Jun Wei wjw100788
PRO
1
230

Featured

See All Featured
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
490
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
9
2.4k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.6k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
62k
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
400
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.7k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
Avatar for UX Y'all uxyall
1
2.6k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
400
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
56
3.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
520

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