Year
2023
Client
Gear Patrol
Creative director: Joe Tornatzky
Designer: Anne Reed
About
Gear Patrol is a lifestyle publication focused on discovering and reviewing the best in gear, gadgets, and adventure products for enthusiasts and consumers. In 2023, Gear Patrol was in the middle of a website redesign and needed support organizing their resources and building systems that would translate smoothly from design to development. I helped implement UI patterns and best practices that served a dual purpose: providing modular storytelling templates for Gear Patrol writers and creating a more user-friendly browsing experience for readers.
Goals
Writer’s perspective:
Create template blocks that are easy for writers and journalists to use, minimizing friction in their creative process.
Growth manager’s perspective:
Ensure flexibility and modularity to enable quick iterations for user testing, allowing the team to respond swiftly to trends and topics that interest readers.
Reader’s perspective:
Make it easier for readers to access articles and recommended products that align with their interests.
Sources
Photo mocks were created and designed by Gear Patrol.
Typography
Our first priority was to simplify the design system. Before the redesign, writers could choose from 3–4 different fonts for headers and body copy. We streamlined this by standardizing with Ringside for most of the site, which addressed two key issues: it reduced the number of variables in both the design system and backend, minimizing elements that need management or updates; and it eased cognitive load for writers, allowing them to focus more on crafting their stories.
Type scale
For the type scale, we chose a “t-shirt sizing” model instead of an approach that assigns font sizes and weights to categories like “header” or “body copy.” This method doesn't enforce consistency as strongly as a strictly-styled one, but it offers much more flexible for a small team working together closely. It allows designers to switch between weights and sizes easily without causing style bloat.
Supporting typefaces
While we wanted to simplify the system, we also wanted to make sure we were preserving Gear Patrol’s brand essence. Since typography is a core part of Gear Patrol’s identity, we kept three supporting typefaces. Although these are unlikely to be used at smaller sizes, we applied the same type scale for consistency and provided clear examples of how each supporting typeface should be used.
Master image upload
To streamline the workflow of writers at Gear Patrol, we implemented automated image processing features that eliminate manual resizing and cropping. Each content block has pre-defined aspect ratios and automatically sets a focal point for uploaded images. This not only simplifies the writing process but ensures visual consistency across the entire website.
Spacing scale
We established an 8px base spacing unit for the new UI design, which creates a sense of order and balance. It also helps streamline the process of creating new design layouts.
Card-based layouts
With modularity being one of our key goals, opting for a card-based design layout felt like the obvious choice. The flexibility it offers also lends itself well for a website that produces hundreds of diverse visual and written content weekly.
Anne Reed
©2025