US Dept of Education

Website Redesign

UX UI Banners.png

The Problem:

The US Department of Education site lacks ease of use, cohesiveness, and all-around way too much detail to take in. 

The Solution:

The product we produced helps the Department of Education accomplish student success and academic competitiveness by providing detailed and easily accessible content that makes students of any age feel successful or knowledgeable. They can easily on their own accomplish access to grants and more information about the collegiate schools.

Tools Used: Adobe XD, Miro, Google Drive. Created by Lindsay, UX/UI Researcher and Designer.
1706c9f16bd08eb5e03f1df3e0a94a1c.png
Adobe_Photoshop_CC_icon.svg.png

Other Team Members

Karen & Christine

My Role:

Research Design and Presentation

The Process

Research

We started our research with card sorting and trying to understand the user flow for accessing grant information. Because this site is so heavy with information, we knew immediately we would need to condense the information and make a clear path for any sort of action. 

Mobile - User Flow Diagram.jpg
Website - User Flow Diagram.jpg

Usability Test:

Task: 

Please locate the following

1. Homepage

2. Grants

3. Apply for grants

User 1: User 1 started out strong but had some trouble completing the tasks due to the over saturation of information and links. When he was going through he noticed that there were links for almost every section and not enough description on where to go next. Due to this he ended up on the wrong pages which caused the failure of the task.

 

User 2: User 2 had a little more luck but also had a little more direction. I approached this user a little differently since the first user test did not turn out to be successful. User 2 was able to finish the tasks but did get stuck on a couple different sections, saying that the overwhelming information made it hard to focus on where she needed to go next. 

Results:

Due to the lack of Sub Navigation within the Main navigation and our first user test, we found that we had enough information to forego the Usability Testing on the Navigation. We feel that we will be able to successfully create new navigation. 

Screen Shot 2022-05-30 at 1.36.44 PM.png

User Persona

Our user, Ethan, is a high school student who is looking for ways to help his mother pay for his college tuition. He accesses ed.gov to see if there is any information on grants and general eligibility to obtain them. If he is eligible, he will go ahead and apply for such grants.

Ethan-Proto-Persona.jpg

User Flow

Based on Usability testing, we created easy-to-use navigation that utilizes a sub-navigation. This will allow users to see all options available for that section of the site.

card_sorting_current.png
card_sorting_redesign.png
Screen Shot 2022-05-30 at 1.42.29 PM.png
Screen Shot 2022-05-30 at 1.42.38 PM.png

Lofi Prototype

We created a simple prototype that features drop-down style navigation and a hover underline to show where your curser is.  

User Testing

The usability testing turned out to be the most useful part of this process since we got very important feedback from everyone. The general consensus was that the Mission statement needed to be easier to find and understand. Additionally, accessibility was something we were lacking and adjusted accordingly. 

User Test Plan.png

Omar

Likes color usage, mission statement difficult to find, nice aesthetic.

Emily

Space links out on mission statement, check alignment on contacts

Bonnie

Mission Statement more obvious, Check ADA

Skyler

Found it a little difficult to touch the menu but everything else looked nice

Davis

Enjoyed the clean design, understood the purpose of the website

Paige

Likes the logo, understands the website shes on, easy to read, pictures help, doesn’t like the - as the bullet points

Kelly

Did not like the bullet points in the mission statement, suggested pictures behind the 4 categories in the mission statement like on the homepage

Shayan

Change color of CTA bc blends in with logo, make menu 3 bars, "Why am i on this site", move "subscribe to email" up

Screen Shot 2022-05-30 at 1.56.58 PM.png

Iterations

Screen Shot 2022-05-30 at 2.03.47 PM.png

Style Guide

styleguide.png

Final Prototype

Our final prototype exemplifies what we think would be perfect for The US Department of Education. The mission is clear and the information is organized in a thoughtful way with the users in mind.

UX UI Banners.gif

What's Next

1. Designing Mobile First! I learned really quickly that it is much easier to convert to the web than to convert to mobile. This will be really useful in future work.

2. Make sure your user tests include people outside of the cohort. I made sure to mix in tests of my friends, who are just the everyday user and I got some very useful usability information from them that was not designer-focused. 

3. Teamwork! I really enjoyed my team and we all pulled equal weight which was very nice and helpful for this redesign. Our strengths definitely complimented everyone’s weaknesses. 

↓ See my other projects i've been working on ↓