← Back

Design Problem

  1. Washingtonian wanted to create better connections with their readers.
  2. Washingtonian writers wanted to be recognizable in a sea of DC-area reporters.

Design Idea

A simple way to accomplish this was to, quite literally, put a face to a name.

In addition to showing readers a profile photo of Washingtonian writers, we could also provide readers a way to easily contact reporters via email or social media.

Our team decided a content box that included the author’s biography, contact information, and other important information, placed at the bottom of article pages would accomplish both business and user goals.

Research

We interviewed key stakeholders (mostly editorial staff) to learn what information they’d like to share with readers. We also conducted a competitive analysislayout comparison, and quantitative Heuristic evaluation of Washingtonian’s website compared to competitors to see which features we should adopt.

Most author biography boxes and bylines on other sites included a photo, name, and a few sentences about the author. A few sites had sparse bylines, including only the author’s name and links to email and social media.

From interviewing our editorial staff and web producers, we also learned that we needed to make updating and editing these bios easy in our content management system, otherwise, writers simply wouldn’t enter up-to-date information.

We decided that in order for our audience to get to know Washingtonian‘s authors better, a bio box with the following information would be most useful:

  1. Name
  2. Photo
  3. Title
  4. Short bio
  5. Email and social links

Wireframes & Mockups

Before validating our design idea, we needed to create basic wireframes and mockups to test with Washingtonian‘s stakeholders and with end-users.

Mobile, tablet, and desktop views were created to determine the necessary breakpoints and responsive stacking of elements.

Click on a frame (below) to enlarge:

Validating the Design

To validate the design changes, we conducted user tests on usertesting.com.

The user testing goals were to find specific pieces of information, such as an email to contact the author of a story. We wanted to ensure that the information was easy to find and met users’ expectations.

Users were able to accomplish tasks quickly and easily. In addition, they had the following feedback:

Measuring Success

To measure the success of the author bio box changes, we focused internally on our key stakeholders’ reactions. The Washingtonian editorial staff liked the revamped design, particularly the background colors that made the boxes “pop” and the profile images.

Overall, the editorial staff felt it accomplished the idea of giving a brand to Washingtonian authors.

Additionally, based on user tests, users found it easy to contact authors from the bio boxes and were happy that they were large enough on the page so they wouldn’t accidentally scroll past them. Users also appreciated having photos in the bio boxes, as it made the authors seem more personable.

I’m open to working together, mentoring, or simply chatting about UX things over coffee!