Where we start
When I started my journey at Xplor education, a team of 3 was challenging when working on new projects with existing design components that needed to be fixed and consistent. Consequently, it caused our work struggle and the need for more communication with stakeholders.
With that in mind, we believe that creating a design system will help us work faster.
Project Overview
Company: Xplor Education
Lead Designer: Mason Maddy
Designer: Nicha Trongsiri, Nga Nguyen
Project Goal
Deprecate the legacy components through improvements and alignment with Stardust and Xplor Global branding, and ultimately have a unified design language and system across our product suite.
Structure
Regarding our products, we have Playground and Home as mobile apps and Office. So that means we need to breakdown the system into 3 parts:
-
Styles: This is where we put the typography and colours system
-
Mobile: This is where we place all the mobile components
-
Web: This is where all the web components stay
After aligning on colours and typography scale, a process that we took time to get done (i.e. eliminate transparent value and make it solid), we adapted it into mobile and web components.
Xplor Education's Design system
Stardust
Reflection
This project is one in which we all get involved. After brainstorming how we want to work on mobile and web components, we let each work on a few pieces and sync up in the design review.
Although we don't have enough resources to make it done in a snap, as it's a work in progress, we continuously update, and it's a fun and great experience for me to collaborate with my team on making the design language to better communicate with stakeholders.