FRACTL design system
Client | Virtusense
Date | Nov. 2022 – April 2024
project overview
VirtuSense Technologies is a mature start-up with with an array of products. Due to rapid iteration, much of the UI varied in style.
When I interned there, one of my main focuses was creating a design system to save time on our team of two designers, with prospects of getting developer buy-in to reduce production time and maintain brand fidelity.
design system mistakes
- I was rather inexperienced in Figma when I started! I did things the hard way, and only after spending a summer at a more mature company was I able to come back and fix my mistakes.
- I started from scratch – and I really shouldn’t have. I should have started from an existing system (preferably a library our developers were building off of – Bootstrap).
- With UI development offshore and third-party, trying to align with developers was hard. I should have spent less time trying to get their buy-in for something like Storybook, and more time templating our documentation.
design system impact
- Freed up designer attention to the bigger picture
- Significantly sped up the designing process
- Equipped a non-designer to step up and begin creating designs
- Provided developers with consistent components
- I developed a passion for design systems, and exploring how they could most effectively assist designers across a company
system snapshots
We had A LOT of different product brands and states to account for with our buttons, which were the main source of brand differentiation.
Separate icon buttons assured that spacing was clean.
Mobile buttons were bigger and softer.
Custom sliders made to adjust sensitivity settings for bed exit attemps.
Only a couple of these headers came to reality, but I'm still holding out hope!
Mobile headers had less leeway for branding, and was mostly pushed off to the buttons and side panels.
Tables were custom-made through much trial and error. This ensured different cells could be switched out and still maintained their sizing properties.
