Challenge
Bloated design system for Isentia SaaS platform that was originally adapted from IBM’s Carbon Design, but customised enough to no longer resemble it. Documentation on component use was incomplete and done in Figma, which is time consuming and not reusable for devs to search and implement components. Platform design also implementation issues with the grid. The changes and branding application to the design system also caused WCAG compliance issues, which had to be rectified to fulfill government client contracts. There was also the inconsistencies with the design branding applied to the native apps (iOS and Android).
All design system issues need to be worked on while also completing BAU feature work, which means juggling between prioritising and implementing some problematic components while improving it.
Outcome
Successfully streamline design process and Increase design to development delivery speed by 100%. Removed unused components, designed and deployed with team WCAG 2.1 level A compliant design and on track to be level AA compliant by Mar 2023.
Design system documentation was moved and updated into Storybook for easy access and quicker implementation by devs, speeding up feature delivery. Updated and implemented brand design to native apps for a seamless experience between all products.
Isentia mobile apps could be found on Apple AppStore or Google Play
Process
Familiarise and understand component usage and implementation on all products (SaaS platform, iOS app and Android app) with design and dev teams
Conduct design system audit with comprehensive component checklist and WCAG 2.1 (SaaS and native apps) including internal investigation using Google Analytics, Google Firebase and iOS App Analytics on user interactions
Scope, plan and propose solutions for feature work with product owners, developers and other designers (cross-functional)
Conduct design reviews, workshops and prioritisation with developers and other designers to improve and streamline usage of the design system
Design and deliver high fidelity UI while improving and inject component fixes where applicable with feature teams (2 feature teams for SaaS platform, 1 iOS and 1 Android native app teams) - simultaneously managing other component improvements by frontend dev team dedicated to the design system.
Mentoring junior designers on UI best practices and workshop facilitation skills