WGU Student Portal Web App
Western Governors University (WGU) is a nonprofit, online university, focused on competency-based learning. They take pride in providing above-average student support with their individualized mentorship programs and peer support communities. The student portal is the primary way for WGU to deliver on these services. For this reason, WGU asked Axis41 to make refinements to the student portal, with these particular goals in mind:
• Create easy-to-read infographics to show program progress, and course progress
• Make it easier to connect with mentors and peers on the site
• Apply the new WGU brand, while evolving and standardizing the UI visual language
Client: Western Governors University (WGU)
Agency: Axis41
My Role: As the lead UX/UI designer, I collaborated with stakeholders, defined the content strategy, drafted wireframes, created high-fidelity designs, and developed a UI system.
Dashboard Home Page
The home page was designed to give students quick access to their active courses, action items, and events. Program progress is also visible to help students stay focused on their graduation goal. The student's mentor and support resources are easily accessible to give a sense of community in this digital space.
Online Course
Working within the specifications of a third-party system, we applied the WGU branding to the course pages while making usability refinements. As part of these refinements, we incorporated more consistent styles for buttons with a clearer hierarchy. We also updated icons and included legends where necessary to help students more quickly get up to speed with the interface.
Student Support
A major goal for the site was to create a sense of community by giving students quick access to support. The new design makes it easy for students to join a study group or get in contact with their program mentor, course mentor, or peers.
UI System
Creating a more consistent and user-friendly user interface was an important part of the project. The UI kit below defines styles, hierarchy, and usage of common UI elements, including buttons and icons.
Wireframes
The designs above were first wireframed iteratively, ensuring the right content and flow was in place before diving into high-fidelity designs.
