Application UI/UX
Unified Design System
As the Teamworks company grows through acquisitions, there is currently little consistency across product lines as well as within each product. Figma files have become cluttered with legacy libraries, detached components, unused fonts and excessive colors. This has caused confusion not only for the designers but also during development hand-off.
DESIGN PROBLEM
Create a unified design system for a product suite, which will be applied across multiple products.
PROJECT GOALS
By creating consistency across all product lines I aim to streamline not only the time it takes to design screens but to develop them as well. Using a single library will allow development to possibly share code bases without having to recreate a design and eliminate discrepancies.
I took inspiration from Material UI to create atomic components the design team can use across all product lines. I want to focus on applying guidelines so that each product looks the same even though they may function differently. I designed basic components that can be used as building blocks to larger components needed to fit subsequent design systems.
DESIGN ANALYSIS
I conducted a thorough review of all our other apps to assess the layout and components of each, to ensure that the new design system aligns with the needs of each individual product. This will result in improvements to the overall user interface and user experience.
Final Product
Final Product
As a result of this review, I was able to design an inclusive system that will improve efficiency for both developers and designers. The individual components are designed to be easily customizable to the specific needs of each product, allowing for faster coding and design of screens.
