Design system Digital Iceland

Icelanders must, after all, use public services, and as services are transferred more to digital media, design plays an increasingly important role. The state's future vision is for Iceland to be the forefront nation in digital services, and for the communication between individuals and companies and the government to be predominantly digital. Good design facilitates access to the service, increases its efficiency and promotes a positive user experience.

Project ahead

Digitizing the services of the Icelandic state is a task and requires many hands to work together, quickly and safely, and it is important to think big from the outset. Therefore, it was decided early on to set up a design system for Digital Iceland, which would form the basis of the rapidly growing government service offering in Iceland. The design system is intended to ensure consistency in all services, to help the many teams involved in work get on track quickly for new projects, and in particular to facilitate the maintenance and operation of the service in the future.

In short, a design system is a collection of reusable interface elements as well as instructions on how to use them. This could be compared to the cube sets the designers use to assemble and construct everything relating to digital public services, from simple information pages to complex self-service processes. We use a design app called Figma, where designers can work together on projects and use interface modules from one central library.

Principles

Although the system is based on this collection of interface elements, the elements themselves are no more than the surface of the overall process and the thinking behind it. One of the tasks associated with the publication of the system is to summer up the principales underlying all designs for Ísland.is. They should strengthen the overall vision of the project, support decision-making in the process, and serve as a guiding light for all of us involved in creating the digital future of the Icelandic state.

This work is not completed, but here is an indication of some:

• We want design to be clear, simple and appealing

• User needs outweigh the needs of organisations, service providers or those of us involved in the project

• We always try to be human and friendly, and have empathy at the forefront

• We design with intent, in real context and let the material be the focus

• We maintain consistency in our interface and usage and always think about the whole

• We use multi-experienced design patterns, conduct tests regularly, and make decisions based on data and principles.

In relation to these principles there has been much discussion about the Mobile First methodology, which is about thinking about the interface and user flow first from the usage in smartphones. Traffic data from the website Iceland.is show a dramatic increase in smartphone usage, a trend that is growing worldwide. We will therefore emphasise that service design takes this into account and that all designs for Digital Iceland take this methodology into account as far as possible.

Trademark becomes a complete system

When we started work on the design system we got our hands on a brand for Iceland.is from advertising agency Brandenburg. There we had a logo, a colour palette, a font and an indicator of the overall appearance that we built on to draw the interface and visuals of Iceland's digital services.

We strive to reflect the brand in the interface itself, but accessibility requirements do set conditions for our use of colour and particularly when it comes to colour in text. Within this framework, we want to use the colours to make the interface clearer, with a differentiation of its different parts, and also more vibrant and attractive. But to go further in that we were joined by the illustrator Viktoria Buzukina, who created for us a world of images that give life to the interface and create a strong overall picture for the brand. The drawings play an important role in achieving warmth and humaneness in the interface that is so important in digital services.

You could say that the backbone of the design system is the typeface; the font and the font use, but behind it there is much speculation. Literacy is of course in question, but it plays a part in the typeface itself and in matters such as line lengths and spacing, sizes and hierarchy to name a few. The font we use is called IBM Plex, which is an extremely good readout, as well as open-source software, and therefore fits well with the Digital Iceland policy of using open-source software.

To ensure consistency between design and development, the programming part of the system, we decided to completely move the design system to English. There are many diverse teams involved with Iceland.is and designers and programmers who are English speakers, but in addition the development environment is completely English and it is difficult to maintain good coherence if we do not use the same language to describe the components of the system that flow between them. The instructions for designers are therefore all in English and inside Figma, where the units themselves belong. The intention is to provide a website in Icelandic and English that will keep an overview of the design system and the methodology and principals that are based on it, which will be intended for all those interested in finding out about the project, whether the individual is working in Digital Iceland or not.

Pleasant communication

The benefits of using a design system are diverse, for both users and service providers. I, as a citizen and user, have the advantage that when I need to use government services, I receive the same interface and functionality that I know and have learned to use. The experience is that the service is commonplace, although it is interrelated to different institutions, but by providing a comprehensive experience we build trust between the state and the citizens.

The benefits for the state and those involved in the development of digital public services include the design system facilitating oversight and maintenance for the future. The system affects all procedures and encourages thinking about the overall context when developing new services, that each one is a part of a larger whole and has to be built on the same basis. And as was mentioned at the outset, the design system enables teams to move quickly with new projects; the use of the system greatly reduces the development time and allows the state to respond quickly to needs and situations that arise. Compared to the old, unwieldy face of public services, the state can begin to function more like a light and agile innovation company.

The design system therefore plays a key role on the digital journey of the Icelandic state, and will facilitate access to public services and make communication enjoyable — which is yes what is most important in the end.

Open to all

Now the first version of the design system is ready , and for those who want to root only in the chip box , the system is accessible to all . The programming part of the system is also open to everyone on , where you can view the artificial units and see how everything works.

The project was supported by designers and programmers from , with assistance from Aranja and Hugsmiðjan.