Building for scale, not just for now
The hardest part of a global design system is not the components — it's the governance. With designers and developers spread across seven countries and multiple agencies (including Houston Inc., Kurppa Hosk, Accenture Song, Nexer, and KPMG alongside Nordkapp), the system had to be trusted, maintained, and genuinely useful to people who had no hand in building it. We moved Telia from local Sketch files to a Figma-based setup built for enterprise-scale sharing and maintenance. The library architecture covers five categories — Components, Colours and Shadows, Text Styles, Icons, and Grids — all automatically available to every user in the Telia Figma organisation. On the code side, Voca is built with Web Components and Stencil.js, making it framework-agnostic. The same components work in React, Vue, and Angular without a parallel implementation for each. The colour system deserves particular mention. Voca's colour scales are built with contrast ratio as the primary design constraint — each scale step has equal contrast ratios, the middle colour of every scale has similar contrast against both black and white, and the whole system makes moving between themes (including dark mode) predictable rather than manual. The icon library exceeds 300 custom-made icons, with metadata that makes Figma search fast and reliable.
The component library covers 30+ Figma components with full variant coverage, matched precisely to coded counterparts. Documentation lives on Frontify (Telia's Brandhub), with Storybook used for interactive component examples brought directly into the documentation layer.
What Voca changed
A design system is only valuable if teams actually use it. Adoption at Telia's scale required more than good components — it required trust. That trust was built by sourcing the system from the teams themselves. One of Voca's founding principles was that the best patterns from across the seven markets should be elevated to the global level, credited, and shared. Teams that contributed saw their work reproduced across the organisation. That changes the relationship from imposed standard to shared resource. The practical benefits are concrete. Designers work faster because they start from components rather than building them. Developers reduce implementation time by working from tested, accessible, framework-ready code. The 2022 brand renewal — new colours, typography, and visual identity — was deployed across products in a controlled way through the system rather than through individual team-by-team updates. Voca made brand change manageable at scale. Accessibility improved systematically. When accessibility standards are built into the components, every team that uses those components inherits the improvement. Voca raised the floor across the organisation without requiring each team to independently audit and fix their own work.
Benefits documented post-launch: single source of truth for documentation and guidelines; controlled brand rollout across seven markets; increased designer and developer productivity; higher accessibility standards across all products; cost savings from reused components; more uniform customer experience globally.
Next projects.
(2016-25©)
