How Rules Can Foster Creativity: the Design System of Reykjavík

In today’s digital landscape, where product development is crucial for organizational success, design systems have sparked a debate: Are they a fleeting trend or a lasting standard? While they may seem modern, design systems trace back to fundamental principles of standardization, ensuring consistency and efficiency - from uniform car parts to standard letters we learn in order to read. Various industries have adopted these principles to streamline digital product creation.

At first glance, design systems may appear as mere collections of guidelines and reusable components, yet their benefits extend beyond aesthetics. Establishing a cohesive design language and standardized processes enhances user experience and streamlines workflows, leading to cost savings and improved product quality.

The value of design systems is especially evident in the public sector, where the need to use taxpayer money effectively aligns with the demand for user-centered solutions. By examining Reykjavík’s design system, "Hanna" - which I managed for two years - we can gain insights into how design systems promote creativity, efficiency, and collaboration, with implications for both private and public sectors.

The New Standard or Just a Trend?

While design systems may seem like a passing trend, they undeniably bring tangible benefits to digital product development. By establishing standards and libraries of reusable components, design systems help maintain consistency, benefiting branding and user experience. They enhance product quality by allowing design and code to be carefully thought out, tested, and optimized for accessibility. Only solving each issue once means that time and brainpower can be directed toward overlooked areas, ultimately leading to better products.

As employment tenures become shorter, design systems provide stability. When designers and developers move on, clear boundaries and guidelines help new hires transition more smoothly. Perhaps the most compelling reason to adopt a design system, however, is financial. A systematic approach significantly reduces the time needed for design and development, slashing costs and increasing scalability for larger products or product libraries.

The Public Sector’s Perspective

While financial goals drive private companies, design systems offer unique benefits to the public sector, where the focus is on the responsible use of taxpayer money. Government agencies are obligated to not only create effective solutions but also manage public funds efficiently. Design systems can help with both.

Public sector projects are often slow-moving, requiring legislative input and navigating through multiple layers of bureaucracy. Unlike a nimble startup, running a city is like steering a massive oil tanker. A product that could take weeks to develop in the private sector might take months or even years in the public sphere. Design systems can dramatically accelerate this process, turning ideas into prototypes quickly, leading to faster, more informed decision-making.

Public sector services, such as filing tax returns or obtaining building permits, are often indispensable and unavoidable. However, they frequently possess intricate procedures, resulting in a challenging combination that necessitates innovative and creative solutions. In the public sector, initiatives often come from politicians, meaning great employee ideas are sometimes left unexplored. Design systems make testing and exploring new ideas less risky and more cost-effective, fostering a culture of innovation and creativity.

Services within the public sector are often both crucial and complex.

The Icelandic Reality

Iceland is a global leader in digital infrastructure, with government-provided online services far surpassing most European countries. It might seem surprising that a nation of just 400,000 people could outpace larger countries in digital sophistication, but Iceland’s sparse population has fueled innovation out of necessity.

This technological advancement is evident in the public sector, banking, and other industries. Decades ago, bank branches were scattered across small towns of 1,000 residents, but maintaining that physical presence became impractical. The shift to digital solutions was critical. Icelandic banks responded by developing highly effective online services, enabling people to manage their finances remotely and setting a new benchmark for convenience. The public sector quickly followed suit, with Reykjavík playing a central role in making essential services accessible from the comfort of people’s homes.

Given Iceland’s combination of some of the highest salaries globally and one of the lowest unemployment rates, this push for digitalization is both economically sound and vital.

Meet Hanna

In its pursuit of delivering excellent online services, Reykjavík laid out a digital roadmap in 2019 and established an in-house division to future-proof its offerings. Given the ambitious, multi-year effort to redesign and develop numerous public services - while ensuring consistency and staying within budget - it quickly became apparent that a design system was essential to save time and resources.

This gave rise to Hanna, the city’s design system, named after the Icelandic word for "design" and a common girl’s name. A design agency was brought in to develop the system, creating a set of rules governing colors, grids, aesthetics, and some foundational web design components for Reykjavík’s newly launched website. Many believed the job would be completed once the system was built. However, it soon became evident that Hanna required ongoing management and continuous evolution. Digital needs change rapidly, demanding new features and updates. Additionally, some aspects of the original design - like certain color combinations - didn’t perform as expected, highlighting the need for refinement.

Overcoming Challenges

In 2022, I was brought on board to lead Hanna’s further development. Although Hanna was the largest design system of its kind in Iceland - and one of the largest government systems globally - we faced challenges with internal awareness regarding its true purpose as a tool to simplify website design and development.

Of Reykjavík’s staggering 11,000 employees, the system was primarily intended for use by less than half a percent. Nonetheless, it offered significant benefits to the entire organization. Beyond the development team, most employees had little understanding of what a design system truly entailed. For many outside the digitalization teams, it was merely seen as a repository for email signatures and PowerPoint templates. In contrast, those of us working on Hanna understood that these elements played only a minor role in the overall system.

However, I quickly realized that this lack of awareness was merely a surface issue, concealing two more significant challenges.

The first challenge was the lack of psychological safety within the team. Although the work environment wasn’t toxic, it lacked the openness necessary for team members to express their opinions and challenge ideas. Many team members were relatively new to the field and struggled with imposter syndrome. In such an atmosphere, innovative ideas and refinements often go unexplored, and the best solutions are not always reached, even though everyone is aware of this. When a group can challenge each other’s work and ideas, the results can surpass the strength of the strongest link in the chain; conversely, a lack of openness can stifle potential.

To tackle this issue, we organized a few workshops designed to cultivate a culture of openness, debate, and critical thinking. In these safe spaces, we encouraged team members to share their ambitions, professional goals, strengths, and weaknesses. The objective was to foster psychological safety within the team. Over several months, we focused on bringing every opinion to the surface, striving to make open communication a natural part of our interactions. This shift enabled us to approach problems more professionally and view disagreements as opportunities for growth rather than personal conflicts. Ultimately, this process was crucial for building trust and enhancing our capacity to refine and expand the design system.

The second obstacle was that Hanna lacked an atomic design foundation, limiting the system’s flexibility. Atomic design is a methodology, made famous by Brad Frost, that breaks down UI components into smaller, reusable elements, much like how atoms make up molecules that make up organisms in the human body. In a digital design system, this might look like a page composed of buttons, input fields, and image carousels, all built from predefined elements like border radii, spacing, and line thickness.

Hanna Today

When I parted ways with Hanna, we had successfully overcome significant challenges. We had reimagined and started rebuilding the components library from the ground up, ensuring that each piece was constructed from smaller, reusable, standardized, and centrally managed elements. While implementing this approach sometimes poses challenges for developers - occasionally leading to unintended issues - it typically results in a more agile, scalable system that is easier to maintain, expand, and adapt to evolving needs. The same held true for Hanna.

Stakeholders quickly recognized the value of these changes, and their enthusiasm for Hanna helped fuel our progress. It was incredibly rewarding to see so much support rally behind the system. The greatest challenge, however, was ensuring that upper management fully understood the importance of the design system and the need for its ongoing maintenance - something that often risked being lost in the complex layers of bureaucracy.

By the time I left, the team had reached a consensus on the system’s direction, and components were being rebuilt. We were also deeply involved in a complete documentation overhaul, ensuring it would be clear, comprehensive, and aligned with the new system’s standards. Although much work remains, Hanna is now in the hands of a talented, dedicated team. With continued focus and adequate resources, I’m confident the system will continue to thrive.

Today, Hanna includes dozens of essential website building blocks - such as buttons, date pickers, and mega menus. However, there is still significant work ahead. The ongoing challenge is building new components while constantly refining and improving those already in the library.

The Future of Design Systems

Design systems have already gained significant traction, but many are still in their early stages, lacking atomic design structures. While this approach may seem daunting at first, as more designers and developers grow accustomed to working systematically, I believe atomic design will become the norm.

Today, most teams create their own design systems, but I foresee a shift toward subscription-based or open-source systems that can be customized at the atomic level. We already see this with systems like Google’s Material UI, IBM’s Carbon, Shopify’s Polaris, and Atlassian’s design system.

Adopting a pre-built, well-supported design system makes sense for many organizations. Custom systems are expensive and time-consuming to build, and maintaining them requires ongoing resources, as we learned in Reykjavík. By leveraging a tried-and-tested design system, teams can focus on customization rather than starting from scratch.

Contrary to popular belief, this shift won’t stifle creativity. For public services, there is little need for extreme creativity regarding core functionality - these products simply need to work as expected.

AI will also play a significant role in evolving design systems. Imagine asking your AI-powered design system to adjust your design language, introduce a dark mode, or tweak rounded elements - tasks that will be automated but still customizable.

As digital products mature, we’ll likely see the rise of ethical design systems that prioritize user well-being over exploitative practices like doomscrolling or dark patterns. As the food and fashion industries have certification programs, digital products may soon follow suit. Larger design systems could lead the way toward more responsible, user-friendly practices.