Design system

AGID Design System

Client

AGID — Agenzia per l'Italia Digitale

My role

  • UI Design

Summary

I collaborated on the design of the UI Design System for the Digital Italy State Agency.

The AGID UI kit and design system

At a glance

+30%
faster design
+45%
faster development
10,000+
public administrations
2018
national rollout, ongoing

Impact figures published by Design System .italia, the Italian government’s national design system, which I contributed to.

Project summary

As Digital Facilitator working for the Italian Ministry of Education and Research, I had the chance to collaborate on the Design System of a common UI to be used by all services of the Italian Government, commissioned by AGID — Agenzia per l'Italia Digitale (Digital Italy Agency).

The whole project was devoted to maximum recognisability, neutrality and clearness: an interface that makes people feel they are using something familiar, helping the UX develop clear communications and comfortable user experiences.

As a typeface, Titillium was adopted — a type developed by the students of the Campi Visivi Type Design Course at the Accademia di Belle Arti di Urbino (Fine Arts Academy of Urbino).

UI Design Design system Components Documentation Sketch → Figma

The design system

The so-called UI Kit is an enormous work involving many designers from companies and public institutions. The work started in 2018 using Sketch for the UI and the design system, with InVision as a collaborative platform; recently Figma was adopted as the design platform, and the work is still in progress.

At the present day, the design system consists of 12 chapters and 62 sheets covering the various aspects of the UI:

Typography Colours Grid system Buttons Icons Navigation Data entry Data display Layout Instruction Feedback Progress indicators
AGID design system style guide sheets
Sheets from the UI kit.
Next project MonumentApp — Product design