Technology News

Yes, Design Systems Do Improve Developer Efficiency and Design Consistency

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—everyone wants a flashy design system—but is it worth the cost?

That question is tough because developer productivity, front-end quality, and even accessibility to some extent, are all such nebulous things. In contrast, this is one of the smartest things about Google’s Core Web Vitals because it puts a number on the problem and provides very actionable things to do next.

When it comes to design systems, we don’t really have metrics that we can point to and say “Ah, yes, I need to put folks on the design systems team so that we can push our design system up from a bad score of 60/100.” It would be neat if we did, but I don’t think we ever will.

Enter Sparkbox. They wanted to fix this by testing how much faster their eight developers were in a little test. They got their devs to make a form, by hand, and then do it again using IBM’s Carbon design system, which they’d never used before.

The results are super interesting:

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.

Now imagine if those devs were familiar with Carbon’s design system! If that was the case, I imagine the time to build those forms would be way, way faster than those initial results.

Shipping is broken. Here’s how to fix it.
Favicons: How to Make Sure Browsers Only Download the SVG Version

Related Articles

A Thorough Analysis of CSS-in-JS

a-thorough-analysis-of-css-in-js
Wondering what’s even more challenging than choosing a JavaScript framework? You guessed it: choosing a CSS-in-JS solution. Why? Because there are more than 50 libraries out there, each of them…

If aliens are calling, let it go to voicemail

If aliens are calling, let it go to voicemail
Humans have invented a rogue’s gallery of nightmarish fictional aliens over the decades: acid-blooded xenomorphs who want to eat us and lay their eggs in our chest cavities; Twilight Zone…

Different Ways To Download GST Certificate?

Different Ways To Download GST Certificate?
The CGST Act mandates that businesses register according to the prevailing GST laws, depending on their turnover and the goods or services they produce and sell. When you register your…

Building Interactive Figma Widgets

Building Interactive Figma Widgets
Figma has always encouraged collaboration between developers and designers. It strives on an endless treasury of community-made plugins. Need 3D elements? There’s a plugin for that. Need abstract SVGs? There’s a plugin for that, too. That said,…

Vue vs React: Everything You Need To Know

Vue vs React: Everything You Need To Know
Vue and React are two of the most popular tools for creating JavaScript web applications. But how do we choose between them? That’s what we’ll try to figure out in…