top of page

UNITED STATES DEPARTMENT OF EDUCATION

USDOE Website & Mobile Redesign

The U.S. Department of Education Website has a lot of information, but it is difficult to navigate and identify what is and is not important on the site. I redesigned the site to make it more usable, with an easily identifiable hierarchy. 

USDOE Web and Mobile Home

PROJECT OVERVIEW

UX Designer, Partial Group Project

2 Week Timeline

Figma, Miro, InVision

RESEARCH

USER TESTING

5 User Interviews

Research Question: Our goal was to understand how users access critical info on the USDOE Website, and to understand the accessibility of user flows.

  • Task 1: Can users find the eligibility requirements for a Pell grant

  • Task 2: Can users find the link to the site to create a FERPA Complaint?

  • Task 3: On the current site, can users find the most important updates for ESSA?

  • Task 4: Can users navigate back to the original home page

HUERISTIC ANALYSIS

Our team found that the blue and grey coloring met AA accessibility, however the green color did not pass AA guidance on any background. When considering redesign, our team will ensure that AA accessibility is present.

Hueristics

We found that most of the difficulties on the site stem from the following UI errors:

  • Multiple areas of navigation

  • Lack a CTA

  • Lack a tutorial or user guidance

  • Too much information, not enough hierarchy

  • Information is also difficult to find

​

We wanted to make the following changes to help assist user accessibility.

  • Title Bar: Change existing pictures to a carousel for press releases; Better hierarchy of information; Make a home button

  • Second Title Bar: Increase text size and have less text to accommodate for reading accessibility

  • Press releases: Create a Hierarchy or feature, instead of another menu (too much info to process

  • How Do I Find...?: Change heading to “How Do I ind Information About...? then list corresponding links and subjects.

PAIN POINTS

Users indicated the most pain points in the area of navigation. Multiple areas of navigation exist, making it difficult for users to prioritize and know where to look: Difficulty finding specific pell grant info; difficulty returning home; difficulty using multiple areas of navigation. 

We considered users successful if they were able to navigate somewhere on their first try.

  • Task 1: ESSA Updated Info, 80% success rate

  • Task 2: FERPA Complaint Form, 80% success rate

  • Task 3: Pell Grant Eligibility, 40% success rate

  • Task 4: Navigate back to home, 60% success rate

Following this research, a user persona was created. This persona's goals included the following: ​

  • Get more information on ESSA and IDEA from the federal perspective

  • Help her high school students fund college with grants and loans

Pain Points included the following:

  • Finding information she needs in a timely manner

  • Understanding federal regulations

  • Understanding educational rights for parents

Usability Testing Results



DEFINITION AND IDEATION

THE PROBLEM

Due to these results, the goal of changing the navigation is to keep it simplified, but make information in each category more readily accessible to users.

Based on Department and User Prioritization, the following areas are noted to need focus:

  • Visible Home Button

  • Calls to Action

  • Edited Navigation

  • Clear User Paths

 

A series of user journeys, empathy maps, and storyboarding were based upon the persona developed through this study. Our users are focused on finding information quickly.

COMPETITOR ANALYSIS

Competitor 1: Ohio Department of Education

Noticeable holes: Lots of information and links

Strengths: Much more readable and accessible; Navigation is easier to follow

​

Competitor 2: Federal Student Aid

Noticeable holes: Does not include law and grant information

Strengths: Easy to read, Simple

​

​

CARD SORTING & SITE MAPPING

In order to determine the best way to organize the navigation, the current navigation was put on cards and organized accordingly. Navigation was then mixed up to prep for card sorting.

  • Office data more accessible with integrated loans & grants page

  • Option two splits the main navigation into the reason people visit the site, lessening the cognitive load.

  • Option 3 splits the navigation into types and ages of education. This helps users clarify information.

​

Based on user testing and overall navigation simplicity, I chose to focus in on option 3. Option 3 makes the navigation easier to understand for users, because they don’t need separate definitions. It also makes things more accessible based on the age group you’re looking for. This plan would alleviate the pain points.
Based on this choice, a new sitemap was developed.

PROTOTYPING

After the user research was organized, we began sketching some ideas for the site. From paper prototypes, wireframes were created.

USDOE Initial Prototype

GUERILLA USER TESTING

Rapid user tests were created on wireframes to understand the user flow, and iterate the project based on user needs.

Make Call to Actions more clear

Make top navigation smaller

Tone down bright white backgrounds

Make navigation appear more clickable

Make contact info more readily available

STYLE & DESIGN DEVELOPMENT

The goal of the U.S. Department of Education is to encourage student achievement, education access, and equal access. The UI style goal is to reflect these department goals by creating a clean, accessible, and simple site for users to work through. Information needs to be readily accessible for users and make sense.

 

The goal of the typography on this site is to keep a clean, easily readable and direct font. For this project, I chose to use a sans serif, as this most effectively communicates information professionally. I also chose to use the font, Rubik, due to it’s many forms and rounded corners, which is meant to help users read long blocks of text. Since this is an informational site, my goal was to make the information as accessible as possible.

NEXT STEPS

In the future, I would like to further design out the pages of the site. I would also like to refine how press release information is presented. Although I am happy with the overall design, I would like to add in more white space and content to the site. I would also like to explore a simple and effective student loan flow. 

bottom of page