U.S. Department of Edu | Website Redesign

Interview Takeaways

People visit the U.S. Department of Education (DOE) website because it is reputable and important, but the site makes users feel overwhelmed.

Audit

Before jumping into solutions, I wanted to get familiar with the baseline I’d be working from. I conducted an audit of the current DOE site and came up with some overarching UX/UI weaknesses.

• Difficult navigation
• Unclear language
• Poor informational architecture

Home Page

1. Add home page to navigation bar
2. Make primary content more eye catching
3. Reduce unnecessary links
4. Give the mission statement more prominence
5. Get rid of additional nav bar

Grant Page

1. Emphasize the overview
2. Move student aid info to student loan page
3. Reduce unnecessary links
4. Reiterate the difference between grants and loans

Student Loan Page

1. Emphasize the main options
2. Clarify the step-by-step instructions (graphic)
3. Reduce unnecessary links
4. Add more photography & visual elements
5. Reiterate the difference between loans and grants

How Might We

• Improve the informational architecture to make navigation seamless?
• Update copywriting to be educational, inclusive, and inviting?
• Create a user interface that is fun yet inspirational?

Card Sorting

Participants knew grants and loans were similar yet different. They determined, based on their sorting, that grants and loans should be near each other because they are associated but separated because they have distinct differences.

• 4/5 participants sorted grants and loans into separate groups
• 100% of participants placed grants and loans in an overarching category together

User Persona

The goal here is to help college students navigate information on how to pay for college, so I chose a first generation student who might need more support than usual.

User Path

There are many ways to pay for college, but based on my research, the most common is through a Direct Subsidized Loan. With that in mind, the following solution is focused on getting the user through the wizard/walk-through to the Direct Subsidized Loan information page.

Sketches

Wireflow

UI Style Guide

Education takes on many forms, so I challenged myself to lean into the complexity. My goal was to create a space where serious academia meets playful inspiration.

The purple represents royalty and the serious academia side of education. It also doubles as an equal representation of U.S. politics because due to the 10th amendment, education is primarily run by the state, not the federal government.

The orange added a fun contrast as it represents energy, excitement, and adventure. It’s a reminder that education should be playful and inspiring.

Lastly, I chose the butterfly to represent transformation and change. Education is so powerful as it can open so many doors for so many people. I wanted users to feel excited about their journey the second they visited the site.