UX Practical Test

Three hours passed quickly!

Below is a summary of the work I did during this challenge, as well as notes about:

Assumptions or decisions I made along the way
Where I would have spent more time or given things more thought
Any place where the wireframe doesn’t accurately represent the design I had in mind

There are some additional notes on the post-its in the Balsamiq wireframes. I've also emailed those files to you in case the images are too small to read clearly on this site.

Time: 0:00 - 0:30

During this time I reviewed my notes, sketched out some rough wireframes, and wrote down questions / assumptions. I then wrote a scenario to capture my understanding of the required functionality.

Sandra is responsible for data entry at the university where she works. She has been given a list of changes that she needs to make to the school’s online curriculum map data. In order to get her work done, she needs to complete the following tasks:

Navigate to a page where she can see a list of all courses at the school.
Locate ADV 109 and make sure each of its Course Learning Outcomes is mapped to a Program Learning Outcome for the Advertising BFA degree program.
Understand how to edit or delete an existing course, or create a new one.
Add several courses to the catalog.
Navigate to a page where she can see a list of all degree programs at the school.
Select “Advertising BFA” and edit one of the Program Learning Outcomes.
- See a list of courses that will be impacted by her edits, and clearly understand what her options are.
Delete one of the Program Learning Outcomes for Advertising BFA.
- See a list of courses that will be impacted by her edits, and clearly understand what her options are.

Sandra will do this work on a laptop or desktop computer and does not need to access these pages on a mobile device.

In real life, after writing this I would circle back to the team (product manager, client, or other key stakeholders) to make sure that I haven’t missed anything important. For this exercise, I assumed that the above list is correct and that it was okay to proceed with this scope.

Time: 0:30-2:30

During this time, I created the following wireframes. Based on my initial conversation with Marcus, I started with the following assumptions:

Users will see the correct view based on login permissions. If they have edit permissions, they will see the Actions column or other editing functionality. If they don't, they won't see that. Due to time constraints I only wireframed the views for a user with edit permissions, but I've noted below each wireframe what would change if they had read-only permissions instead.
I did not worry about how the user navigates to this feature and just assumed that this is her starting point when she begins to make changes to courses and programs.

This diagram shows how the wireframes below fit together.

Manage Courses: Sandra can view a list of courses and click to edit, copy, or delete any of them. She also can search and filter, and add a new course from scratch.I assumed that courses might have both a name and a number, and that users might want… — Manage Courses: Sandra can view a list of courses and click to edit, copy, or delete any of them. She also can search and filter, and add a new course from scratch.
I assumed that courses might have both a name and a number, and that users might want to search for or sort by either of those fields. I included two columns on the View Course page to accommodate this.
Other assumptions: the user logs into the site already knowing what she needs to edit or add. Her goal is to navigate to the appropriate page and mage her changes. It would be possible to design this and the subsequent screens with an expanded view that shows more details for each course or program, but based on my assumption, that wouldn't be needed. I also assumed that she wouldn't have a need to bulk edit courses, and that it would be okay to edit them one at a time.
**Read-only users would not see the Actions column or "add a course" button.**

Manage Courses - detail: This shows that any courses missing PLO information would be flagged on the Manage Courses page so they can be quickly identified and corrected. As noted in the post-it, it might be nice to add an additional filter so she ca… — Manage Courses - detail: This shows that any courses missing PLO information would be flagged on the Manage Courses page so they can be quickly identified and corrected. As noted in the post-it, it might be nice to add an additional filter so she can see only courses that are missing this information.
**Read-only users would not see the Actions column or "add a course" button.**

Edit Course: Sandra can see details of a course and can edit, delete, copy or add CLOs. For each one, she is asked to select from a list of PLOs for the associated degree program.Read-only users would not see the Actions column or "save changes" but… — Edit Course: Sandra can see details of a course and can edit, delete, copy or add CLOs. For each one, she is asked to select from a list of PLOs for the associated degree program.
**Read-only users would not see the Actions column or** "save changes" button. The page would be titled "View Course." The PLO would appear as a static value rather than a drop-down menu. No inline editing would be available in the CLO column. The Add item link would not be visible.

Edit Course - alert text:  this shows an explanation that would appear on hover for the alert icon next to a CLO that doesn’t have an associated PLO.Read-only users would not see the Actions column or "save changes" button. The page would be ti… — Edit Course - alert text: this shows an explanation that would appear on hover for the alert icon next to a CLO that doesn’t have an associated PLO.
**Read-only users would not see the Actions column or** "save changes" button. The page would be titled "View Course." The PLO would appear as a static value rather than a drop-down menu. No inline editing would be available in the CLO column. The Add item link would not be visible.

Add Course: This page shows what it might look like if Sandra creates a new course from scratch, which I realize isn’t the most common use case. As noted in the post-it, I think there are ways we could make this easier for her by allowing copy and p… — Add Course: This page shows what it might look like if Sandra creates a new course from scratch, which I realize isn’t the most common use case. As noted in the post-it, I think there are ways we could make this easier for her by allowing copy and paste of a full list of CLOs - if they are separated by line breaks, we could split them into a list for her and then ask her to choose a CLO for each one.
**Read-only users would not have access to this page.**

Pages I didn't wireframe due to time constraints:

Deleting a CLO (would probably just have a simple “are you sure” type of confirmation, since it’s a low impact deletion.)
Copying a CLO - I didn’t have time to show this, but clicking this would just add a new editable line item with a new drop-down menu for choosing the PLO.
Copying a Course. This would be similar to adding a course from scratch, except it would be pre-populated with course data which could then be edited.

Manage Programs: Sandra can see a list of programs and filter by type of degree. As noted on the post-it, given more time I would have liked to provide other filter options so she could see just a certain program, or only programs with inactive cour… — Manage Programs: Sandra can see a list of programs and filter by type of degree. As noted on the post-it, given more time I would have liked to provide other filter options so she could see just a certain program, or only programs with inactive courses.
NOTE: for this part of the process, I made a big assumption: it’s possible to have both active and inactive courses. I did this largely because I wanted to minimize the impact of deleting a PLO. Rather than deleting courses or orphaning them in the database, providing the active / inactive option allows them to be set to inactive if an associated PLO is deleted, which means the course is still recoverable if needed.
As I was working on this, it seems like it would make sense for this “manage programs” functionality to also allow Sandra to specify which courses are in which programs, but that opens a can of worms I didn’t want to get into during this exercise. Were I to continue on this project, I’d want to know more about how the client currently manages courses and programs, and whether there’s a way to link the new functionality into what they’re already doing.
I also assumed that she wouldn't have a need to bulk edit programs, and that it would be okay to edit them one at a time.
**Read-only users would not see the Actions column or "add a program" button.**

Manage Programs - detail: this shows that there could be a quick way to see which courses are in which programs. Related to my above note, I’m not sure if this is needed.Read-only users would not see the Actions column or "add a program" button. — Manage Programs - detail: this shows that there could be a quick way to see which courses are in which programs. Related to my above note, I’m not sure if this is needed.
**Read-only users would not see the Actions column** **or "add a program" button.**

Edit Program: This allows Sandra to edit the details of PLOs for any given program. As with the previous wireframes, I’d like to provide some type of inline editing for the PLO names and descriptions to facilitate the data entry process.I assumed th… — Edit Program: This allows Sandra to edit the details of PLOs for any given program. As with the previous wireframes, I’d like to provide some type of inline editing for the PLO names and descriptions to facilitate the data entry process.
I assumed that Sandra can't change the degree that a program is associated with. I also assumed that there’s no master PLO list shared across programs. For example, if Advertising has a Design Skills PLO and so does Photography, those would be entered as two separate items rather than pulled from one master list. This is based both on my conversation with Marcus, and also on the fact that it provides more versatility for the school - they might want to have two slightly different definitions of Design Skills rather than being required to apply one to all programs.
**Read-only users would not see the Actions column or "save changes" button. The page would be titled "View Program." No inline editing would be available in the PLO or description columns.**

Edit Program detail: shows that Sandra can quickly see which courses are associated with which PLOs. As noted in the post-it, this isn’t intended to suggest the final layout; I just wanted to show that this information would be available here in som… — Edit Program detail: shows that Sandra can quickly see which courses are associated with which PLOs. As noted in the post-it, this isn’t intended to suggest the final layout; I just wanted to show that this information would be available here in some way.
**Read-only users would not see the Actions column or** **"save changes" button. The page would be titled "View Program." No inline editing would be available in the PLO or description columns.**

Edit Program - Confirmation: This shows that any text edits made will impact all the courses using this PLO.Read-only users would not have access to this page. — Edit Program - Confirmation: This shows that any text edits made will impact all the courses using this PLO.

**Read-only users would not have access to this page.**

Delete Program - Confirmation: this shows a more serious confirmation message, telling Sandra that by deleting this PLO she is also deactivating all of the courses that it’s associated with.The biggest assumption I made is that we want to allow user… — Delete Program - Confirmation: this shows a more serious confirmation message, telling Sandra that by deleting this PLO she is also deactivating all of the courses that it’s associated with.
The biggest assumption I made is that we want to allow users to go ahead and delete a PLO, even if courses are impacted. However, rather than permanently deleting or canceling the affected courses, I chose to create an active / inactive status. If a course doesn’t map to all of the PLOs it would switch to an inactive status, which indicates that something about it needs to be updated before it can be part of a program. This is less severe than a permanent change, and allows for some degree of recovery if a PLO is accidentally deleted.

**Read-only users would not have access to this page.**

Time: 2:30-3:15

I spent this time creating this written summary to explain my thought process while working on this project. I also created the images above that show how the wireframes link together.

Thank you for the opportunity to complete this challenge!