Tax Data Visualization

Read a User Experience Magazine article about this project.

Problem

Enable tax professionals to explain to clients how they arrived at their refund or balance due.

Process

Solution

• Designed a graph view that shows where the client’s money goes in a tax return.
• Collaborated with a visual designer to ensure the visual design conveyed the message.
• Tested with clients and tax pros to ensure the graph facilitated the conversation.

Tax Summary

Results

• Designs performed well in usability studies.
• Launched as a beta the first year and then released nationwide the following year because it performed well in the field with both tax professionals and clients.
• Additional screens to visually explain tax data were designed the second year as a result of the success of this screen.

iPad Tax Prep

Problem

• Provide a way for users to file their taxes using an iPad.
• Using the tax engine and interview screens from online, find a way to make a native iPad UI that makes the app feel like it’s on an iPad and improves the experience for users.

Process

Solution

• Used years of research about navigation within tax prep products to design a left hand navigation menu in the native iPad UI.
• Collaborated with a visual designer to create a look and feel that indicated the product was still in the H&R Block At Home family, but looked like an iPad app.
• Worked through which pieces of the online interview screens needed to change to be compatible with interactions commonly expected on the iPad.

Main UI

Landscape

Portrait

Results

• Designs performed better in usability studies than any previous product we’ve tested out of the box.
• Satisfaction scores for the iPad app are higher than for the online product it’s based on.

1040-EZ Mobile

Problem

• Provide a way for users with simple tax returns to file using their smart phone.
• Allow users to take a picture of their W-2 for simplified data entry.
• Ensure consistency with online tax preparation application.

Process

Solution

• Collaborated with visual designers to optimize the tax prep process for the phone.
• Figured out ways to simplify the tax interview that we used in the online product for the small real estate on the phone.
• Defined interaction for incorporating photo taking functionality into the W-2 interview.

Screens

Main UI

Income

Photo Data Entry

Results

• Designs performed well in usability studies.
• Average rating of 3.5 stars in both the Apple and Android App Stores.

L.L.Bean Responsive Site

Problem

• Conversion on tablets was lower than desired.
• Many features on the site were difficult for users to interact with on tablets because they had small tap targets.

Process

Solution

Responsive site optimized for tablet users on viewports down to 600 px wide.

Tablet Screen

Portrait

Landscape

Desktop Screen

Results

Designs performed well in usability studies with tablet users.

Block Mobile

Problem

• Revamp the existing phone app to add new functionality for uploading documents, viewing prior years returns, and logging into an account.
• Ensure consistency across platforms for the new functionality - i.e. if a user logs into an account to upload a document from the mobile app, the experience should be consistent with how it works online.
• Fix usability issues with the existing app.

Process

Solution

• Redesigned basic information architecture of the app to incorporate the new functionality.
• Designed interactions for the new functionality.
• Fixed known usability issues.
• Enabled direct action to be taken on the Home screen for common user tasks.

Home Screen

Before

After

Document Upload Screens (New Feature)

Results

Designs performed well in usability studies.

ATI Nursing Education

Users

Nursing students use ATI’s products to study and gauge their readiness the NCLEX board exam.

Problem

Improve user engagement, accommodate mobile use and support easy access to assessments, tools and content.

Process

I worked on several ATI products over several years with Useagility. We conducted user research to understand user needs and developed a base design to meet those needs for the first product we worked on and then replicated similar designs across other products in their product family. I was the lead UX designer for the first product geared towards students and several of the subsequent products geared towards students, faculty, and ATI coaches.

Solution

• A card-based design that emphasized the learning loop made it easier for users to understand how to navigate the pieces of the product on a variety of devices.
• Visuals to indicate how far the student is along the process towards being ready for the NCLEX exam.

Screens

Homepage

Learning Loop

Readiness Assessment

Results

As a result of our work, ATI saw student outcomes improve, along with an expanded client base, greater engagement with educational material and significant increases in their net promoter score (NPS) and client satisfaction scores.
Within two days of implementing the new designs, ATI had 500 students logging in—and received zero support calls. Two days later, 1,000 students had accessed every area of the site and made only five calls—half of which were students complimenting the changes.

PlanIt Impact Architecture Reporting Tool

Users

Architects and city planners use the PlanIt Impact to evaluate the environmental impact of their designs.

Problem

Simplify a complex process to integrate open sustainability data with third-party structural design applications, making it easy for users to assess – and share – the environmental impacts of their designs.

Process

With my teammates at Useagility, we interviewed several users to learn about what their needs were and did a few iterations on the design before it was built by their internal developers. I was the lead deisnger and responsible for conceptual and detailed design for each iteration.

Solution

• Responsive web application that imports files from architectural software to evaluate sustainability of a design.
• Allows users to compare sustainability across multiple design options.

Screens

Homepage (mobile)

Comparison report

Results

The final step prior to development was to incorporate the results of the concept testing into a fully-functioning prototype, including data integration and visualizations, then test it with users again. In this stage, we validated the responsive and adaptive features we designed for mobile devices and ensured the data visualizations were clear and intuitive.

L.L.Bean Customization Tool

Problem

• The existing page to create a custom item used Flash and was unusable on tablets.
• The screen also didn’t look like it was part of the rest of the site.

Process

Solution

• New screen using a third party configuration tool.
• Screen laid out to look like other product pages.
• Responsive to the viewport on tablets.

Screens

Desktop

iPad Portrait

Block Mobile iPad App

Problem

Create a version of the Block Mobile app optimized for the iPad.

Process

Solution

Improved organization and layout of features to take advantage of the real estate and functionality available on the iPad.

Home Screen

Find an office

Tax Estimator

Results

Designs performed well in usability studies.

POMCO Emergency Alert System

Users

College students who want peace of mind when walking alone on campus.

Problem

POMCO provides personal safety tools utilizing a key-chain device linked to a mobile app for college students living on campus. In order to enable students to make an emergency call to campus security with the push of a button, the POMCO team needed a more user-friendly process to get students up and running quickly.
The POMCO team needed help educating students about their personal safety device and app as well as designing an intuitive user interface for campus security dispatchers to use when receiving an emergency call from students.

Solution

Using thorough end-to-end process analysis for both online and offline POMCO components, Useagility distilled the set-up process and tested it by simulating real-world campus safety situations before updating the front- and back-end web site and app and designing a quick- start guide especially for students. I was the lead designer on the project.

Screens

Before

After

User flow

L.L.Bean Responsive Email

Problem

Users viewing L.L.Bean transactional emails on their phones had a difficult time reading the contents of the email.

Process

Solution

• Responsified existing emails and incorporated new business requirements related to matching transactional emails to the llbean.com order summary screen.

Transactional Email Screens

Mobile

Desktop

Block Live

Problem

• Provide a way to replicate the in-office tax preparation experience at home, taking advantage of video chat capabilities.
• Users needed to be able to find a tax pro that was available when they wanted to prepare their tax return, upload documents to share with their tax pro, and view and approve their return once completed.
• Also included a mobile app to take pictures of and upload tax documents.

Process

Solution

• Concepted and designed a new product from the ground up, working with business partners and visual designers.
• Built and tested several iterations of high-fidelity prototypes with users to ensure the viability of the concept and usability of the product.
• Worked through detailed design and made trade-offs with development to ensure delivery within time and budget constraints.
• Worked with the vendor who designed the mobile app to ensure the process between Block Live and the mobile app worked smoothly and ensured the app conformed to guidelines and design patterns established in the main application.

How It Works Screen

Results

• Concept and design performed well in user research studies.
• Pilot and beta releases launched.

L.L.Bean Account Redesign

Problem

• Account interface was dated and confusing for users based on an external usability review of the site.
• Account functions weren’t present on mobile site.

Process

Solution

• Redesigned account screens that work well for all users on all devices.
• Most common user tasks are bubbled up to the main My Account page for easy access.

Screens

Before

My Account Main Screen

After

Desktop

iPad Portrait

Mobile

Hallmark Baby Responsive E-Commerce Site

Users

Online shoppers who are purchasing clothing for babies.

Problem

Hallmark is more than a greeting card company – it’s a brand engaging customers emotionally with a variety of digital and tangible products.
When Hallmark needed an upscale ecommerce site for Hallmark Baby, Useagility customized their Demandware ecommerce platform to deliver an engaging and efficient customer shopping experience.

Process

I worked in tandem with another designer on this project. The other designer designed the desktop wireframes and I adapted the responsive designs for other viewport sizes. We used Demandware’s extensive documentation and templates to ensure the designs could be implemented using their framework.

Solution

Useagility worked closely with the Hallmark Baby team to understand their goals for the shopping experience before exploring the capabilities of the Demandware solution and creating customized responsive wireframes and prototypes using Axure.
Defining desired workflows and functionality through clickable prototypes gives development teams like Hallmark Baby’s clear specifications for what they should build, allowing quick site implementation to capitalize on brand momentum in other markets.

Product selection page

Wireframe

Implementation

Product detail page

Wireframe

Implementation

TaxCut Support Site

Problem

• We had been asking our customers to tell us which of four support providers they needed. Users didn’t understand how we’d structured our support organization, they only knew what was preventing them from finishing their taxes.
• The site presented vaguely labeled, redundant content, such as FAQs and Q&A, which made it difficult to discern where to go find the content users were seeking.
• The primary means for accessing content was through a search that didn’t provide relevant results and we were unable to customize to improve.
• All contact information was removed from products and users were required to view a self-help article prior to viewing contact information.

Process

Solution

• A topical browse view that visually communicates the organization of the support content based on a series of card sorts conducted with users.
• Elimination of most of the redundant Customer Support content.
• Rewrites of KB articles and titles to better match the user’s understanding of issues.
• Development of a methodical approach to content maintenance based on user evaluation and data analysis.

Main Customer Support Page

Before

After

Results

• Two usability tests and one summative card sort validated the browse view design. Users easily scanned for the article they needed to solve their issues.
• Significantly decreased contact volume in spite of an increase in traffic to the support site.
• Fewer page views per visitor for the support site.

Zumba Instructor Network Portal

Problem

• Users had difficulty navigating the portal for instructors.
• The layout on screens within the portal was inconsistent and difficult to understand.

Process

Solution

• Templatized the screens within the portal.
• Added a navigation menu to make it easier to find content.

Edit Account screen

Before

After

Training History screen

Before

After

TaxCut Welcome Sequence

Problem

• Users were overwriting returns because they didn’t know how to start a new return.
• Users were creating multiple copies of a return and checking e-file status from a copy that wasn’t sent.
• Getting started took more steps than necessary.
• The process for new and returning users was the same.
• Importing a prior year return took more steps than necessary.
• Update availability information was not readily available before beginning a return.

Process

Solution

• Single Welcome screen that isn’t tied to a return and lists out available returns and other important information, such as update availability.
• Shortened import process that displays available returns to import, since 60% of users import.
• Update functionality available outside of return preparation task.

Welcome & Update Prompt

Before

After

Import Screens

Before

After

Results

• Online prototyping and a summative usability study confirmed an improved experience.
• Reduced contacts about issues with checking return status and overwritten returns.

TaxCut Support Reports

Problem

• We had a difficult time identifying user issues that should be fixed in the product.
• Multiple reports had to be reconciled to determine what the issues were and the severity of the issues.
• We couldn’t get a holistic view of the issues.

Issue Identification Process

Solution

Combine 5 reports into one.

Combining reports allowed us to

• Understand the total number of users who experience an issue.
• Take action on the issues in the report.
• Clearly see the effect that posting a given write-up has on volume.
• Identify trends in volume.
• Identify high-volume issues that need to be fixed.

How I got to one report

• Conducted a card sort with support agents to get accurate categorizations.
• Tied knowledgebase articles to the categories agents use.
• Developed a plan for ongoing maintenance of categories as new issues arise.

Results

• Increased accuracy of support data.
• Better understanding of exactly what issues users experience.
• Improvements to the product.
• Also helps QA troubleshoot technical issues.

City Year Redesign

Problem

• The site was confusing and overwhelming for users.
• Users didn’t know where to start or where to go for specific information.
• Subsites, such as the Application and Donation processes were confusing, as well, and buried within the main site.

Process

Solution

• Revised information architecture to match card sort results.
• Standardized page layouts.
• Reworked subsites and processes to clarify purpose and process.
• Reorganized application process into logical groupings to make it clear what needs to be done and in what order it will be done.
• Made it clear that the user is in the application by taking away the site navigation.

Registration screen

Before

After

Application process

Before

After

Results

Summative usability study confirmed an improved experience.

DeductionPro Donations

Problem

• Users who donated more than one type of item to a charity had to enter each item individually on a separate line.
• Users didn’t understand what the Details button was for or how to access the details required for donations over $500.

Process

Solution

• Added the ability to enter a series of items for each trip to a charity.
• Clarified the detail entry process.

Donation Entry Screens

Before

After

Results

A summative usability study and walkthrough confirmed reduced confusion over the details and increased time to enter noncash donations.

Cruises Only

Problem

• A new client wasn’t satisfied with the organization of the ship information pages on Cruises Only’s site, so they requested a redesign before they would use the service.
• The information architecture wasn’t intuitive.
• Users weren’t able to easily drill down into detailed information they were looking for.
• Users couldn’t easily scan pages to find information they were looking for.

  Process

  

  Solution

• Revised the information architecture to match common user tasks.
• Changed the layout of pages to enable easy scanning and drilling.
• Templatized the pages for use with all of their clients.

  Information architecture

  Before

  

  After

  

  Informational page

  Before

  

  After

  

Drill down page

Replaced a long scrolling page.

Results

• The client was satisfied with the redesigned pages.
• Summative usability study confirmed that the redesigned pages are easier to use than the previous ones.

Natural Resources Revenue Data Portal

I haven’t had time to put together detailed case studies for projects I’ve done in my current role. You can read about the work we’ve been doing in our blog and you can view all of my work on GitHub.

The Maine Ballot

I haven’t had time to put together a detailed case study for this project. You can learn more about it in on the Civic Tech Chat podcast, the OpenMaine blog or my colleague’s blog.

Website: maineballot.org GitHub: Maine Ballot repository

OpenMaine

I haven’t had time to put together case studies for my volunteer projects.

Legislative scorecard

Launched projects include a state legislative scorecard used by Maine People’s Alliance and Maine AFL-CIO.
Wireframes
Product Framing