Re employ Maine logo
 
 

MISSION Improve the user experience for Maine’s unemployment website, reemployme.gov

ROLE UX Researcher/Designer

TASK Solo Passion Project

TIMELINE 6 week sprint

SOFTWARE Figma, Sketch, Adobe Illustrator

UX PROCESS Market Research, User Interviews, Survey, Affinity Mapping, User Personas, User Flows, Site Map, Card Sorting, Design Sketches, Wireframes, Usability Testing, A/B Testing, High Fidelity Prototype

 
signs and business logos representing Maine
 

Motivation

Being unemployed is stressful, but being on unemployment shouldn’t be.

Unfortunately, in Maine, that is not the case. “Clunky” navigation, government jargon, and poor communication leave ReEmployME users frustrated and confused.

One current user put it this way: “It seems like such a cheap, poorly constructed site that it doesn’t feel safe. <b>There is so much riding on this site for people’s well being, that it doesn’t feel like a safe way to cover your livelihood.”</b>

As a Maine resident myself, that hurt to hear, and I wanted to use the design resources in my tool belt to make a difference for my fellow “Maine-ahs.”

 

 RESEARCH

 

Current State

At first glance, there are several UI issues.

The current state home page of re employ Maine.

 A Closer Look: The Menu

 

A separate tab, “Update Address,” has identical content to the “Contact Details” option. Alternately, a tab labeled “Account” or “Profile” could would better describe the contents of this tab.

Several drop downs are unnecessary. Here, the tab could simply be labeled “Claimant/Claim Inquiry.”

Some users do not understand terminology used in labels, such as “Correspondences.” A better term might be “Messages.”

 See For Yourself…

Explore the low fidelity prototype made with screen shots of the current state site using Sketch and InVision.

PROTOTYPE LINK

 

 User Research

I conducted a survey, which I posted on the Facebook group “Unemployment Maine Information and Help”. The survey helped me uncover unrealized user types and receive unbiased information, as I did not know the participants’ identities.

User interviews helped me dig deeper into the current user experience.

 
an image of Maine with 5 on top, representing the 5 user interviews with Maine residents
 
an image of the United States with the number 5 on it, representing the five usability tests with users from outside of Maine
 

As part of the user interviews and usability tests, I asked users to rate their state’s site from 1 (false) to 5 (true) on key metrics.

 
 

According to these results, other states have room for improvement, but Maine scored significantly lower. With this in mind, I gathered feedback from interviews and found trends using affinity mapping.

 

SYNTHESIS

Affinity Mapping

 

I grouped users’ comments into four major pain points:

BTW…

Having had personal experience on the ReEmployME, there were topics I expected to be issues that did not come up in interviews or turned out to be non-issues. I therefore did not address them in my re-design.

User Personas

 

Before determining which opportunities to address in this sprint, it was important to understand the users and their needs.

The Babyboomer needs the site to get the job done.

  • Needs clearly worded questions, helpful career center, and accessible customer service

  • Has low/realistic expectations for the user interface (UI)

  • “It isn’t about how the site looks as long as it’s working.”

The Millennial wants a pleasant experience.

  • Is frustrated by poor navigation and wording

  • Has higher expectations for the UI

  • “It would have looked top of the line in my 8th grade multimedia class.”

 

The challenge here was designing a site that met both users needs.

Prioritization and the MoSCoW Method

Redesigning a state’s unemployment site is a big undertaking, and it would be easy to fall prey to scope creep. I used the MoSCoW method, which prioritizes elements of a project by what must, should, could, and won’t be done, to determine what would fall within the scope of this project while considering the time and resources available.

MustMake the site more accessible — Include links to aid for hard of hearing, ESL, and those without access to technologyMake DOL’s contact information easy to findSimplify navigationMake notifications/announcements easier to read Make messages from DOL easier to find/ add notice of new messages

Must:

  • Make the site more accessible — Include links to aid for hard of hearing, ESL, and those without access to technology

  • Make DOL’s contact information easy to find

  • Simplify navigation

  • Make notifications/announcements easier to read

  • Make messages from DOL easier to find/ add notice of new messages

Should:Include link to user guideOrganize footer

Should:

  • Include link to user guide

  • Organize footer

Could:Re-write weekly certification questions (I decided I needed participation from the DOL to undertake this and therefore included it in future recommendations.)Add new user onboarding (To be included in future recommendations.)

Could:

  • Re-write weekly certification questions (I decided I needed participation from the DOL to undertake this and therefore included it in future recommendations.)

  • Add new user onboarding (To be included in future recommendations.)

Won’t:Design new green and blue logo — Because ReEmployME is part of a larger ReEmployUSA, I held off on this for now. Address Employer Services — As a claimant, I only had access to Claimant Services. If this redesign is well received, I would be thrilled to extend the design to Employer Services in the future.Anything that required increased recourses, such as text message alerts, a chat function (allowing users to message with DOL personal live), and general improving speed of communication with the DOL fell out of scope.

Won’t:

  • Design new green and blue logo — Because ReEmployME is part of a larger ReEmployUSA, I held off on this for now.

  • Address Employer Services — As a claimant, I only had access to Claimant Services. If this redesign is well received, I would be thrilled to extend the design to Employer Services in the future.

  • Anything that required increased recourses, such as text message alerts, a chat function (allowing users to message with DOL personal live), and general improving speed of communication with the DOL fell out of scope.

And so…


PROBLEM

Maine residents on unemployment need a website with information that is organized and accessible so that they can easily complete key tasks and find important account information. 

 

SOLUTION

By organizing content in a way that prioritizes key functions and emphasizes accessibility, users will be able to easily navigate the site and successfully complete vital tasks. 

DESIGN

 1. Determine design requirements

Before I started designing the solution, I looked back at my research and came up with a list of requirements the design would need to fulfill.

• A balance of visuals and text
• Pictures/symbols for people who are not strong readers or fluent English speakers
• Clean but not sterile
• Not too fluffy, needs to look like an official government site
• Instructions/steps should be listed in bullet points
• Wording is clear. Doesn’t use government jargon or figures of speech

 2. Sketch

The landing page needed to be simple and impactful, allowing the user to find important information about their account and complete key tasks easily.

 3. Create wireframes in Figma

The large X on the home page denotes where a scenic Maine photograph will eventually be placed. This will reinforce the F pattern as well as appeal to Maine residents.

Users expressed that it was difficult to determine which yes/no answer bubbles matched with each question on the Weekly Certification form. The simple act of alternating gray and white backgrounds behind questions made it easier to follow along with the questions.

Information from multiple tabs in the original menu was consolidated to a central Claim Status page.

The term “Correspondences” was changed to “Messages.” Based on user feedback, “Messages” was eventually moved from the main menu up to take its place near the log in icon.

 4. Set expectations of government sites

 

Maine.gov has a simple but pleasing design. Scenic photographs of Maine are used throughout.

 

Illinois' unemployment site has a fairly refined UI for a government site.

 
 

MaineHealth's My Chart site has simple UI but includes helpful icons and a pleasant floral background.

 

New York's unemployment site has a very simple UI, but key functions are easy to find and complete.

 

 5. Find inspiration from Maine businesses

Like many logos and websites stemming from Maine, my design was inspired by the great outdoors. I knew I had to include blues and greens in the color palette, reflecting the forrest and the ocean, and I even used a photograph I took myself of a lighthouse near my home.

 
 
 

PROTOTYPE

 

See it.

With only four menu options, the home page is an easy jumping off point for the five key tasks. Helpful resources are grouped together, and news &amp; announcements are easy to read — no more red text!

With only four menu options, the home page is an easy jumping off point for the five key tasks. Helpful resources are grouped together, and news & announcements are easy to read — no more red text!

The ““Claim Status” page consolidates information about the user’s claim into one spot.

The ““Claim Status” page consolidates information about the user’s claim into one spot.

Questions are differentiated by alternating gray and white backgrounds to make it easier to select the correct answer for each question.

Questions are differentiated by alternating gray and white backgrounds to make it easier to select the correct answer for each question.

Users expect to see “Messages” in the upper right corner with Login and Home. I delivered, along with a red alert when a new message is waiting.

Users expect to see “Messages” in the upper right corner with Login and Home. I delivered, along with a red alert when a new message is waiting.

 
 

Watch it.

 
 

Explore it.

 

Usability Testing

For each design, including the current state, users were asked to complete key tasks and rate the site on navigation, look, ease of communication, and ease of contact. The keys tasks were:

  1. File weekly certification

  2. View claim/payment history

  3. View status of claim and understand any issues

  4. View communication from DOL

  5. Communicate with the DOL

Current State

Low Fidelity Prototype

Design 1

Rectangle 31.png

Design 2

 

 Site Map

To understand just how much the structure of the site has changed, take a look at the site map before and after the redesign. The main menu led to link after link after link, and information was spread between nine tabs. Now, there are are fewer layers in the information architecture, and information is consolidated in fewer menu tabs. (Select images to expand.)

 
 

 So, What’s Next?

TL;DR

“Maine-ahs” are very proud of their home, and I wanted to design a website that reflected them and that they would be proud to use. Just because it is a government site does not mean it needs to look dated. I tried to elevate the UI of a government site while remaining professional, and I feel I was successful.

Users thought I was successful as well. On a scale of 1 to 5 (1 = bad, 5 = good) users gave the current site a 1.85 on looks and a 2.25 on navigation. My new design received a 5 on looks and a 4.5 on navigation.

There is more work to be done in the future — such as designing the Employer Services side of the site — which I am eager to take on. I will continue reaching out to Maine’s Department of Labor and hope to present my research and design to them. I do not expect anything in return but would be proud to see my efforts result in positive change for Maine residents on unemployment.

This was my first project after my time at General Assembly, and I thrived on the opportunity to choose a topic I was passionate about and to set my own schedule. In six weeks, I researched a complicated industry, interviewed users with real and valid frustrations, made design decisions that I could justify by research, and ironed out pain points through usability testing. During this time, I saw my skills in Figma grow and my eye for design strengthen. This project deepened my passion for UX and justified my pursuit of this career. Now for my next project!

PROTOTYPE LINK