People.com Homepage Wireframes

 

Assisted with the ideation and design of new wireframes for the People.com homepage across all platforms, in order to remove visual clutter and better organize featured topics.

Creative Director: Doug Parker

 
Live-Over-Wire.jpg
Blue-background.jpg
 

Issues with the Previous Layout

 

Overall, the previous homepage layout felt cluttered. The visual hierarchy was weak and offered editors little control to curate featured content.

 
Old-Homepage-Breakdown-2screens.jpg
Simple-1.png

Readers would overwhelmingly click on the story in the top left of the collage and completely ignore the rest.

Simple-2.png

The bulk of content existed only in a time-based feed. Editors had no way to keep important stories visible for longer.

Simple-3.png

Stories could only be featured individually. There was no way to group related content or feature it more elegantly.

Simple-4.png

Ads were poorly integrated into the the right rail, leading readers to discount the entire column as paid content.

 

Design Goals

 
Organize-circle-02.png

Maintain content density while reducing visual clutter
 

Swipe-circle.png

Maintain a feed-based design to encourage scrolling

Pin-circle.png

Enable editors to pin, group and feature relevant stories
 

Top-Content-circle.png

Simplify the content collage at the top of the page

 
 

Wireframe Iterations

 

We landed on a 3-part design: a simplified hero collage at the top, followed by two distinct feeds. One feed is strictly time-based, while the other is curated by editors.

 
New-Wireframes-ALL.jpg
Blue-background.jpg

Final Homepage Design