Modernizing The University of Texas’ News Publication.

 
 
 

About the Project.


UT News is a users' home base for trustworthy news stories from (and about) the students, faculty and staff of The University of Texas at Austin. Stories include groundbreaking faculty research, personal stories about student experiences, and expert opinion pieces from scholars who weigh in on current events and trending topics.

I was asked to redesign and reevaluate the user experience of this news website, from research and analysis through final UI design. 

 

In my role as UX/UI Designer, I was responsible for...

  1. User Research

  2. Industry Research

  3. Google Analytics Research

  4. Competitive Research (+ Analysis)

  5. Initial Sketching and Ideation

  6. Low-Fidelity Wireframing

  7. High-Fidelity UI Design

 

Tools / Software:

  • Google Forms
  • Google Analytics
  • FullStory
  • Sketch
  • InVision

The Challenge.


The UT News team noticed a troubling trend in their analytics: news readers were jumping to a single UT News article from social media, skimming it, then leaving without exploring any additional content. These readers were also visiting for the very first time and they were never coming back. In other words, users weren't getting the context they needed to understand what UT News is/does, and the poor user experience of the site prevented them sticking around.

Most users never touch the UT News homepage. They are first-time visitors who read a single article and leave ... and they never return again.

Here's what UT News articles used to look like:

Legacy UT News article page with full navigation, breadcrumbs, social sharing buttons, and a sidebar with featured articles.

 

So, how might we...

Create… a website that is a destination for the best, most relevant (and necessary) UT News content
For… general news readers in the Longhorn community and media/reporters
To… find interesting content to explore, consume, learn from, and share with their networks
And improve… the user experience of consuming, sharing, and trusting UT News content.
 

My Process.


1. User Research

I created a survey for journalists and general Longhorn news readers because I felt it was crucial to better understand the following:

  1.  Why are users coming to the site to begin with?
  2.  What content are users consuming?
  3.  How are they consuming content (i.e. skimming, etc.)?
  4.  Do users trust this content?
  5. What pain points or frustrations are users experiencing during their journey?
  6. What do users intend to do with the content?

Unfortunately, due to time and resource restrictions, I was unable to access these users. My workaround was to conduct a cognitive walkthrough of the current site by examining FullStory sessions (screen capture playback software) and Google Analytics reports, in addition to general news industry data. This data helped me empathize with users and better understand their habits, instincts, and motives before moving into design.

 

2. Industry Research

I collected news industry data from Pew Research Center, NiemanLab, and Moovweb to understand the overall landscape a bit better before diving in.

Takeaways:

U.S. adults tend to...

  • consume news on mobile
  • prefer reading (vs. watching or listening)
  • arrive via the org website or social media
  • forget which news org (but remember the social network they arrived from)
  • bounce if an action is required
  • avoid social sharing buttons
  • share 1:1 with friends and family (iMessage, word-of-mouth, etc.)
 

3. Google Analytics Research

  • Looking at: news.utexas.com
  • Timeframe: August 23, 2016 - August 23, 2017

  • Audience: Global with 72% coming from the US

Google Analytics data was my guiding light for making design decisions that kept the user in mind. Click through the charts below to see some of my findings.

The news homepage accounts for less than 2% of pageviews. It was clear we needed to focus on individual articles first.

Takeaways:

  • Users find the site via Google search, Facebook, or word-of-mouth.

  • Users are browsing and consuming news on mobile devices (specifically Apple).

  • Users are first-time visitors who read individual articles and never touch the news homepage.

 

4. Competitive Research (+ Analysis)

With “general news readers” as a primary user, UT News is competing for general time and eyeballs. This means technically ALL news sites are competitors. So, in order to aim high and be audacious, I looked to several best-in-class news sites for inspiration in addition to higher ed and healthcare.

I took a heuristic approach to this competitive analysis and rated each site on a 1-5 scale, 5 being the best. I went through each site and listed out pros, cons, specific notes that pertained to the UT News project, and scored on various categories such as accessibility, visual design, differentiators, multimedia, etc. I then averaged these scores to see a total percentage (maximum of 100%).

 

5. Initial Sketching and Ideation

After learning from the news industry overall, the current site, and a broad spectrum of competitors, I sketched out some initial ideas for news article pages. These sketches included a simplified navigation, full-width header image, sidebar, pull-quotes, end of article CTAs, and ways for users to continue exploring.

 

6. Low-Fidelity Wireframing

During the low-fidelity phase, I explored options for feature articles with several high-quality images through press releases that had no imagery. The biggest change between sketches and wireframes were simplifying the design even further and removing the sidebar. These low-fidelity wireframes (created in Sketch) went through several rounds of feedback with stakeholders before moving into final high-fidelity mockups.

 

7. High-Fidelity UI Design

The biggest change from low-fidelity to high-fidelity was the concept of "continuous scroll" into the next article. This next article would load partially to entice users to continue reading.

I also explored additional designs for every pathway a user could go down when clicking around the UT News site. One example of this includes curated topic pages; what happens when a user clicks on the topic tag on an article.

 

The Solution.


Here's what I updated to better match users’ instincts and habits in 2018:

  • Simplified navigation.

  • Focus on the individual articles and how to find them.

  • Removed clutter: sidebar, social sharing buttons.
  • Clearly labeled topics/sections.
  • Bold headlines.
  • Full-width media, image galleries, and engaging pull-quotes.
  • Mobile optimized.
  • Contact information for media/reporters.
  • Scroll directly into next [featured] article.
  • Additional articles to continue exploring.
 

Next Steps.


Get a minimum viable product (MVP) out the door and test it.

It's important to get a MVP in front of users so glaring issues can be worked out before the design is live. Ideally, this would happen with a small group of users before the site is launched.

 

Test again, once the design is live.

Once all users have access to the live design, there will be an opportunity to get feedback from a much larger group. I'd suggest user testing in-person to gain additional feedback, and also pay attention to how users are taking to the site via FullStory or other screen capture and heat mapping software.

 

Always be iterating.

Once the site has launched, we're done... right? Wrong. It's important to continue gathering feedback from users and pay attention to data and upcoming trends regarding the news and design industries. I'd suggest updating the site more regularly with small, incremental changes rather than a huge overhaul every few years.

 

 


Continue Reading:

 
Redenim-Feature-Image.png

Humanizing Redenim’s Onboarding Process.

 

See how I redesigned a style questionnaire for a PaaS (Pants as a Service) startup in Austin, TX.

 

Seen enough? Let's chat.