Platform
Website and Mobile Apps
Role
Product design
Skills
Adobe CS (XD, Illustrator, Photoshop)
Product Management
Visual Design
Overview
Hearst is a large publishing company that owns several newspapers in addition to their large catalog of popular magazines. I was engaged throughout the product lifecycle of both their premium newspaper sites and various local papers. Because the content of a newspaper is so dense, all designs were broken into five breakpoints to maximize readability.
Premium Sites Article Template
In an effort to provide more options for media and flexibility for content, the article page template was updated. The layout adapts for a portrait versus landscape feature and can also accept video. There are also options for maps and other interactive content within the page.
The premium sites (Houston Chronicle, San Antonio and San Fransisco) use five breakpoints.
The new template gave the option to use a video as a hero image.
The article page could automatically update the layout based on whether an image was horizontal or vertical.
The updated template also provided the option to add in different types of media into the body of the article. Maps and video could be linked to any paragraph.
Premium Photo Gallery
The new gallery template was intended to be immersive and be capable of standing-alone. It can be launched from within an article page or be linked to directly. This template is responsive, adaptive, allows for larger screen viewing with caption, has the option for additional ad space and accommodates all sizes of images without cropping.
Mobile Template for Free Sites
Initially, Hearst used iOS and Android apps to deliver content on mobile, but we eventually moved towards a web-based app. The mobile sites were built independently of the desktop and tablet versions in an effort to streamline the user-experience. The mobile sites leverage different functionality and versions of content.
Hearst own several local papers throughout the country.
We created a single template for the dozens of local sites that allowed for simple color, logo and image changes that were specific to each paper. We used a spreadsheet to manage all of the changes.
The team used a cloud-based spreadsheet for setting styles and production.
The free sites generate income from ad sales and sponsored content.