Phoenix Grouped Content Display
The Basics
Examples of Content Groups Evolving Over Time
GameSpot Best of Games Hub 2017
GameSpot Best of Games Hub 2020
Other Examples
Context
Giant Bomb
The site had an abundance of content that needed to be organized in a myriad of ways: by show, content type, chronologically, relevancy, etc. The original format treated the content mostly through a mixed feed relative to what would be displayed on a blog.
Often on the site, delineating between one type of content and another was done so through iconography while the rest of the elements of each object remained exactly the same in each feed, causing everything to blend in with one another.
GameSpot Event Hubs
An important part of GameSpot's content strategy revolved around seasonal events and announcements in the games industry, often resulting in a large amount of content created in a small span of time. As this content is made and published over time, layouts often felt either too empty or too dense.
Being able to have pages and hubs evolve depending on the amount of content that was created and published would be beneficial for the site since they experienced these surges in related content several times throughout a single year.
Outcomes
Portable, Modular Object
At a high level, a pattern for a module was created to be able to organize and display like content in a way that can grow and evolve depending on the amount of published content within the group.
The module allows the content to be displayed either in a grid or a carousel either depending on a manual selection in the CMS or automatically depending on the volume of content.
Carousel View
The carousel mode allows for a compact display for the user to interact with that translates well across responsive layouts. This is best suited for showing the most relevant or recent content initially while allowing the user to discover more content through a click or swipe.
This mode is also beneficial for stacking several carousels together in a single layout in the event that several groups of content are required to be displayed.
Grid View
The grid mode is beneficial for displaying a large group of related content that is best viewed in a less confined area and more suited for discovery rather than having a focus specifically on recency or relevancy.
Groups can grow in column size as items are either added or published automatically. Optionally, the module can automatically switch to the carousel view when all items are published in the group.
