A design system for one of the largest universities in Finland. Built for running operations, kickstarting student experiments and conducting research.
Established in 2010 from a merger of three major universities Aalto is a Finnish institution. Working in the fields of science, arts, technology, and business with a common goal to shape a sustainable future.
With thousands of creators, high quality digital touchpoints that feel inherently like Aalto are needed to fulfill a myriad of needs.
Robert Salvén
Head of Digital Experience
People at Aalto need digital touchpoints to:
Arrange studies and courses
Reserve spaces and accommodation
Organize art exhibitions and lectures
Research and distribute findings
Kickstart product ideas and startup companies
Run student organisations
The project began with a pre-study to define the requirements for implementing Aalto Digital Experience (Aalto DX).
In the beginning, it was necessary to understand the required resources, actions, governance model, and cultural changes, and also define brand, design, and technical requirements. The goal was to use this information to predefine what Aalto DX will be and how it should be formalised.
Pre-study was based on qualitative research conducted using interviews. The goal of the interviews was to gather detailed information from individuals' perspectives.
The pre-study indicated that Aalto University should streamline the user experience and brand consistency across different systems. It emphasized the significance of developing tools that cater to the diverse needs of the university's users. By offering a cohesive digital experience and relevant tools for researchers, students, startups, and university personnel, the aim is to facilitate productive and engaging work for everyone involved.
To tackle these issues, we decided to create a unified design system for Aalto University. collaborating with Aalto Brand and Creative, hasan & partners (the brand agency), and Siili Solutions (the website services provider).
Taiste's role was to handle the entire implementation of the design system, covering both design, technical aspects and development.
The design system was rolled out in phases, with simultaneous work on UX, UI, and development to ensure flexibility for ongoing brand work.
Digital customer experience and brand strategy were crafted in collaboration with the brand agency.
We reviewed the university's chosen services, identified common design elements, and created unified wireframes to serve as templates for common use cases. These templates were then validated through user interviews.
UI design and building of the design system foundation were carried out collaboratively with development and brand teams to enable seamless token integration from brand level to code.
included several steps, including specification work, platform and integration development, and ensuring accessibility and environmental friendliness across all digital touchpoints.
A design system was built to meet the need to create accessible, technology agnostic and consistent digital touchpoints.
Toolbox for anyone at Aalto University creating or maintaining digital services. Framework that helps maintain a consistent user experience throughout all digital services and touchpoints while enabling teams to work more efficiently.
The system is based on Aalto’s values: natural, inclusive, confident and progressive. These values guide the system to emphasize accessibility, green coding and flexibility.
A technology agnostic approach was selected to give all parties the possibility to utilize the system.
Design tokens were built to enable Aalto’s radical creativity, while ensuring a cohesive user experience and facilitating accessible design choices.
The system is structured in tokens, components, modules, sections, and, in the next release, templates, to help different user groups including designers, developers, and editors.
Figma library, Storybook, and website guidelines are included in the system for different users: those building the system and those using it.
A governance model for guarding, guiding and updating the system was planned and implemented.
Aalto design system meets all WCAG 2.1. AA accessibility standards. Every component in the system adheres to various guidelines related to color contrast, typography, and navigation. This assures that everyone can engage with Aalto University's digital touchpoints, regardless of their abilities or assistive technologies.
Environmental sustainability goals are supported through green coding practices.
The Aalto design system encourages collaboration by inviting active participation and contribution to its growth. A dedicated Slack channel fosters collaboration, providing support for university-wide projects.
Collaboration between Aalto communications, Aalto Brand, Hasan & Siili:
Are you interested in learning more about design systems – or perhaps wondering whether you should create or improve one with us? Whatever the case, this guide has got you covered.
We are here for you – get in touch! Want to send us your CV instead? Head on over to our Careers page to see open positions.
Drop us a line
