Transforming
the Department
of Education’s
Digital Experience
I redesigned the website for desktop and mobile, streamlining access
to key resources for
parents and students.
Role
UX/UI Designer
Duration
4 Weeks (2024)
Team
4 UX/UI Designers
(including me)
Tools
Figma, Photoshop, Trello, Chat GPT
Research Methods
User Interviews, Persona Creation, Empathy Map, Insight Synthesis, Competitive Analysis, Heuristic Evaluation, Usability Testing, Information Architecture, Decision Flow Diagrams, Wireframing, Prototyping, Interaction Design, Visual Design
Project Overview
The Department of Education (ED) is a government website to promote student achievement. The aim of this project was to improve navigation, accessibility, and user experience for its diverse audience.
My Impact
Throughout the project timeline, I oversaw the website usability issues, organization of website information, and redesign of the desktop and mobile version of the website.
User Interface Analysis
I led a thorough usability review of the current website, identifying key issues to create a more user-friendly and accessible design, saving time and resources in the user testing and redesign process.
Information Architecture
I directed the content management for the website, strategically prioritizing key information to streamline the user journey and ensure quick access to essential content.
Visual Design
I managed the creation of the style guide for both desktop and mobile to ensure easy, consistent updates, enabling a seamless, cohesive look across all pages.
The Problem
For busy parents of high school seniors, managing tuition and college expenses is already challenging enough. The last thing they need is the added stress of a confusing website, where finding essential information on student loans and grants feels like an obstacle course.
​
Unfortunately, the current ED website falls short, burying crucial details behind complex navigation and poor user experience.
Empathize
To truly understand the needs of busy parents navigating the college funding process, we dove deep into the existing website through usability tests. These sessions revealed the common pain points, inefficiencies, and areas of confusion.
​
To enhance our insights, I conducted a thorough heuristic evaluation, shining a light on the critical usability and accessibility issues rooted in established design principles. This process allowed me to uncover the underlying challenges users face, moving beyond surface-level frustrations to grasp the true obstacles in their journey.
​
Here are the key challenges we identified:
01
Information Overload
Excessive button options and dense text on a single page overwhelms users, making it difficult for them to find what they need.
02
Confusing Navigation
The website categories are organized in a
way that feels counterintuitive, leaving users disoriented and frustrated as they navigate.
03
Unclear
Terminology
The website is
filled with jargon
that lacks clear definitions, leaving users confused
and struggling
to understand
critical information they need.
How might we improve ED’s website so that users are successful based on overall user satisfaction?
We believe that redesigning the navigation will streamline the research process for parents of high school seniors, making it easier for them to locate the information they need around college tuition options.
Information Architecture
I led the creation of a sitemap that served as the foundation for our navigation redesign, ensuring that users could quickly and easily access the most important information about student loans and grants.
Prototype
To enhance the user journey, we redesigned the homepage, student loans page, and grants page with an emphasis on the overall navigation to create easy access to essential information. You can explore the low-fidelity prototype here.
Test & Iterate
During our usability tests with our mid-fi prototype, we encountered significant technical issues with the dropdown menus as demonstrated below, so our main focus for the final iteration was to ensure the dropdown menu didn't disappear when the cursor hovered to the sub-navigation.
Final Design
Redesigning the Department of Education's website with a focus on their navigation helps busy parents spend less time stressing and more time ensuring their kids are set up for success in the future. Explore our final prototype here.
Visual Design
The redesign of the U.S. Department of Education website emphasizes the brand's color palette, using deep navy blue for stability, and gold for highlights. Montserrat will be the primary font, providing a professional and clean look. The design follows a 12-column responsive grid to enhance readability.
Color
Typography
Navigation
Next Steps
To foster further progress, we propose a strategy centered on actively engaging the stakeholders of the Department of Education while establishing a cohesive user interface across all web pages. This approach will enable effective measurement of the updates’ success, significantly enhancing the overall user experience and journey. The strategy encompasses the following key components:
01
Stakeholder Involvement
To effectively measure success across other key performance indicators (KPIs) such as website session durations obtaining approval from ED's stakeholders to utilize our prototype is the next crucial step to ensure that the project fulfills users' goals.
02
Utilize Style Guide Across Website
Due to our time constraints, we focused on establishing a solid foundation for the website, particularly enhancing the navigation for loans and grants. The next phase will involve integrating the style guide on the other services and information ED provides.
Final Takeaways
While working on this project for 4 weeks with 3 teammates with different design approaches, I've learned a lot while going through unexpected challenges with my team.
01
The More In-Depth the Style Guide, the Better
Spending more time on a style guide that includes multiple components, different button states, wider black and white color palette helps create hi-fi prototypes more efficiently.
02
Delegation is Essential
With the role of Scrum Master, there are a lot of tasks to manage to ensure deadlines are being met. Ensuring everyone has a fair share of tasks and the time is well balanced between all team members is important. Everyone learns differently, and has their own strengths, and helping each individual reach their potential was fulfilling.
03
Learning While Doing
Having little prior knowledge of UX/UI, it has definitely been challenging learning many new skills all at once, as it can take lots of time at first. However, with lots of practice through this project, I am retaining the new knowledge and feeling more confident each step of the way.
