$30 off During Our Annual Pro Sale. View Details »

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
51
Unlocking a world of accessibility: how internationalization is the key
Avatar for anilbms75@gmail.com anilkumar
0
75
Enhance Developer Experience by community - Code.talks 2023
Avatar for anilbms75@gmail.com anilkumar
0
120
Internationalization(i18n) of your Next.js 13 apps using i18next - enterJS 2023
Avatar for anilbms75@gmail.com anilkumar
0
100
Enhance Developer Experience by community
Avatar for anilbms75@gmail.com anilkumar
0
29
DX IS NOT THE SAME AS UX
Avatar for anilbms75@gmail.com anilkumar
0
46
10 Key Mistakes In Your API Docs and How to Avoid Them - API conference 27th April 2023
Avatar for anilbms75@gmail.com anilkumar
0
27
DESIGN-STAGE LOCALIZATION
Avatar for anilbms75@gmail.com anilkumar
0
37
why-pair-programming-is-the-best-usability-testing-technique
Avatar for anilbms75@gmail.com anilkumar
1
55

Other Decks in Design

See All in Design
AI業務アプリケーションの体験デザイン
Avatar for kim kazuhirokimura
0
230
Franks Myth
Avatar for George Frank Hayford-Taylor gfht1
0
370
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
Avatar for takanorip takanorip
0
820
新卒の目から見たサイボウズのデザイン組織
Avatar for 小林諒大 ryota5884
0
270
Emmy's Artwork
Avatar for McKenna mcksmith
0
180
AI駆動なデザイン開発 〜Figma Make でまるっとつくるか、 HTML でシンプルにつくるか〜
Avatar for Tomoya AZUMA t_east
1
1.6k
Character Experience AI 〜 AIキャラクターのつくりかた 〜
Avatar for 株式会社スマートバンク smartbank
1
480
企業にデザインが融けたとき、デザイナーにできること。事業会社12年間の探究と葛藤 / Designship2025
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
0
1.2k
【MIXI MEETUP！ー TECH & DESIGN DAYー】新たなSNS「mixi2」の “0→1”開発の舞台裏：デザイナーが語るプロダクト誕生秘話
Avatar for MIXI DESIGN mixi_design
PRO
0
180
Vibe Coding デザインシステム
Avatar for poteboy poteboy
3
1.6k
mount_company_profile
Avatar for mount inc. mount_inc
0
4k
「キャリア」のプロダクトをつくる私の「キャリア」への向き合い方 / JAM de NIGHT DESIGN SESSION Vol3
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
930

Featured

See All Featured
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
700
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
It's Worth the Effort
Avatar for 3n 3n
187
29k
Done Done
Avatar for chrislema chrislema
186
16k
Docker and Python
Avatar for Tania Allard trallard
47
3.7k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
0
110
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.1k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.7k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
8.3k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
18
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
110

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