Design Systems
As the ecosystem at Wave expanded, there was a need for a design system to speed up design and development, and to maintain a consistent visual experience across all pages.
At Wave, there are two design systems:
1. Buoyant - An HTML/CSS framework for all components such as typography, buttons, forms, etc.
2. Lighthouse - A React framework that converts Buoyant components into React components.
I was an active contributor to both of these projects, and have learned tremendously about code quality, maintenance, and scalability.
This is Bouyant, our pattern library that housed “styles” for our design system.
This is Lighthouse, our React pattern library that housed “components” for our design system.
A selection of available components from Buoyant.
Button variants
Icons
Form styling
Table styling
Notifications
Wizards
Ripple, our email templating system, allows designers to create desktop and mobile emails given a set of responsive components.
