Skip to content



The Tabby marketing site built on its scaled design system




Tabby.ai

Internationalisation, design systems and right-to-left styling. How we built Tabby.ai's website component library.

Timeline2023/2024
Technologies
SanityNext.jsVercel
ClientTabby.ai
Services
DevelopmentMigrationConsultancyDesign


Introduction

Meeting growth demands

Tabby AI is a leader in the UAE's "Pay in 4" space, and their rapid expansion had outgrown their setup. They needed to scale up their design system and composable infrastructure to work hand-in-hand with their website.

Our job was to build the component library that sits under Tabby AI's whole digital experience. That meant more than code: an accessible interface that worked across their markets, with internationalisation (i18n) and accessibility built in from day one.



Tabby website interface with a dark green banner displaying e-commerce brand logos and product listings with discounts


Infrastructure

Collaborative build & integration

The whole process felt like a true partnership between our crew and the brilliant developers at Tabby AI.

We rolled up our sleeves together, focusing on creating a component library that wasn't just visually slick but also incredibly functional and easy for their team to use and extend.

The latest Storybook component browser let us document and test each component in isolation, which made the whole build faster. Both teams could see progress clearly and iterate quickly. A special shout-out to their designer, Sergii, who documented and scoped components in a Figma environment like I've never seen before.

We weren't just delivering code, we were building a shared understanding and a toolset their internal teams could keep extending long after our involvement wrapped up.



Some brand identity work


Publishing content

Cutting Sanity debt

Alongside scaling the frontend infrastructure, we tackled the backend migration: upgrading Tabby AI's content platform from Sanity v2 to v3.

This wasn't just a version bump but a golden opportunity to slash accumulated development debt and completely rethink their content structures. We checked their existing schemas, identifying pain points and areas for simplification.

The move to Sanity v3 allowed us to implement much more reusable data structures, meaning content could be created once and surfaced dynamically across different parts of their site and apps. This made the editors' lives easier and drastically reduced redundancy and potential inconsistencies. The result was a faster, cleaner, and far more maintainable Sanity Studio that gave them a gold standard in editorial experiences.



Showing the ecommerce side of Tabby


Common questions

Tabby.ai project FAQs

What buyers ask us about the Tabby.ai project, answered from the work itself

What does a component library engagement actually cover?
More than code. We built the component library sitting under Tabby AI's whole digital experience, with internationalisation and accessibility built in from day one rather than retrofitted, because it had to work across their markets.
Can you handle right-to-left layouts?
Yes. Right-to-left styling was a core requirement for the UAE market, designed into the component library from the start alongside the rest of the internationalisation work.
How do both teams stay in sync on a shared library?
Storybook. Documenting and testing each component in isolation made the build faster and let both teams see progress and iterate, and their designer Sergii scoped the components in Figma to an unusually high standard.
Was the Sanity v2 to v3 upgrade just a version bump?
No, we treated it as a chance to cut accumulated development debt. We audited the existing schemas for pain points, then rebuilt around reusable data structures so content is created once and surfaced dynamically across the site and apps. That cut redundancy and inconsistency and left a faster, cleaner Sanity Studio, which is the kind of work our Sanity support engagements exist for.
What happens after you leave?
Their internal teams keep extending it. The library was built to be handed over, which is why the documentation and the shared understanding mattered as much as the components.


Services



Get in touch

Tell us what you're building. We reply within one working day. Jono or someone on the team picks up every message personally.

By sending this you agree to our privacy policy. We only use your details to reply.