Using a design system made a simple form page 47% faster to develop versus coding it from scratch. The median time for the scratch submissions was 4.2 hours compared to the 2 hour median time for Carbon submissions. The Carbon timing included the time the developers spent familiarizing themselves with the design system.<\/p><\/blockquote>\n\n\n\n
Now imagine if those devs were<\/em> familiar with Carbon\u2019s design system! If that was the case, I imagine the time to build those forms would be way, way faster than those initial results.<\/p>\n","protected":false},"excerpt":{"rendered":"One of the toughest things about being someone who cares deeply about design systems is making the case for a dedicated design system. Folks in leadership will often ask you to prove the value of it. Why should we care about good front-end development and consistency? Sure, sure, sure, they say\u2014everyone wants a flashy design […]<\/p>\n","protected":false},"author":223806,"featured_media":355958,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[4],"tags":[1396,878],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/css-tricks.com\/wp-content\/uploads\/2021\/11\/sparkbox-design-system-chart.svg","jetpack-related-posts":[{"id":340573,"url":"https:\/\/css-tricks.com\/2021-design-systems-survey-courses\/","url_meta":{"origin":355888,"position":0},"title":"2021 Design Systems (Survey\/Courses)","date":"May 13, 2021","format":false,"excerpt":"My friends at Sparkbox are doing a survey on design systems, as they do each year. Go ahead and fill it out if you please. Here are the results from last year. In both 2019 and 2020, the vibe was that design systems (both as an idea and as a\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/05\/Screen-Shot-2021-05-13-at-3.54.25-PM.png?fit=1120%2C628&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":286164,"url":"https:\/\/css-tricks.com\/who-are-design-systems-for\/","url_meta":{"origin":355888,"position":1},"title":"Who Are Design Systems For?","date":"April 23, 2019","format":false,"excerpt":"Specific design systems, I mean. Design systems, as a concept, are something just about any site can benefit from. A lot of hype goes into design systems these days. Just the other day, an organization's published their design system publicly and I got a slew of DMs, emails, and Slack\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/04\/design-systems-matrix.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":361971,"url":"https:\/\/css-tricks.com\/design-systems-with-backlight\/","url_meta":{"origin":355888,"position":2},"title":"Build, Ship, & Maintain Design Systems with Backlight","date":"January 27, 2022","format":false,"excerpt":"Design systems are an entire job these days. Agencies are hired to create them. In-house teams are formed to handle them, shipping them so that other teams can use them and helping ensure they do. Design systems aren't a fad, they are a positive evolution of how digital design is\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2022\/01\/hero-css-tricks.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":267589,"url":"https:\/\/css-tricks.com\/consistent-design-systems-in-sketch-with-atomic-design-and-the-auto-layout-plugin\/","url_meta":{"origin":355888,"position":3},"title":"Consistent Design Systems in Sketch With Atomic Design and the Auto-Layout Plugin","date":"March 12, 2018","format":false,"excerpt":"Do you design digital products (or websites) and hand design files off to developers for implementation? If you answered yes, settle in! While the should-designers-code debate rages on, we're going to look at how adding a methodology to your design workflow can make you faster, more consistent, and loved by\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/03\/sketch-stacks-atomic-design.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":263528,"url":"https:\/\/css-tricks.com\/user-experience-design-systems\/","url_meta":{"origin":355888,"position":4},"title":"The User Experience of Design Systems","date":"December 7, 2017","format":false,"excerpt":"Rune Madsen jotted down his notes from a talk he gave at UX Camp Copenhagen back in May all about design systems and also, well, the potential problems that can arise when building a single unifying system: When you start a redesign process for a company, it\u2019s very easy to\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":249663,"url":"https:\/\/css-tricks.com\/animation-design-systems\/","url_meta":{"origin":355888,"position":5},"title":"Animation in Design Systems","date":"January 4, 2017","format":false,"excerpt":"Our own Sarah Drasner: Unlike fonts, colors, and so on, we tend to add animation in as a last step, which leads to disorganized implementations that lack overall cohesion. If you asked a designer or developer if they would create a mockup or build a UI without knowing the fonts\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/355888"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/223806"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=355888"}],"version-history":[{"count":3,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/355888\/revisions"}],"predecessor-version":[{"id":355956,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/355888\/revisions\/355956"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/355958"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=355888"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=355888"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=355888"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}