Agency
Year
2022 – 2025
Role
Senior Digital Designer, Design Lead
Links
1. What Limbo Citi Is
Limbo Citi is Limbo.works’ shared web platform built specifically for Danish municipalities. Municipal websites are unusually large and operationally critical: many exceed three thousand pages, involve teams of editors, and serve millions of citizens with essential information. They must be highly accessible, resilient to heavy traffic and DDoS attacks, and maintain consistent quality across departments and content creators.
Instead of every municipality operating its own independently designed and coded website, Limbo wanted to create a unified, scalable platform—a shared product that municipalities could co-own. Limbo Citi provides that foundation: a common codebase, shared feature set, and a unified design system that supports individually branded themes.
What is Limbo Citi? I planned and animated a short product presentation for Kommunikationsdøgn, an annual conference, where approximately 350 municipal communication professionals gather for 24 hours of professional immersion, peer exchange, networking, and inspiration. The conference focuses on new tools, strategies, and current challenges within communication in Danish municipalities. Assets generated in Figma, animation done in AfterEffects.
Custom front page design and Limbo Citi theme for Nyborg Kommune.
2. The Core Challenges
When I joined, Limbo did not yet have a product—only bespoke client websites delivered one by one. The company needed to pivot toward a product model able to support many municipalities at once. This meant building the first version of Limbo Citi from scratch: a single platform flexible enough to accommodate unique visual identities while remaining maintainable as a unified system.
Scalability was the central challenge. The platform needed a theme architecture that allowed dozens of municipalities to look and feel unique without fragmenting the underlying system. Because municipalities undergo strict external WCAG AA audits, accessibility also had to be baked deep into the system—not added on a case-by-case basis.
The product was shaped by a community rather than a single client. Multiple municipalities contributed feedback and requests, each with its own priorities and political pressures. Part of the challenge was navigating this collective decision-making and maintaining coherence without letting the shared platform splinter into competing versions.
3. My Role
As lead designer, I owned the design system and the UX foundation of Limbo Citi for nearly three years. That included developing the token architecture, creating the core component library, designing more than sixty templates for content and pages, and shaping the theming workflow used to onboard new municipalities. I collaborated closely with frontend and backend developers to ensure the system was implementable, performant, and worked well inside Umbraco Backoffice, where municipal editors spend most of their time.
I also partnered with the product manager to help define the roadmap, align the priorities of the municipal community, and ensure the platform evolved in a scalable, product-minded direction.
4. Approach
4a. Systematizing the Foundation
Before I joined, Limbo’s design workflow did not use design tokens, components, auto layout, structured file architecture, or any systematic link between design and development. Establishing these fundamentals was a key part of making Limbo Citi possible. I introduced a token-based design system, component libraries, naming conventions, and a scalable project structure that aligned designers and developers around the same source of truth.
Screenshot from Library file showing page structure. All components had a separate page making navigation easy for developers and designers alike. This image show the Borgerforslag Card. On this page, all sizes, states and variants were built, organised and commented.
Snippet from Drop Down Menu page in Library file. Built before Figma Variables, all components were designed for desktop, tablet, and mobile sizes. Since frontend worked with a fluid layout, designs corresponded with frontend interpolationpoints. Components were built following the atomic principle using nested components for maximum flexibility and reusability.
4b. Design Tokens as the Backbone
I designed a flexible token architecture using Token Studio and Figma variables to control color, typography, spacing, radii, and other foundational styles. Tokens allowed us to generate themes quickly and work in a way that maintained perfect consistency between design and code. This system meant that when we needed to update accessibility or introduce a new feature, we could do so once—across every municipality.
4c. Library and File Structure
Because the product would grow for years, I designed the Figma architecture around many small, purpose-built files rather than a few heavy ones. Each feature lived in its own file, with version-controlled pages documenting its iterations. Two main consumer files—one for blocks and one for page types—pulled from the central library. This structure kept performance high, gave us clean version history, and made onboarding new designers easier.
Both files for content and page templates were structured this way showing design across three screenwidths. Each page contained one feature and also showed examples of page/block states or edge cases (shown on left side).
Example of a page template with a placeholder area for dynamic content.
4d. Theming Model
Themes were generated from the central library using design tokens as the only adaptation layer. Clients received not only a branded theme but also a custom front page and, when appropriate, unique navigation strategies or structural differences. Because tokens carried the majority of styling decisions, updating a theme or adopting new features was fast and predictable. In practice, I could create a fresh theme in under 30 minutes.
5. Results
Limbo Citi is now a live, growing product. At the time of writing, thirteen municipalities have been onboarded, and more are coming. The theming workflow, backed by design tokens, reduced the cost and time required to onboard new clients and improved overall product consistency.
Accessibility benefits scaled immediately. Because improvements were made centrally, the entire platform evolved in unison, reducing audit overhead and producing more robust results than individually developed sites ever could.
Municipal editors reported a better, more intuitive editing experience in Umbraco Backoffice, driven by clearer content types and predictable patterns. From a business perspective, Limbo successfully shifted from delivering bespoke projects to operating a scalable platform with recurring revenue and a unified roadmap.
Examples of diversity in theming.
Above: Jammerbugt Kommune.
Below: Spinderhallerne (Vejle.dk subsite), Viborg.dk, Vejlemusserne.dk.
Limbo Citi not only used for municipal websites like Vejle.dk. A lot of municipally owned subsites, like Vejle Museerne, are now built on Limbo Citi, as well. This shows custom front page Hero element and page transition for Vejle Museerne.
6. Learnings
Working on Limbo Citi reinforced the importance of strong foundational systems. Good token architecture takes time and many iterations, and while nested tokens are powerful, they require disciplined documentation. I learned a great deal about designing CMS-driven pages, especially when the editor workflow is just as important as the public-facing UI.
On the design side, I confirmed that in large, multi-year Figma projects, complexity is unavoidable—but you can decide where it lives. I chose to distribute it across many small, well-organized files rather than a handful of bloated ones. With clear naming and thumbnails, even a project with a hundred files can feel lightweight and easy to navigate.
Most importantly, I learned how to balance product coherence with the needs of a large community of stakeholders—guiding their input while protecting the integrity of the platform.
