Website Redesign for Online Publisher

Role:  Product Designer, User Researcher

Date:  Feb – Aug 2018

Project Overview

Dear Blogger is an online publisher serving 250,000+ readers. On the site, 30 writers share their knowledge about building 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. I discussed the pros and cons of research methodologies, and identified 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

Participants were encouraged to think out loud as they shared their screen and interacted with the website (link to usability study script). The 5 test subjects also completed several tasks, including:

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

"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"

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

Details on Customer Survey

Screenshot of Customer Survey
Readers' purpose for 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

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 and improve user experience. The user bounce rate was high on Dear Blogger (the proportion of visitors who view only one page before leaving the site). 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 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, already dozens of customers requested support.

Web Dev Customer Portal

Wireframe Sketches

Interactive Prototypes

I selected a few homepage layouts from the sketches and proceeded to create the interactive prototypes using Sketch & Invision. 

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.

Homepage: Before & After

Before After

Impact

The redesign modernized the Dear Blogger website and improved customer experience. As a result, we saw a significant increase in 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.

Thank you for reading!

Work inquiry, question, or something else?

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