![]() ![]() In the end, everyone participated in their free time, so while some people were able to get it done in a day or two, other developers had weeks or months between their scratch-coded and Carbon submissions.įor time scoring, each developer was asked to use their timesheet tool’s timer (we use Harvest) to record how long it took them to complete the scratch submission and the Carbon submission.įor visual consistency and accessibility reviews, each of the eight reviewers was given a randomized list of submissions. And, we figured any advantage they gained by scratch coding first would be mitigated by having to familiarize themselves with the Carbon design system. We didn’t want to influence their handbuilt code by showing them how Carbon would’ve coded it first. You might be wondering why we had the developers code the form from scratch first. We gave the developers the following instructions for the code exercise. Some of our developers had previous experience building and using design systems before, while others did not.Every Sparkbox developer has had significant accessibility training, and two of Sparkbox’s IAAP certified Web Accessibility Specialists participated.All the developers were full-stack, but some were frontend focused while others were more backend focused.Professional development experience ranged from junior developer to senior developer.The eight developers who coded the forms came with a variety of experience: More about Our Developers and the Methodology If accessibility is not typically a priority for your organization, a design system may help you more than it helped us. ![]() Since many of our developers are deeply knowledgeable and focused on making the web accessible, we are a little different from many teams. Two of the developers who coded submissions were IAAP certified Web Accessibility Specialists. ![]() Let’s be honest, Sparkbox is great at building for accessibility-it’s just how we work. Two developers’ scratch submissions bested the design system for accessibility.Three developers’ hand-coded submissions and Carbon submissions ranked roughly the same for accessibility.Two developers saw their accessibility improve slightly when using the design system.One developer went from last place to the middle of the pack for accessibility when they used the design system.Only one developer’s scratch coding soundly beat their design system submission.The visual consistency score for two of the developers was roughly the same for their from-scratch submission as their Carbon submission.In fact, one developer went from 14th place out of 16 for their scratch submission to first place for their Carbon submission. Visual consistency for five of the eight developers improved when using the design system.The top two submissions for visual consistency used the design system. ![]() In fact, only one of the eight developers built a form from scratch that ranked higher in visual consistency than the form they built using Carbon. Using a design system helped our developers produce code that was more visually consistent with the design. The Carbon timing included the time the developers spent familiarizing themselves with the design system. The median time for the scratch submissions was 4.2 hours compared to the 2 hour median time for Carbon submissions. Using a design system made a simple form page 47% faster to develop versus coding it from scratch. The Testīased on our sample of eight Sparkbox developers, we uncovered the following: The individual rankings were combined for an aggregate score. Next, another eight Sparkbox team members reviewed the hand-built forms and Carbon forms for accessibility and for visual consistency, ranking the submissions from best to worst. Then we compared the median and average times to determine efficiency Then they coded the form using the Carbon design system, again while timing themselves. We recruited eight Sparkbox developers to code the form from scratch while timing themselves. Then a Sparkbox designer used Carbon to design a contact form in Figma. We picked a well-known design system that was publicly available, had excellent documentation, and that none our developers had ever used. We wanted more proof, so we decided to test our hypothesis, “design systems help developers produce better code faster.” Our test subjects? A handful of willing Sparkbox developers. But measurement can be challenging, and even here at Sparkbox we’re often relying on anecdotes from our own projects or from self-reported metrics that we’ve gathered from our annual design systems survey. Design systems are great for developer efficiency, visual consistency, and accessible experiences. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |