UX Consulting for Online Publisher

Role:  User Researcher, Project Management

Date:  Feb – Aug 2018

Tools: Google Analytics, R Studio, WordPress, Sketch, HTML&CSS

Role:  User Researcher, Project Management

Date:  Feb – Aug 2018

Tools: Google Analytics, R Studio, WordPress, Sketch, HTML&CSS

Project Overview

Dear Blogger is an online publisher with 250,000+ readers. On the site, 30 writers share their knowledge about building profitable and compelling websites and blogs.

I modernized the website using a user-centered design process. I managed the project from the early sketches to the development of the designs into functional code. The result is a much simpler and intuitive interface.

Exploring the Current Design

At the outset, the CEO walked me through the website, the business structure, and the areas that needed improvement. I learned about the site’s customers/readers and the tools used to measure their engagement and customer conversions. I spearheaded adding analytics to the site that would give the business valuable insights into which articles were performing the best.

User Experience Research

Before I launched the redesign, I researched the current website’s user experience in order to see what was working and what wasn’t. Since there are many possible methods for user research, I discussed the pros and cons of each with the team so as to identify the following three that best fit this project.

usabilityCreated with Sketch.

Usability Testing

Usability sessions with 5 new website users

InterviewCreated with Sketch.

Contextual Inquiry

Focused interviewing with existing users.

SurveyCreated with Sketch.

Online Surveying

Surveys completed by readers.

Details on Usability Testing

Testing the interface with new users

Participants were encouraged to think out loud as they shared their screen and completed the following tasks on the website:

  1. Find an article of interest 
  2. Engage with one community member

Video Clip of Usability Session (with permission of participant)

Both of the user frustrations below were addressed in the redesign.

"This is a lot of information, this is a lot to look at. This thing in the middle keeps moving and I can barely register what is on it before it changes"

-User Testing Participant

"There are two navigations ... and then I noticed the other one that's at the top... a lot of different things are here."

-User Testing Participant

Details on Customer Survey

Screenshot of Customer Survey
I asked readers what they hoped to gain by creating a website:

"To keep a online cycling journal. Bicycle ride adventures."

"Share knowledge, sell digital and physical products"

"To speak to people running businesses from home, especially the over 50 age group."

Personas

3 Types of Readers

  • Owner of website
  • Prospective owner of website
  • Actively building website

Writers

  • Content creators typically have their own blogs or businesses that they are promoting as well.

A note about the personas: Information on the personas’ demographics, behaviors, and intentional goals was also considered but was kept confidential.

Data Analysis

I leveraged data analytics to discover customer needs. Specifically, I referenced a customer data set (using RStudio), as well as Google Analytics. I gained valuable insight into devices that readers used to access the site, geographic regions, age ranges, and so on. This data was summarized and presented to the CEO for consideration with regard to such issues as usability study recruitment and web development decisions.

The
user bounce rate Proportion of visitors who view only one page before leaving the site (Source: Google Analytics).
was high on Dear Blogger. In an effort to lower it, I implemented a number of UX improvements. For example, I added links to related content at the end of articles. Another improvement that helped encourage one-article readers to return to Dear Blogger was the addition of pop-ups that invite the reader to subscribe. Knowing that forceful pop-ups deter users, I used a gentle form that appears only after a reader has had the opportunity to appreciate the content.

Business Opportunity

Finding that the CEO was being inundated with web development requests, I created a customer portal to manage the demand. The resulting Web Developer Customer Portal automates the work of initial project take-offs, filters out spammers, and allows for quick prioritization of projects. In the second month of operation, dozens of customers contacted Dear Blogger, including a famous actor, an e-commerce company, and several bloggers.

Web Dev Customer Portal

Interactive Prototyping

I selected a few homepage layouts from the sketches and proceeded to create the wireframes using a responsive design tool, Sketch. Next, I showed the prototypes to several users, who tested them and provided feedback.

Concept #1

Concept #2

Mobile Responsive Design

I also oversaw the development of mobile responsive features for the website. Making the site mobile friendly involved changing the size of the content, font size, content padding, and more.

One impactful change was increasing the mobile font size. Small text can be hard to read, causing visitors to give up before finishing an article. This is especially true of Dear Blogger, many of whose users are over the age of 50 and therefore prone to experience vision issues.

Source: Unity Lenses

Desktop Homepage: Before & After

Before After

Impacts: Modernized Interface, Increased Customer Engagement

  • Improved
    user bounce rate Proportion of visitors who view only one page before leaving the site (Source: Google Analytics).
    .
  • More visitors subscribing to the newsletter.
  • More author submissions
  • More video comments on the videos featured in the sidebar area.

Work inquiry, question, or something else?

I'd love to hear from you, so feel free to reach out.