Event Hub Redesign

There was a broad need across multiple sites to be able to display and organize like content together, especially as the collection changes and evolves over time
💬 This contains abbreviated details of the full project. If you'd like to talk more deeply about UX projects, feel free to reach out directly.

Problem Spaces

Non-Scalable Layouts

The hubs created for each year's Game of the Year awards were unique, causing an increase in code and experiences that weren't scalable as well as an uptick in QA upkeep with increasingly diminished value over time.

Production Overhead

Production of content and imagery became more and more cumbersome over time as the rules and boundaries for content to fit into the hubs changed year over year thanks to a lack of consistency and uniformity.

Previous Hubs

Game of the Year 2014-2016

Design Considerations

Information Architecture

Though the content can change from event to event, a recurring pattern was found that like items could be grouped together very often with there rarely being a singular, unique piece that didn't connect with others.

Because of this, design and engineering could reliably depend on grouped layouts and modules while the content team could focus on how to organize the content they intended to publish for the event.

Evolving Focus

A unique challenge to the events is that the content wasn't all published at the same time nor were groups of content published in lockstep.

The focus changes over time in the event as well. Category awards like Best Xbox Games could be the focus over a group of days and runners-up for Game of the Year could be more important a few days later.

UX Patterns Used

Generic patterns developed in Phoenix, the CMS platform that GameSpot runs on

Grouped Content Display

Carousels and grid modules were used to created the grouped layouts for event hubs and allowed the pages to scale and evolve as needed.
Read Pattern Details

Promoted Content Layout

New image production standards established as part of the promoted content layout pattern were used as part of the newly designed hubs.
Read Pattern Details

Redesigned Experience

Evolving Layout

Using the Phoenix UX patterns, the pages used grids of grouped content to focus on what's most important. As content became less timely or valuable for users to see, the groups were converted to carousels to condense their footprint on the page.

The content team was able to organize groups of content in the CMS so that the most important pieces could publish and display higher up on the page without the help of design or engineering. Images created using the new standards easily fit in the grids and carousels as well.

Layout Evolving As Content Changes

Game of the Year 2019

Website layout for Game of the Year 2019

Game of the Year 2018

Website layout for Game of the Year 2019

Game of the Year 2017

Website layout for Game of the Year 2019

Related Work

Game of the Year 2017 Art Direction

Game of the Year 2019 Art Direction

Grouped Content Display