Get help Color blind mode Low vision mode

About Duet #

Duet is a collection of reusable components and tools, guided by clear standards, that can be assembled together to build digital products for LocalTapiola and Turva.

The goal of Duet is to improve UI consistency and quality, while making our software design and development processes more efficient. Duet also helps to establish a common vocabulary between everyone in our organization and ease collabo­ration between different teams and disciplines.

The name “Duet” resembles the fact that there are two separate themes. One for LocalTapiola and one for Turva. “A duet” is a musical composition for two performers in which the performers have equal importance to the piece, often a composition involving two singers or two pianists.

Duet has a core team of designers and developers inside LocalTapiola who are dedicated to building and supporting the system.

Features #

Use with any framework #

Duet makes it easy to implement and use its packages across any framework or no framework at all. We accomplish this by using standardized web platform APIs and Web Components.

Accessibility baked in #

Duet comes accessibility baked in and provides support for W3C’s WCAG 2.1 spec. We make sure all our components support touch screens, keyboard navigation, screen readers, and more.

Powerful theming tools #

Duet comes in two themes and allows you to choose globally or locally per component which theme you want to utilize.

Optimized for performance #

Duet is built to be as fast as possible in terms of both network footprint and the time it takes to become interactive. Our components runtime, design token system, and CSS framework weigh just 5.8 KB combined.

Structure #

Duet is divided into six front-end packages and a Sketch Toolkit that the designers use. These tools can be used together or separately depending on your team’s needs. Provided packages include:

Duet Package

Design Tokens

 Duet Package

Components

 Duet Package

CSS Framework

 Duet Package

Icons

 Duet Package

Fonts

 Duet Package

CLI

Our goals #

  1. Improved work efficiency for designers and developers.
  2. Improved user interface consistency and quality.
  3. Improved communication between teams and people.
  4. Shared documentation platform.

Terms of use #

Duet Design System is solely meant for building digital products and experiences for LocalTapiola and Turva. Please see the terms of use for full license details.

Edit