PF Visual Library

[bekah-stephens]

Problem Statement

Inconsistent and ad-hoc image usage for Medium articles results in a lack of branding and strategy. The current approach of using Unsplash images and, occasionally, self-made graphics fail to consistently align with the website’s visuals and the larger PatternFly identity, potentially creating a disjointed user experience.

Impact Statement

The absence of a consistent graphic strategy negatively impacts user engagement, brand recognition, and overall website aesthetics. Featured blog previews with misaligned images diminish the homepage's visual cohesion. Creating custom graphics will improve user connection to stories, strengthen brand consistency across platforms, and enhance the PatternFly brand image.

Proposed Solution

Develop a standardized graphic creation process that adheres to brand guidelines and visual identity and can be recycled and used across platforms. The idea is to create a “library” of visuals (images, shapes, patterns, etc.) and several templates that arrange them differently for different use cases. When a request comes in, we can either customize one of the template layouts or create something from scratch using the library of elements.

Important links

• Figma ideation & research

Resources

• Brand & Experience Team's "Hybrid Style Guidelines" deck
• Sunil's old work (this is similar to the "library" of visual elements that we want to create)