Following several acquisitions and years of product development from separate teams, users of Omnitracs products had vastly different experiences as they navigated from one web app to the next. Our design team proposed the development of a style guide to help unify the user experience moving forward. A library of standardized UI elements and rules would be created to make sure users only had to learn one set of patterns in order to understand all of our interfaces. It also had the benefit of reducing development time. Whereas developers had previously been building UI components from scratch for each project, they would now be able to leverage a shared set of resources.
The company’s existing web apps were not mobile friendly, so our components would need to accommodate the same information users were accustomed to seeing in a way that scaled well on smaller screens. Because we were designing for very data rich applications, we took great care to make sure we maximized the use of available space in a way that worked well for both desktop and mobile. We needed to add enough whitespace to make screens easily legible, but not so much that users would be constantly scrolling to find the information they were looking for.
