USA TODAY

Working closely with USA TODAY and their agency Partners + Napier, me and one other new media designer Kathleen Huang redesigned the LIFE section of the mobile USA TODAY website.

UI/UX, Illustrator, Photoshop, Sketch

 

 

Problem Summary

USA TODAY has a higher index with an older audience and sports fans. However, they are not appealing to the 22-35 year old demographic.

Mission

Push popular content and encourage email engagements.

 

Sketches

Asset 4.png
Asset 3.png
 

 

Wireframes

Popular Page

The millennial generation is driven by numbers. In the media today, these numbers are seen everywhere. Higher numbers whether that’s through likes, shares, views, comments, or follows generates curiosity. In it’s simplest form it means the content is popular. With the new popular page, we display content that’s highest in views, likes and shares. We display these stats with each article throughout the LIFE section.

We explored the ideas of cards as an easy access to quickly swipe through articles. This was also designed so ads could be implemented in between content. 

 
Popular Page Wireframe.png
 

Newsletter Customization & Newsletter

 

Another main focus of this redesign included gaining newsletter signups.  We wanted to allow users to tell us how they wanted their content delivered. If the users can tailor it to fit their schedule and interests, they are less likely to unsubscribe. 

The final image on the right is the example of a actual newsletter.

SignUp_1.png
Newsletter Wireframe.png
 

HomePage

When we first explored the content of the homepage, we had included popular content, most recent articles, and photo galleries. After realizing this would be repetitive and confusing to show popular content on both the popular page and the homepage, the popular articles were removed.  Once we reached the second level of wireframing, we reevaluated making the homepage feature most recent articles, as well as content that is trending that week. 

On the bottom of the homepage, we also have the first design for the newsletter subscription sign up. This design and call to action changed many times as it was one of our goals to increase user sign ups for the newsletter in the LIFE section.

Newsletter Wireframe 2.png
 

Category Page

The category page allows the user to explore articles from the LIFE section category of their choice. The user chooses which category from the category tab which is shown in the final comp.

Example Category Wireframe.png
 

Article

The article page includes an added like button, the newsletter sign up (another experimental design), and inline ads for sponsored content. Later in the design process we added popular articles from the same LIFE category located at the bottom of the page. That can be seen in the final comps.

 

Final Designs

Popular PagE

 

 
 

Newsletter Customization & Newsletter

The customization process is quick and easy. In the final design the user is asked one question at a time. They can also choose the degree to which they customize their newsletter. They can stop at any point by clicking “Finish” — or they can swipe to continue customizing. The progress bar encourages the user to keep going.

 

This newsletter example (on the right) could include top picks, articles from the chosen category, and trending articles from the week or day.

 

Homepage

On the Homepage there is more content that features most recent articles, as well as content that is trending that week.

The new mobile site also features a top navigation which is global and allows the user to quickly and easily switch to any other USA TODAY category. The bottom navigation is local to the LIFE section.

 

Global Nav.png
 

Category Page & Article

The category tab allows the user to select a category of interests. From there they can choose from a list of related articles in that section.