UX Strategy, Design, Interaction Design and Prototyping
With the advent of the smartphone, the users of today have gotten accustomed to accomplishing tasks while on the go. This is equally true for today’s college culture; students need to accomplish tasks, such as viewing grades and registering for classes, teachers need to post grades and communicate with online classes and advisors need access to provide excellent service to their students.
Pixel Commerce has been tasked with helping to reenergize a platform [PowerCampus] that can keep pace with today’s technological and cultural demands, focusing on the faculty, advisor and students personas.
4 existing flows in PowerCampus had to be reworked because of the critical usage between users. Two of the key flows are discussed below.
The homepage for PowerCampus provides very little direction for the users of the platform. A homepage needs to provide a aggregation of actionable information, so the user has a pathway to their next action or set of actions. The current design only provides generic links that can also be accessed by the main navigation.
The design does not adapt to the needs of the user logging in. For example, the design does not provide a message prompting student users to register for classes, or update students on grades that may have been updated.
This was highlighted as one of the key flows that required a complete rework.
The current registration process lacked intuitiveness and clarity. The information was displayed in a concentrated and somewhat confusing manner.
For example, the flow of registration had a system where the student user would add a class into a “shopping cart.” However, students often times did not, and do not associate their classes with shopping and buying items online.
The process of registering for classes needs ease of access.
Another feature that is used frequently is the degree requirements page. This page gave student users a glimpse into what their path to graduation would look like, showcasing required course hours and credits.
Here, like many other aspects of the program, hierarchy of information is an issue, and jumbled – opposite of what is needed into a program of this type. For example, the table gives in depth course information – information the student user has not yet committed to, making this information somewhat unnecessary, in the eyes of the user.
College is a new social environment for many students, and this change is stressful across a number of avenues. We did not want this program to be one of those elements to add to that stress. Obviously, we wanted it to come across as one of the least stressful aspects of the school experience, if not capable of taking some stress away from the student users.
We wanted PowerCampus to reflect a kind of playfulness that exists within the school experience through a new, refined UI. That playfulness would welcome users while they’re on the go, either through mobile devices or their tablets and refining each individual experience to the needs of the user while they are performing their tasks.
After auditing each page, pattern, and interaction, we helped Ellucian upgrade their existing Design System. The majority of the work done on PowerCampus was intended to establish or update patterns for reuse in other software within their suite offering.
A large part of what Pixel Commerce created as a prototype outlining how components interacted with one another, and how users navigated from Point A to B. This was specifically targeted to the PowerCampus experience. View the prototype here.
Pixel Commerce has brought forth the information most utilized by student users to the forefront of each design element, removing the excess elements. This streamlined approach puts the choice within the users’ hands – should they require more information the user is given the choice to explore further, rather than present all features at once.
The new homepage puts the student users’ schedule front and center, for the schedule is one of the largest aspects of a student’s life. Their classes, activities, due dates, etc. are all placed on the new PowerCampus homepage. Pixel Commerce also has included the use of a notification system in this interface, allowing for many possibilities:
On top of these, Pixel Commerce has also included the target graduation date module, allowing the student users to have a quick glimpse into where they are in their school journey.
The new Registration interface is mobile friendly, interactive and pretty cool, all things considered.
There is now an ever present calendar that sticks as the user finds either a calendar that their friends are sharing, or as they individually select their courses.
In the phone experience, the calendar remains at the bottom, allowing the student users to get a full view of their choices, but allowing them for a review of the items selected.
Incorporating a new, streamlined hierarchy, the new design also identifies categories for clear, relevant information. This clears up the spacing and makes the present information more meaningful.
Student users can explore the breadth of their degree options (undergrad v graduate, degree name and type enrollment) and can select course information should they choose.
As our work concluded, Ellucian has been left with an updated version of their design system, an ever evolving framework that allows additional work to be added with ease. The Design Team (Ellucian, Pixel Commerce, and other additional contractors) decided to use Sketch Library’s system to incorporate and grow the reusable components, which established the building blocks for any other design work to move forward.