Using a Design System to Accelerate Development Cycles and Streamline UX

A web3 company that provides white-label NFT solutions for leading brands like Nickelodeon came to 3Pillar Global to help them build custom NFT exchanges for their growing customer base. Each time the company signed a new customer, it kicked off the time- and labor-intensive process of designing and building brand new web/e-commerce platforms from scratch.

CHALLENGE

The company was experiencing many points of inefficiency in their existing development process because of this “back-to-square-one” approach. This was additionally problematic because their internal UX team consisted mostly of graphic designers rather than interface engineers. Because designers often delivered user flows and functionality that required iteration, it was common for developers to need to go back to the designers with rounds of change requests, further delaying the process. Because of this, it was commonplace for the development of each new platform to take up to 3 months.

SOLUTION

It only took a short period of time working together before our UX team identified that a Design System was a more scalable solution to meet their needs than simply continuing the current process. Design Systems always need to solve a problem to be worthwhile. In the case of this client, the stated goal of their Design System was: “Reduce the amount of custom code to allow platform scalability, and reduce maintenance and production costs.”

The Design System we crafted for them encompassed three essential components: a UI kit in Figma housing all visual elements to support designers in achieving greater efficiency, a code-based component library to expedite development and enhance effectiveness, and a GitHub repository utilized for storing and deploying Design Tokens. These Design Tokens served the dual purpose of connecting design files directly to the codebase and conveying customized adjustments to align with the client’s branding. For instance, this allowed us to swiftly transition all buttons across the website from blue to red.

“I would hesitate to do other work before a Design System is in place because it feels like a waste of time until we can really get consistency of design and convention.”

– Engineering Manager, Web3 software company

OUTCOME

The result of our work together led to a drastic reduction in the amount of time it took to onboard new clients and get their NFT marketplaces up and running. Once the Design System was implemented, the 3-month average timeline for each new platform was whittled down to a mere 2-3 weeks.

These time and productivity savings freed up their developers and designers to work on higher-order customizations for clients. This enabled them to provide greater value to clients than the kind of early-stage visual design and development they’d previously had to spend numerous cycles on. By the time we handed over the Design System to their internal team, we’d also coached them on how to use, deploy, and continuously improve their Design System.