The Components Behind a Successful Design System
3 likes96 views
Socialization, partnerships, and prioritization are key components of a successful design system. To build an effective design system, one must socialize the goals of the system, build partnerships across different teams, and prioritize work based on strategic goals and metrics. This will help inform what needs to be built and ensure the system delivers value to both internal partners and customers.
The Components Behind a Successful Design System
- 1. THE COMPONENTS OF A SUCCESSFUL DESIGN SYSTEM Socialization, partnerships, and prioritization Ken Skistimas Design Manager, Facebook
- 12. Design
- 13. CodeDesign
- 15. HH:mm:ssHH:mm:ss Cancel Apply 8 21 9 3 4 11 5 12 6 13 7 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 10 Su Mo Tu We Th Fr Sa April 2018 4 5 7 1 8 2 9 3 10 11 12 13 14 15 16 17 18 19 20 21 28 29 30 31 22 23 24 25 26 27 6 Su Mo Tu We Th Fr Sa March 2018 Option Option Option Action Input Text LABEL Hint Text Cancel ApplyTO 09:12:33 AM UTC03/28/201809:12:33 AM UTC03/28/2018 List Item List Item List Item SelectedBreadcrumbBreadcrumbBreadcrumb %15 Alpha 75 Beta 60 Gamma 45 Delta 30 Epsilon 20 Regular 15 Zeta 12 Item NameItem NameItem NameItem NameItem Name 3 82 751 64 9of 180011-20Rows per page 10 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 LAST OCCURRENCE .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ ASSET PATH 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 POINT psi m/s psi m/s psi m/s psi psi m/s m/s UNITS crank-frame-dischargepressure crank-frame-compressionratio crank-frame-suctionpressure crank-frame-compressionratio crank-frame-compressionratio crank-frame-dischargepressure crank-frame-compressionratio crank-frame-suctionpressure crank-frame-dischargepressure crank-frame-compressionratio METER Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim. Dialog Title Cancel Save 1 Status update: Hey this is a message about the status of a bad machine. View Tab Navigation Tab Navigation Tab Navigation Tab Navigation Search Option Option Option Default CTA Step 4Step 3Step 2Step 1
- 20. A DESIGN SYSTEM IS A PRODUCT A design system needs to deliver value to the customers of the products it’s serving.
- 21. A DESIGN SYSTEM IS A PRODUCT A design system needs to deliver value to the customers of the products it’s serving. While solving a problem for product teams inside your company.
- 22. DESIGN SYSTEM + PRODUCT FEATURES = VALUE Styling + new features RedesignStyling only VALUE LOW HIGH
- 24. Code ToolingDesign DELIVERY OF THE SYSTEM
- 25. Are you building the right things?
- 26. Socialization
- 27. Design can be a black box. TRANSPARENCY
- 28. Design can be a black box. Design systems are always evolving. TRANSPARENCY
- 29. Open the process. Design can be a black box. Design systems are always evolving. TRANSPARENCY
- 31. Product Management Engineering Content Strategy Data Science User Research Product Marketing INCLUDE CROSS FUNCTIONS
- 33. Socialization
- 35. Seek out influential product surfaces. Align on priorities and create shared goals. PARTNERSHIPS Make the system real as soon as possible.
- 36. ALIGN TO PRODUCT ROADMAPS New UI FeaturePerformance Improvements Perf + New UI Feature
- 37. ALIGN TO PRODUCT ROADMAPS New UI FeaturePerformance Improvements Perf + New UI Feature OPPORTUNITIES TO INTEGRATE
- 45. Use data and metrics to prioritize. Cross reference with strategic initiatives. FOCUS YOUR EFFORTS Socialize who you’re supporting and why.
- 46. PartnershipsSocialization Prioritization THE COMPONENTS OF A SUCCESSFUL SYSTEM
- 47. Code ToolingDesign INFORM THE DELIVERY
- 49. What you need to build will be informed by the relationships you've built.
- 50. HH:mm:ssHH:mm:ss Cancel Apply 8 21 9 3 4 11 5 12 6 13 7 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 10 Su Mo Tu We Th Fr Sa April 2018 4 5 7 1 8 2 9 3 10 11 12 13 14 15 16 17 18 19 20 21 28 29 30 31 22 23 24 25 26 27 6 Su Mo Tu We Th Fr Sa March 2018 Option Option Option Action Input Text LABEL Hint Text Cancel ApplyTO 09:12:33 AM UTC03/28/201809:12:33 AM UTC03/28/2018 List Item List Item List Item SelectedBreadcrumbBreadcrumbBreadcrumb %15 Alpha 75 Beta 60 Gamma 45 Delta 30 Epsilon 20 Regular 15 Zeta 12 Item NameItem NameItem NameItem NameItem Name 3 82 751 64 9of 180011-20Rows per page 10 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 2014-02-17, 19:33:51 LAST OCCURRENCE .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ .../Unit1/HRSG/ ASSET PATH 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 39VS11 POINT psi m/s psi m/s psi m/s psi psi m/s m/s UNITS crank-frame-dischargepressure crank-frame-compressionratio crank-frame-suctionpressure crank-frame-compressionratio crank-frame-compressionratio crank-frame-dischargepressure crank-frame-compressionratio crank-frame-suctionpressure crank-frame-dischargepressure crank-frame-compressionratio METER Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim. Dialog Title Cancel Save 1 Status update: Hey this is a message about the status of a bad machine. View Tab Navigation Tab Navigation Tab Navigation Tab Navigation Search Option Option Option Default CTA Step 4Step 3Step 2Step 1
- 52. A design system can influence cultural change at your company.
- 53. Start by identifying the value. Open the black box of design. MY ASKS TO YOU Ruthlessly prioritize. ...and make great products.