Vesper is a tool used to automate the creation of TMS tags and Google DCM Floodlights that our team uses to track key user activities on client sites across the globe. Our team had already created a tool for Floodlight automation, but the user flow was clunky, and little thought was given to the style of the interface. Our goal with Vesper was to improve the UX of the tool and update its style to align with our team's new Material-based standards.
The most important overhaul with the tool was re-thinking the UX of Floodlight automation. We designed the user flow to align with the most common use cases for generating Floodlights by hand, and these flows were tailored to handle the tracking needs of the global automotive client. We also wanted to map this functionality onto components and aesthetics that aligned with our new design system.
While we wanted the tool to align with the design system on a component level, it was put forth that the tool shouldn't match our other tools exactly (eg. the Taxonomy Tool). Playing with the color scheme of the tool was one of the first ways we explored different style possibilities. These are some of the new schemes we came up with during the exercise (the Dark Theme was a team favorite).