Skip to main content

January, 2020 #

You’re reading the fifth Duet Design System monthly update. This update focuses on new feature and component improvements we’ve been working on.

The past month has kept us rather busy. We’ve spent most of our time helping developers working in the different product teams to get their applications production ready, while also improving the accessibility of Duet Design System’s Web Components.

Compared to the beginning of December, we’re now down from roughly 30 accessibility issues to just 4 non-critical ones. This means that our components now fully support all the common screen reader and OS combinations like:

In addition to accessibility improvements, we’ve also worked on new components. For some time one of the most requested component has been a modal, so we’re happy to tell that Modal is finally out of prototype status and ready for production use.

We’ve also improved the overall automation for Duet’s icon library. Its generation doesn’t include manual steps anymore, which means we’re able to add new icons or edit existing ones much more effortlessly.

Finally, we’re happy to announce that we have a new frontend developer, Nick Williams, starting to work with us to help make Duet Design System even more robust for the teams consuming it. Welcome Nick!

New this month #

In this section we’ll highlight every month new features and progress from Duet Design System. This month’s highlights include:

import hydrate from "@duetds/components/hydrate"

hydrate.renderToString(content, {
clientHydrateAnnotations: true,
removeScripts: false,
removeUnusedStyles: false

Server side rendering #

Server Side Rendering refers to JavaScript application’s ability to render on the server rather than in the user’s browser. Duet’s components now support this and can be rendered on a Node.js server for better performance.

Updated components view #

We’ve been working on improving the components listing and created preview images for each component. Additionally Duet’s global search has been improved to make it easier to find a specific component.

Introducing tutorials #

To make it easier to learn how to build applications using Duet Design System, we’ve started writing tutorials that currently cover topics like layout creation and server side rendering.

On the roadmap next #

What is 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 user interface consistency and quality, while making our software design and development processes more efficient.

The name “Duet” resembles the fact that there are two separate themes. One for LocalTapiola and one for Turva.

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

Until February!
Viljami Salminen


View All Updates