Overview

Sponsored content is a form of native advertising on a online publication that serves to provides useful information or entertainment in order to favorably influence the consumers perception of a brand all while maintaining the same quality and form of the publisher’s other content. As part of the migration of over one hundred different news sites previously hosted on half a dozen different CMS a new unified branded/sponsored content template was needed for both existing and new contracts for use on Sinclair owned local news sites.

Here we see an example of what the existing implementation of these pages was prior to the first redesign. Clients were given a section and detail page for their content.

Requirements

The elements that needed to translate into the new designs included:

Section

1. Large hero for most recent/featured story

2. Right rail links to external content (with customizable color to match client's branding)

3. Stories with image teaser sorted by most recent

Detail

1. Large hero

2. Galleries

3. Video playlist

4. Right rail links to external content (with customizable color to match client's branding)

5. Related content/stories

6. Ability to run ad takeover (display ads and wallpaper)

Additional Asks

1. Ability to offer tiered templates for clients with more/less content

My Role

As a UX/UI designer working closely with a group of developers, a creative director, the national sales division to both work within the perimeters of the new CMS as well as meet the needs of existing client contracts and content as well as the needs of future sales roadmaps

Results

Due to the initial time and technology constraints for the launch of their new CMS we began with a focus just on the detail page design at 3 tiers based on the amount of content a client had.

Fast Follow

After launch based on conversations with sales, stakeholders and content producers it was determined that the tiered system created unneeded redundancy as they was not as much variance in the amount of content that clients had as was initially believed. Due tho this a standardized version of the page was designed and built.

Next we were approached with a new challenge. Under certain previous sites clients had the option to have subsections and categories, often clients essentially had an entire microsite within the news site. As part of unifying the design of all news sites the decision was made to eliminate this microsite option in favor of more unified approach. Utilizing the limitation of the new CMS a new approach needed to be taken. Rather than giving a client multiple section and subsection pages a carousel is used to surface content.

Results

Not long after the initial launch of the new news sites a V2 design was underway. This version contained many of the same requirements with an updated card style design. Beyond visual design changes a decision was made to remove the customization of external link button for ease of development and unified visuals across the site. Additionally within the cards themselves an easy method of sharing and section listing tag were added, the later in response to the prospect of surfacing the branded/sponsored content across the site beyond just the clients section.

Versatility

As the popularity and number of clients and news sites grew yet another approach was needed that web ops could quickly turn over for clients and that would not need additional development. Due to the component based nature of the new CMS through a variety of minor changes these templates could be adapted to fit a variety of sales content needs.

Next we were approached with a new challenge. Under certain previous sites clients had the option to have subsections and categories, often clients essentially had an entire microsite within the news site. As part of unifying the design of all news sites the decision was made to eliminate this microsite option in favor of more unified approach. Utilizing the limitation of the new CMS a new approach needed to be taken. Rather than giving a client multiple section and subsection pages a carousel is used to surface content.