Overview

The H&R Block Tax Calculator is a free online tool to estimate your income taxes. It was consistently in the top three most-visited pages on hrblock.com, and a great opportunity to convert the merely curious into actual tax clients. As Lead Designer in the Web Experience Group, I lead the ideation and redesign of this product.

Methods Used

  • User Interviews
  • Personas
  • Competitive Analysis
  • Usability Testing
  • Wireframes
  • Prototypes

The Challenge

In 2015, hrblock.com had just gone through a complete redesign, introducing a responsive, modular design, accessibility improvements, and an updated look and feel. The Tax Calculator, despite its importance, had been left behind and was stuck in the old design. We needed to redesign the entire experience, to make the product more user friendly and contemporary.

Process

Inspiration and Reading
A tax calculator is essentially a form, in which users go through a step-by-step process of entering their personal information and dollar amounts. We read Luke Wroblewski’s excellent book Web Form Design: Filling in the Blanks, which was an invaluable and frequently consulted resource.

Product and Competitive Analysis
Looking at the competitors’ tax calculators, it was clear we were behind in both functionality and design standards. While competitors had highly interactive calculators, we were stuck on a dated web form which presented users with a screen of text entry fields, and little contextual help. Moreover, the product had some technical problems that caused errors in calculations.

competition

Understanding the Users
Based on our user research, we determined we had two user types: experts and amateurs. The experts are familiar with the jargon of tax forms, and they will often have their tax forms with them when they use the calculator. Amateurs are less comfortable with taxes, and need more guidance. They are often just dabbling with the calculator and may not have their tax forms nearby.

Ideation and Design
In addition to being a form, we discovered that the tax calculator is also, in a sense, an interview. Users are asked many personal questions up front, about their home life and family, and they proceed to go through several categories of expenses and income.
In order to gain a better understanding of the interview process, we spoke with tax professionals to learn how they go about interviewing clients. It was our goal to make the product more conversational, and less of an impersonal experience. We wanted users to feel they were in the capable hands of H&R Block and not just interacting with a tool.

White Board Sketches
UX sketches

We worked through many initial design concepts, such as incorporating video of a tax pro guiding users through the process, or using “Richard” (the face of their ad campaigns at the time) to bring some levity to the subject. We also experimented with different ways to show the contextual help, such as including thumbnails of the tax forms.

Initial Concepts

User Testing & Pivot
We were working under the assumption that we needed two paths: an expert path and an amateur path. When we tested our prototype on both expert and amateur users, we found that they all preferred the amateur path. This required us to pivot, focusing on one path for all users.
In retrospect, this made perfect sense—who would not prefer their taxes to be as easy as possible?

Final Designs
Through extensive user testing and research, with customers as well as Tax Professionals, we arrived at an experience that was user-friendly, and full of helpful guidance.

We made the copy conversational, and broke the many questions into digestible steps. Contextual help was added, showing thumbnails of the actual tax forms referred to, so users knew exactly where to look for the requested information.

Style Guide

hrb-style-guide2x

Start Page

About You Section

Income Section

Expenses Section

Results Page