Custom Feeds

Custom Feeds

Custom Feeds

THE MULTI-BRAND PLATFORM & DESIGN SYSTEM SERVING 514M GLOBAL VISITORS ACROSS 80+ WEBSITES

PROBLEM

Our Editors were getting frustrated with their sites. The homepage and feed layouts were rigid templates: a header area followed by a reverse‑chronological stream of articles. Our magazines often looked more like blogs rather than respected legacy brands.

To give editors greater flexibility and reinforce each brand’s identity, we developed Custom Feeds—a modular system of logic and building blocks that enabled grouping, styling, customization, and curation within a graphical editor.

As a product designer I shaped the foundation of this system by proposing and designing the blocks and layout options, and pushing the limits of the DOM using bleeding edge CSS and HTML spec. Design responsibilities included setting and approving the art direction, developing the styling, and committing the underlying SCSS directly to the codebase.

The Custom Feeds project not only modernized our platform but the common patterns also laid the groundwork for our evolving design system.

ROLE & RESPONSIBILITY

  • Design Lead (mid 2019-2020)

  • Front-end styling and theme development

  • Worked with engineering to optimize CSS and DOM

  • Visual QA across platforms on all major browsers, and devices

As design lead I managed a team of four designers at the tail end of 2019 through the end‑to‑end process of theming, development, QA, and launch of nearly two dozen sites over 3-4 months reducing the time to launch from three months to one week.

Hearst Magazines runs an all-in-one platform with over 109,000,000 unique viewers a month. We reach 53% of all US Adults, 50% of all US Gen Z Adults, and 53% of all US Millenials

Proper respect goes out to Theresa Mershon + Katie Maclachlan for creative direction and design team leadership. Artem Artemov for playing lead / point on the underlying UI/UX and edit interface, the entire product design team, all of the brand art directors

MRI-Simmons Fall 2024; Fusion (04-25/F24); ComScore July 2025; ListenFirst Q2 2025; Google Analytics


  • Design Lead (mid 2019-2020)

  • Front-end styling and theme development

  • Visual QA across platforms on all major browsers, and devices

In the second half of 2019 as design lead I managed a team of four designers through the end‑to‑end process of theming, development, QA, and launch of over two dozen sites

Proper respect goes out to Theresa Mershon + Katie Maclachlan for creative direction and design team leadership. Artem Artemov for UI/UX of Custom Feeds, the entire product design team, all of the brand art directors

BACKGROUND

Custom Feeds offers a level of styling and customization previously unavailable to our magazines. While most traffic comes in through article pages, editorial and advertisers really value the on brand homepages, feeds, and typography.

These feeds are assembled on the fly using a combination of five different blocks — a Single Story or Video, a 4 Across Block of Articles, A Big Story with related articles, and a 3- column layout

These building blocks are available platform wide to every brand. In order to scale across an unknown number of sites the underlying layout and structure can't be changed but can be heavily customized on the presentation layer. Working with pretty intense SCSS along with feedback from print art directors and the digital asset designers we found really creative ways of differentiating each site. Drifting from a unified layout and codebase would make building new features impossible.

A graphical editor and two homepages
A graphical editor and two homepages
Harpers Bazaar Homepage
Harpers Bazaar Homepage
A graphical editor and two homepages
A graphical editor and two homepages
A graphical editor and two homepages
A graphical editor and two homepages
A graphical editor and two homepages
A graphical editor and two homepages
Popular Mechanics Homepage
Popular Mechanics Homepage