Case Study
Rebuilding Sitecore's Design System for Scale, Governance, and AI
01
Blok is Sitecore's design system: a shared design language that powers consistent experiences across Sitecore's products and marketplace applications.
Although my formal title was Product Designer, I acted as design lead and acting product manager of Blok. I helped lead the initiative to rebuild the design system from the ground up, spanning architecture, design, adoption, documentation, and AI enablement.
What started as a UI library became a foundational platform used by designers, internal and external engineers, product managers, and executives to rapidly prototype, align, and ship ideas, especially within AI-driven workflows.
02
Blok existed, but it was no longer fit for the organisation Sitecore had become.
a
Blok was originally built on Chakra UI v2 back in 2020. While effective for early velocity, it created a structural problem: any deviation in styling required editing core components, which blocked future updates or forced re-implementation on upgrade.
Result: Visual drift, fragile upgrades, and no enforceable design governance.
b
With the launch of the Sitecore Marketplace, external teams began building extensions using different React frameworks.
c
As AI coding tools (Cursor, Copilot, v0) became central to how teams prototyped, Blok became a bottleneck.
Result: AI tools struggled to generate on-brand, usable UI, undermining speed and consistency.
03
As the sole designer on the initiative, partnered with two senior solutions architects, I helped closely with the evaluation of alternative platforms.
We chose to rebuild Blok on Shadcn, not as a UI kit, but as an architecture.
01
Shadcn's registry-based model allowed us to:
This single decision restored long-term governance.
02
A fully framework-agnostic system was explored, but we eventually rejected it due to team size, maintenance overhead, and delivery timelines.
Shadcn struck the right balance:
03
Shadcn is widely documented, commonly used in AI training data, and natively supported by tools like Vercel v0.
This made Blok legible to AI, unlocking a new class of on-brand prototyping workflows.
04
Moving from Chakra v2 to Shadcn, I audited both existing Blok components and Shadcn's baseline library. From this, I defined what to keep, adapt, or retire; prioritised components against active product roadmaps; created a tracked component roadmap in Jira; and authored build guidance for consistency.
Development initially became a community effort, with engineers joining from teams already adopting Shadcn and myself chasing down developers to help review PRs.
After the first wave of components were built by myself and contributing developers, I interviewed designers and developers about how they actually used Blok, broke down Sitecore design patterns into rules documented in each component file, and interviewed developers implementing the new components to find problems early.
Blok initially struggled with adoption as it was not majorly publicised or advocated for. To fix this, I proactively intercepted new projects, presented Blok at an R&D town hall (150+ attendees), and framed Blok as an acceleration tool, not a design asset.
This shifted perception and adoption followed. R&D leadership pushed more projects to use Blok and we started to see more initiatives being built from Blok.
As the initiative grew traction, we were allocated budget to hire a team to get Blok into production for Sitecore Marketplace and continue growing its scope.
Once the team was hired, I onboarded them with presentations on Blok's history, philosophy, and roadmap; created their first Jira tickets to guide which components and docs pages to build; and reviewed PRs with feedback in grooming calls and sprint planning.
After a few months the review feedback became fewer and the team were fully set up for building out greater projects within Blok.
Ahead of Symposium 2025, where Blok was to be announced as released, the docs site was not ready due to delayed hiring of the team.
I made the decision to release the registry as a Beta, without a docs site, rather than delaying the whole release:
Post-Symposium, we incorporated feedback and shipped the official release weeks later.
05
~10k
Estimated monthly installs via registry
100%
Adoption in new marketplace applications
3+
Internal teams fully migrated
During an internal AI-SDLC workshop, I enabled every participant to prototype using Blok. The resulting demos looked cohesive, were on-brand, and required minimal design input.
These were presented to the CPO and CTO, who explicitly praised the quality and refinement enabled by Blok.
06
We initially over-customised components to preserve legacy visual behaviour from the Chakra v2 version of Blok. This came at a cost: we overwrote parts of Radix's native structure, and AI tools performed worse as a result.
In hindsight, we should have accepted more behavioural change in favour of AI and architectural alignment.
This was my first zero-to-one platform initiative as a solo designer and acting product manager. I got hands-on with roadmap ownership, executive visibility, and cross-org dependency management.
Blok fundamentally changed how Sitecore builds, prototypes, and aligns, and reshaped how I think about design systems as organisational infrastructure, not UI libraries.