Style guide for RAÄ

The picture shows snapshots of different views in the style guide
Snapshot of the style guide for Riksantikvarieämbetets digital services.

About the service

A style guide is a graphical library containing the most common GUI components for Riksantikvarieämbetets digital services. It contains both visualisations and code for the most common building blocks used to make similar looking digital services. It contains colors, buttons, typography, icons, logos, favicons and other components like forms and drop-down menus.

My role

This was one of my first initiatives when I started to work at Riksantikvarieämbetet. I am responsible for the content and platform. This is a close co-operation with the development team.

Advantages with a style guide

Except for the fact that Riksantikvarieämbetet now owns their own design it makes development much more effective. There is also a great advantage for guiding and supervise consultant designers. When it comes to accessibility and WCAG it is crucial to keep things controlled over the wide span of digital services.

The picture shows snapshots of different views in the style guide
Examples of guidelines and code snippets

Mirrored in Sketch template

The style guide is also mirrored in a Sketch template for the designers to work with. This makes the workflow fast and easy. From Sketch the prototypes gets transfered to Invision from where the developers easily can find the resources.

The picture shows style guide components in Sketch.
Snapshot from the Sketch template