yoco-logo-coral2

a design system for point of sale and payments applications used by small businesses in south africa.

100%

Of teams use the design system in production.

Lead product designer

Building for non-consumers of traditional point of sale solutions, Yoco sells card machines and provides digital payment solutions with significantly less red tape than traditional providers. a big challenge with a tight team, we grew from 24,000 to over 250,000 businesses. We had to solve for a quality user experience by helping internal teams deliver consistent work and creating the best experience for them possible.
Yoco's merchant app had served us well but wasn't built to scale — inconsistent components rebuilt in isolation by five separate teams, fundamental mistakes baked in early, and accessibility never considered. The fix was a design system: I teamed up with a senior developer to build the component library for the full native experience, in stages, working toward a full product launch on the system and continual adoption as older experiences were replaced. A rebrand gave us the gap to launch it, and I worked with brand and marketing to translate the new look into tokens the product could use — pulling them into the product in a way they hadn't been before.
 
We built it in the open, with brand, growth, founders and engineering all watching the same progress, and baked in the accessibility basics that had been missing: OS text scaling, haptics, sound, W3C-compliant colour. Everything lives in Figma and Storybook, and it's still growing.
 
The first product built entirely on the system was the Yoco Khumo, now the flagship device — immediately faster to assemble than building from scratch, with strong front-end performance out of the box. The real dividend was time: more room for the full customer journey, the details, and the research. The system rolled into every touchpoint incrementally, and that global control has paid off many times over in the speed of every update since.
old_app_overview

the original merchant app designs

slides from a company wide presentation on our efforts

a snapshot of our documentation and tools

Results

Fully adopted by all design teams

Brand consistency across all products

Faster UI design and prototyping

Fully adopted by the engineering team

a consistent experience for the customer

Faster production time