Alexis’ Design System
Client: Alexis HR:: System Design | UI Design
Project completed in AlexisHR Sweden, 2021
Background
To build a working design flow within Alexis, a design system must be established as soon as possible to increase product shipping speed and consistency. This process lined up quickly after the shipping of the Alexis branding system.
It was a one-person design team with a challenge to create an "MVP" design system from scratch within three weeks in parallel with a facelift for the product's Dashboard, and the launch of Alexis’ new website. Hence the priority is "HMW developed a design system for Alexis within the shortest time frame possible, building a foundation for product facelift and consistency; while making it comprehensible and accessible for everyone in the Dev. team."
Process
The team quickly decided to run an iterative process in developing Alexis' design system.
An attempt was made to build the system from complete scratch. Still, with the product (Dashboard facelift) dateline, it was immediately identifiable that this would not be the most strategic way to go.
Looking into what exists in the field amongst many established Design System templates, a foundation system was found helpful:
https://www.thedesignership.com/products/figma-design-system
Looking for an "outsourced design assistant" to help build the foundation for Alexis' Design System.
From there, full customization took place according to what was needed in Alexis' product development process. The first Alexis' Design System was launched in parallel with the product's Dashboard facelift and the brand's new website within three weeks!
Iterations on the Design System took place during my time with Alexis to improve functionality and user (dev. team) experience.
Video tutorials was created to guide anyone with the access to Alexis’ Design System. The tutorial series covers guidance to:
2. How to set up and connect the Design System to your Figma file
3. How to publish your changes in the system
4. How to create customised materials for your design
5. How to put your design together and design your first app page from scratch
Design
Copyright of images belong to their owners.
Impact (Pros)
- Increase on product consistency.
- Increase on product development efficiency.
- Simplified product development process.
- Works cohesively with the branding system, increase on branding consistency.
- Timeless design, easily expandable.
Impact (Cons)
- Too complex on it’s first launch, that could be overwhelming for the users.