The company's internal application teams were undergoing a major standardization of frameworks, components, and visual design. The main drive behind this effort was to create a unified and branded design system for our globally used employee-facing products.
At the beginning of this project, each app had it's own color scheme, layout choices, conflicting iconography, and dated look & feel. None of them were responsive either.
Futura and Arial were chosen because they are the standard web fonts used on the company's website. To keep things consistent, heading and body font sizes were unchanged from that of the website's.
The three blues were based off of previously documented MathWorks colors but were fine-tuned to have a more modern feel. The alert colors have a variety of uses and were color-blind tested.
Previously used icons were gradient heavy, incosistent, and busy looking. When re-designing the icon library, I wanted to keep things flat, simple, and reserve colors for semantic meanings.
In addition to the visual aspect of the overhaul, sharing code was an important part of the process. The toolstrip and advanced search above are just a couple examples of components we standardized.
I created a guidelines web page to ensure teams would have a set of rules to follow when implementing designs. CSS specs were included on the site so a developer could simply copy & paste values which helped with avoiding one-of designs. These guidelines are still being used to this day.
The first to implement the design system were the BizApps teams which handle customer-related information like customer accounts, licensing, and recruiting.
The IAT portion of internal teams focuses more on development tools like generating bug reports and cluster testing environments.