The User Experience Design (UXD) Team is in the process of applying the Overpass typeface across all Red Hat products. This means all our Red Hat applications will be compliant with brand standards for the first time ever. Since typography is the primary visual element in our applications, this typeface change will be a significant step in unifying with brand. This shows collaboration between multiple groups across Red Hat.
This article exposes the User Experience Design Team’s process which is most likely unfamiliar to outside groups. This change is not only a monumental step for Red Hat brand, but will be a major graphical shift which will affect all products across the Red Hat portfolio.
Over time, Red Hat has fought tirelessly to build a brand which is universally recognized across the globe for leadership in Open Source innovation. Red Hat designates considerable resources to developing, maintaining, and protecting this well-earned brand. For this reason, it is important that the brand strategy is extended throughout the Red Hat ecosystem, specifically in their products. One of the primary ways that customers get exposure to the Red Hat brand is by daily interaction with its applications.
Establishing Brand Though Type
Great application design relies on a limited use of graphical elements. The designer relies primarily on type to display data and establish information hierarchy. Presenting clear, unobstructed content is critical to enable users to complete their tasks. Choosing the correct typeface and defining the right styles is not only important for users doing their job; it is also the primary element for setting the tone of the application. Red Hat has developed ‘Overpass’ as the corporate web typeface specific for on-screen use. Overpass is based on ‘Interstate,’ which sets the tone as the brand standard. Overpass can be seen throughout our web properties with the exception of our actual products, until now.
Getting Overpass into our Products
PatternFly, a project sponsored by the Red Hat UXD team, is an upstream community of designers and developers collaborating to build a library of common and reusable UI components for enterprise web applications. PatternFly establishes standards that Red Hat products leverage to unify the many application user interfaces across the portfolio. Switching typefaces in PatternFly will impact all Red Hat products across the portfolio.
The current PatternFly typographical system is set in Open Sans, which was once a project maintained by Google during the time of PatternFly’s beginnings. But Google has since moved on and so have we. We chose to switch to Overpass so we can utilize the resources developed through our own open source methodologies.
There are many considerations when choosing the correct font specifically for application design such as: language coverage, weight variety, character shape, hinting, etc. Overpass has recently been extended to include new weights and hinted to work great on low resolution screens. This will make the application content more accessible and allow the designers to continue relying on type as the primary way to establish information hierarchy in our applications.
Switching every Red Hat web application over to a new typographical system does have its challenges. The primary challenge is that Overpass does not offer as much language support as Open Sans. Red Hat products are used globally, so devising a strategy to overcome this limitation is critical. After much research and collaboration with other teams, we decided to mirror the Red Hat web team’s strategy. We relied on their tried–and–true system font stack as a fallback to display the correct characters for any language. After overcoming this challenge, it was clear how critical it is to harness the knowledge and experience of the wider Red Hat community.
When are we going to see Overpass in the applications?
The PatternFly team is in the initial phases of redesigning the existing library to accommodate this new design system. We are taking this opportunity to make additional changes to our designs, including increasing the base font sizing and spacing. This will drastically improve our customers’ ability to complete their tasks quickly and effectively. Making these global changes is a substantial effort that will take time and cooperation with the PatternFly and Red Hat communities. We plan to roll out these changes in a major PatternFly release during next year or so with alpha releases in between.