One of Finland's most prestigious universities, Aalto is the home of some of the brightest, most creative minds in the Nordics.
We helped them build a comprehensive design system that streamlines their digital experience across the various departments and organisations that the institution consists of.
The project has been a challening and rewarding undertaking, made possible by the lively co-operation between us, Aalto and other agencies (Siili, Hasan & Partners) – all working toghether to create a world-class experience for the students and University staff alike.
Client
Aalto University
Industry
Education
Platform
Web
Services
Design system
Our journey with Aalto began with a resarch project. The university's communications team reached out to us with the idea of seeking to update their digital experience. In order to do this, a research project was needed to pinpoint and validate the issues that should be focused on. From the get-go, we collaborated with the end users to make sure we understood all the nuances of how the Aalto services are used in real life. This philosophy was a key element in our work not just at the start but all the way through.
The results of the research phase pointed out that neither the user experience nor the brand image was consistent across the multiple channels (a plethora of websites and services). A design system that would unify all this seemed like the best long term solution.
The next phase of the project was working our way through the entire digital ecosystem the way it was before the work on the design system began.
Listing and reverse engineering all the components and various ways of doing things was time-consuming but crucial: this list essentially helped us understand all the individual elements the design system would need to contain. With this data, we were able to start piecing together the inner workigns of the actual design system and how it would be presented to the people utlising it.
The part of the design system that lives in Figma is a playgroud for designers and content creators. Simply put, it defines all the building blocks and elements of the design system: styles, tokens, colours, icons, fonts, components, modules – you name it. From Figma, this data can be sent forward to developers as JSON.
Storybook, on the other hand, serves as a home for all reusable code components, created with React. Keeping things technology agnostic was of great importance: the technology stacks of all the departments that would use the design system were fragmented at best, and the design system would have to be something they could all use with minimal fuss.
Accessibility of the university's digital services is an important goal for Aalto, and the design system provided ways to make this a reality, too.
Building the components with a heavy emphasis on accessibility allowed us to not think about accessibility as an "added feature" but as an important building block for the principles of the entire design system.
Aalto Aaltonen
Lorem ipsum