A global componentized design system
The approach to developing the new Spartan web app was to develop alongside an existing angular.js application. This is was no easy task as not only were there conflicts with the legacy application, but it was also a single page web application. Under a tight deadline to turn around a new application, I got to work on designing and developing a scalable and componentized design system.
This not only allowed us to work quickly in a rapid paced environment, but it also allowed us to create a standardized component library leveraging global design language.
As the component library began to fill up with fully baked modules, the next step was to begin deploying new pages. We started by launching a series of new product pages that we were able to introduce without creating "user shock" upon going live. This started the process of allowing our users to familiarize themselves with the new UI.
I worked closely with several talented engineers to wire up components to ingest data from several different endpoints. Designing around different data structures can be tricky, we found that leveraging a combination of elixir and vue.js to handle server side templating and client side data ingestion was the best fit for this use case.
We began launching new pages built on our new component system in October of 2018. Since then we have been able to deprecate 90% of the legacy application. The application that exists today is faster, more efficient, and of course more aesthetically pleasing.