MyKU UX Redesign

Redesign the user experience (UX) and user interface (UI) for the student-facing portion of myKU, specifically the parts of the site that are related to class registration/planning/enrollment. After some research and Information Architecture documentation, build a prototype of a web app that makes this process painless, and maybe even fun. Optimize this process for desktop & touch-devices.

Analysis

  • 50 ways to do the same thing
  • Does not tell you if there is a schedule conflict or until after you go through the very lengthy enrollment/checkout process
  • Every click takes you to a new page
  • Going back a step is impossible without compeletely restarting
  • Dropdown search criteria is hard to use
  • Everything is small and off to the left
  • Indicators for checkout process are small and not noticable

Process Flow

Original
Revised

Research

ASOS

This check out system works well because it shows you all the steps of the check out process so you have an idea of your progress and how long it will take to complete it. There is also a quick view option on the search page so you don't need to leave your current search to view the product details or add it to the cart.

Target

I like the Target check out process because it uses a quick view box when you add something to the cart so you don't have to leave your current position in the search page. Like ASOS, it also shows you all the steps in the check out process and keeps a simple summary in the side bar.

Hunter

When you click add to bag, a drop down appears which gives you the option to go to check out but does not force you to leave the page. Bar across the top shows you which step of check out you are currently in. During check out it gives you the option to view or edit your cart if you need to make changes... (but would be better if you could do it right from checkout page instead of redirecting.)

Cotton Bureau

Sidebar shopping cart is super helpful and you can even continue to check out through the sidebar.

Nordstrom

Quick view add to cart is nice... Check out is simple and you can see each step of the process... although I would prefer the steps to be across the top instead of listed vertically.

Personas

Wireframes & Prototypes


User Testing

Usability Testing Script

Desktop
  1. You have advisement later this week but you want to be prepared before you meet with your advisor. Find out which requirements you still need to meet so you know how to plan for next semester.
  2. Create a tentative schedule for next semester.
  3. You found a combination of classes that works, but you know that you might need a back up plan if something changes when your registration time arrives. You need to keep this working combination and create a second tentative schedule as a backup.
  4. Your registration time has arrived and you're ready to enroll! Enroll in a combination of classes that works.
  5. It's the 5th week of the semester, you realized you're not doing well in Sociology, and you want to drop.
  6. You took Graphics 1 this (spring) semester, and you loved it. Graphics 2 doesn't fit into your schedule for next semester (fall) so you want to know if Graphics 2 is offered the semester after that (next spring). See if Graphics 2 is offered next spring semester.
  7. You have some space in your schedule and want to take an elective. Find classes that you can enroll in without any prerequisites.
Mobile
  1. It's 2 minutes before your magical actual registration time, you're not in front of a computer, so you need to use your phone to register for your tentative schedule. You are worried one of your classes might have filled up already. If it has, figure out how to enroll in all the classes you need.
  2. You know that you need an English and also a WI class. Search for a class that fulfills both of those requirements.
  3. It is Add/Drop week and you are enrolled in a schedule that works, but you decided you want to include Ad 1 in your schedule. You know exactly which section you need for it to fit in your schedule. Enroll in Ad1.

Usability Testing Results

Round 1 Observations
Task: Check Requirements
  • User 1 went to Add Class page first in search of requirements instead of my academics page. There is a button to view requirements on Add Class page and a drop down to search by requirements as well so that is okay but "Academics" is not intuitive.
  • User 2 - finding requirements was difficult. User 2 went to every page except My Academics... definitely confusing. "My Academics" is not an obvious first choice.
Task: Save Combination
  • User 1 - New and Current tabs might be confusing. Plan and Current Schedule relation might be confusing
  • User 2 - went to Current Schedule instead of Planner... Maybe Schedule and Planner sound too similar
  • User 2 - Save Combo & New Combo worked well and were easy to understand
Task: Drop Class
  • User 1 - Tried to drop from home page instead of schedule
Task: Search in a Future Semester
  • User 1 & User 2 had difficulty finding the semester picker dropdown
Round 1 Final Notes & Revisions
  • Academics and Add Class need to be renamed for better site navigation
  • Planner and Schedule are causing confusiong... should be renamed
  • User should be able to drop class from their schedule on the home page as well as the "Schedule" page
  • Drop a class needs a confirmation modal or some confirmation check
  • Semester picker should be moved to the top of the search criteria
  • Both users found "My Acedemics" to be confusing. Might need to be a dropdown in the nav or to be renamed completely
Round 2 Observations
Task: Check Requirements
  • Both users easily found requirements on the View Requirements page
Task: Create Tenative Schedule
  • User 1 went to "Schedule" page instead of using Planner tab to create tentative plan/schedule for next semester
  • User 1 had to click around a lot before understanding how to add a section of a class in the planner
  • Button for "academic events" in planner is confusing for User
  • User 2 went right to Planner tab
  • User 2 kept clicking "Current" tab. This tab might not be necessary
Task: Drop Class
  • User 1 went to Planner instead of Schedule to drop class
  • User 1 & User 2 tried to drop class from homepage
Task: Mobile
  • User 2 had a hard time differentiating which tab in the planner was active; combo 1 or combo 2
Round 2 Final Notes & Revisions
  • "Planner" and "Schedule" terminology are still confusing and should be renamed
  • Tabs in planner should be simplified - save, new and clear only
  • Academic Events does not need to be in the planner tab
  • Both users in this round better understood the process and purpose of the planner and those in round 1
  • Drop class from homepage shcedule should be an option
  • Advanced search features need to be more prominmant. No one in scrolling down far enough to realize they are there.
  • Tabs for multiple combos in planner need to be displayed differently
Round 3 Observations
Task: Search for Class
  • User 1, 2, and 3 thought icons on search results were confusing - green seems like you already took it and red seems like you need to take it. Intention was for green to me that you are able to take it, red there is a conflict
  • All Users are still hesitant to choose planner
  • User 1 - Planner was easy to navigate
  • User 2 thought "Add Class" meant strickly to add, not to search. This nav link might need to be renamed to be more clear that you search first
  • User 2 did not notice the vertical search bar down the left side... Maybe search bar should be horizontal across top
Task: Enroll
  • User 1 - Enroll confirmation box came up below fold and was almost missed
  • User 1 - Planner was easy to navigate
Task: Find a Class With No Prerequisites
  • User 2 and User 3 looked for this option in the search "requirements" dropdown and on the Requirements page - it took a lot of clicking and scrolling before they foudn the "no prereqs" check box in advanced search
Round 3 Final Notes & Revisions
Task: Search/Add Class
  • Search result icons are confusing and need to be reworked
  • Search bar might need to be horizontal and across the top. Users are not realizing it is there or that there are advanced search options further down.
  • Search for no prerequisites was a hassle for 2 users. This option might need to be more places for better usability