Matias Vaara at Mindtrek 2016. A Digital Design Language for Finland 
- What, why and how.

1. ADigitalDesign
Languagefor
Finland
What,whyandhow.

2. BOOKING A TIME IN HELSINKI BOOKING A TIME IN VANTAA

3. Let’s solve common user exprience problems
once and share the benefits across cities.
THE IDEA

4. Let’s create a design language with ready to use
elements for digital services, but with local
branding.
THE IDEA

5. 1. Current challenges

6. 1. CURRENT CHALLENGES
1. Cities digital
services are difficult
to use
2. Cities create digital
services in isolation
3. Implementing
services is slow and
expensive

7. 2. What does a Design
Language mean?

8. 2. WHAT DOES A DESIGN LANGUAGE MEAN?
A Design Language is a set
of best practices and user
interface elements for digital
services.

9. 2. WHAT DOES A DESIGN LANGUAGE MEAN?
1. Best practises for easy to use and
useful digital services
2. Ready to use templates for most
used UI elements
3. A set of steps and guidelines for
involving users in design

10. US web
design
standards
https://playbook.cio.gov/
https://pages.18f.gov/designstandards/

12. http://www.ibm.com/design
IBM
Design Language

14. https://design.google.com/
Google Material
Design

15. 3. Why Create a Design
Language?

16.
1. Cost savings
For Cities
4. Improved
city brand
2. More agile
service
development
3. Less vendor
lock-in
3. BENEFITS OF AN DESIGN LANGUAGE

17.
5. Easier to use
digital services
6. Familiar UX
across cities
3. BENEFITS OF AN DESIGN LANGUAGE
For Residents

18.
7. Quicker to
develop
8. Less need for
design expertise
3. BENEFITS OF AN DESIGN LANGUAGE
For Developers

19. 3. BENEFITS OF AN DESIGN LANGUAGE
1. Cost savings
For Cities For Residents For Developers
4. Improved city
brand
2. More agile
service
development
5. Easier to use
digital services
6. Familiar UX
across cities
7. Quicker to
develop
8. Less need for
design expertise
3. Less vendor
lock-in

20. 4. How to create a Design
Language?

21. 4. MITEN MUOTOILUKIELI KANNATTAA LUODA?
1. Finding the best
practices for digital
services and
generalizing them
2. Creating a library of
the most used user
interface elements
3. Involving citizens
and city employees
4. Continuous and open
development

22. MUOTOILUKIELI.FI
Muotoilukieli.fi
is an open platform for hosting
and updating the principles
and elements of the design
language.

23. 5. Design Language in Practise
NOTE: Only illustrative examples, not ready solutions!

24. BOOKING A TIME IN HELSINKI BOOKING A TIME IN VANTAA

25. Matti is developing an
Events-service in Turku.
He takes the ready
React-code snippets
from muotoilukieli.fi for
the UI.
READY MADE CODE

26. Several services can be
included into one
consistent user
exprience.
CONSISTENT EXPERIENCES