2020•ux design, ui design
Founded in 2002, the Interaction Design Foundation (IxDF) is the oldest and largest online UX design learning platform, with over 60,000 alumni. However, the design style of the web-based platform has become outdated and inefficient, with poor readability for instance. To continue to grow, we need a principled, ground-up refresh of the platform.
This case study contains only a snippet to maintain confidentiality.
A lack of a principled approach towards designing led to inconsistencies in the platform. Many parts of the platform were also not designed with accessibility and readability in mind. To scale faster and better, we needed to build a system that defines how everything comes together to form a great experience at IxDF.
Hydrogen Design System: a cohesive, principled approach towards building optimal experiences for IxDF. This gargantuan task involved developing a design system, overhauling key user flows, and working closely with the development team to implement it. I was the project lead and product designer.
Before designing anything, I conducted research on:
I developed HDS in 4 stages that build off one another.
First, design principles laid the foundation for the system. Next, building blocks such as principles, typography, and iconography, were created. These let me build components, such as buttons and cards. Finally, components came together to form pages and user flows.
The project doesn’t end with the final design, of course—implementation is a core part of this gargantuan task. With the help of the development team, I created a roll-out plan. I identified key components and pages that are critical to the first iteration, while the remaining would be subsequently pushed out.
View Hydrogen Design System live on the IxDF site.
Teo Yu Siang
UX design
Visual, UI design
IxDF team
Design feedback
Implementation
Got a project in mind? Let's create something crazy awesome together. World domination via wicked design is just a chat (and a coffee) away.
