High Level Page Comparison
A side-by-side comparison of our three main digital properties was useful to show where we can align.
Examples of different purpose
It was helpful to show other examples of web apps that are targeting different audience. While our marketing and customer portal properties target the buyer persona, our products target the technical user. The example on the left shows a site designed for users looking for information—more of our marketing purpose; the one on the right is for technical, analytical users who are scanning through large volumes of data—more of our end-user purpose.
Bringing brand colors into the product
In addition to different audiences, there are other limitations: where the brand team uses proprietary fonts and icon families, the product can’t do that due to the 100% open source nature of products. But, a good way to align is via our color palette.
Another way to align is to use the same logo that the brand uses in corporate communications, and bring consistency to our app headers.
Product Design Language
Finally, similar to the brand having clear guidelines for their communication design, we began the process of creating a clear design language to apply across our products. The language is guided by design principles that align to our brand principles and company values.
Branding and principles are applied to the new product user interface, keeping in mind accessibility and our end users.
Moments in the product
Finally brand expression is brought in by using our brand iconography and modifying it for the engineering persona.