Competitive Analysis
Heading
Test Results
Heading
Empathy Map
Heading
Site Map
Heading
Wireframes
Heading
Style Guides
Heading
Desktop Home Page
Heading
Desktop Laws and Guidance Page
Heading
Desktop Student Loans and Loan Forgiveness Page
Heading
Problem Statement
Significant user experience issues are present on the Department of Education website at the moment, including a lack of structure in the data presentation, an excessive amount of white space, and numerous broken links. Users complain that the website is outdated and confusing. The design team's job is to update the website's look and reorganize the data so that it is more user-friendly and accessible.
Primary Goals
My Roles
I was a key contributor to the UX discovery, definition, design, development, and delivery of the DoE website makeover as part of our team effort.
Deliverables
We developed user personas to direct our design decisions, empathy maps to better understand users' problems, and storyboards to depict user journeys as part of the redesign process.
Tools
We used the following tools to produce these deliverables: Miro for collaboration and idea generation. For prototyping and wireframing, Adobe XD and Figma. Acrobat and Photoshop for graphic design. MS Word and Google Sheets for documentation. Zoom for user testing and virtual meetings
Discover
We carried out a detailed heuristic review, competitive analysis, and numerous rounds of user testing as part of our user research to understand the pain points and annoyances that users were encountering on the Department of Education website. We discovered that consumers frequently struggled with the site's navigation because of the overwhelming number of links there. The site's outdated and unattractive aesthetic was also immediately apparent which diminished the user experience.
Define
Based on the results of our research, we created an empathy map to better understand customer pain points and performed feature prioritizing and card sorting exercises on the navigation of the website. We were able to decide which characteristics may be deleted with the help of these activities. We then created a new site map that served as the basis for our wireframes and prototypes by reorganizing the information architecture (IA) and grouping the links in a more logical order.
"It's very hard to find what I actually want. I have to read through all that and not be able to filter to find what I'm looking for." — Marie, 37
Design
We developed style guides for the desktop and mobile versions of the site using the new site map as an outline. While reorganizing the data to facilitate navigation, we added hero photos to give the website a more contemporary appearance. Additionally, we improved the balance of the white space and gave the mission statement a more prominent position on the homepage. In addition, we ensured that the website complied with Section 508 in its entirety, making it accessible to all users, including those with impairments.
In addition to competitive analysis and empathy maps, our team also produced sitemaps, wireframes, and style guides for the desktop and mobile versions of the website. All of these deliverables were developed based on our extensive user research. For a more contemporary appearance and simpler navigation, we also suggested hero images, reorganized the data, and optimized the homepage with well-balanced white space and a more prominent mission statement, which led to a successful website redesign that satisfied our client's requirements and went above and beyond their expectations.
