Blackboard
In-Course Linking
Role: Lead designer and researcher
Team: 1 project manager, 1 product owner, 1 content designer, 1 scrum team
Timeline: 3 months
Background
As instructors are using the rich text editor in Ultra, there are often instances where they would like to link to another piece of content (such as a document, image or folder) from the same course. Currently there is no way to easily browse course items from the Rich Text Editor and insert them into a document, message or announcement.
The Problem
How might we allow teachers to easily link to content from their course within a document, message or announcement?
Initial Research
Because this project was connected to the rich text editor work I was doing, I wanted to roll these projects together. I already had a good background on how clients were creating content using the rich text editor and had interviewed a number of instructional designers who would leverage this functionality.
I began by researching a similar pattern that already existed in our product. I also researched other products with similar functionality. In a collaborative design
session with my team, we discovered that although we wanted to leverage something already in our design language system, it may limit our ability to come up with a good solution. It just didn't quite work. So we spent time coming up with a few different options based on our competitive research.
Ideation
With my research and knowledge of the rich text editor, I began to ideate on initial ideas. I felt that there were two main problems to solve: where do users find the option to insert a course link, and how does it actually work.
The Where
There were two options I felt could work. The first was combining the functionality with the existing "insert link" button in the rich text editor. This option would open a tabbed modal or dropdown menu that would allow users to choose between inserting a URL or inserting a course link. The other option was to create its own button within the rich text editor tool bar.
The How
I knew that users needed to be able to quickly and easily browse files from a course, but there were a few different approaches to it. Our product offers similar functionality in a few places and it seemed like maybe I could leverage some of the existing patterns. There was also the question of whether the selections should be made in a modal or in a panel that slides out. The sliding panel is a common pattern in our product but one we rely on heavily and are trying to move away from.
Linking options
Panel options
Concept Testing
Because there were a few different directions we could take this project I wanted to get user feedback as soon as possible. We spoke with the Director of Distance Education at Lawson State to get initial thoughts and feedback on our direction. She loved what we were doing and knew that her instructors would be excited too. The feedback she provided helped to confirm our assumption that instructors would prefer to have the link functionality combined into one button.
Iteration
After reviewing the work and feedback with dev and PM, the team felt comfortable moving forward with these designs. I made some iterations and prepped it for usability testing. There was still some functionality I needed to figure out but wanted to get more user feedback before digging in too deeply.
Usability Testing
We knew we wanted to gather feedback from our users before moving forward. Since we were already planning to perform usability testing with the rich text editor, we decided it make the most sense for these to be tested together. It was important to see how people flowed from one tool to the next, and see if they were able to easily find what they were looking for. I created a usability testing research plan to outline my objectives, goals and procedures and then developed a facilitator guide for our unmoderated research sessions on Usertesting.com.
To see more about this usability test, visit the Rich Text Editor project.
Next Steps
Based on the feedback received in usability testing, I felt comfortable moving forward with the prototypes I tested. I built out two detailed designs covering the different options users could have available to them when inserting a course link. These designs will be discussed with PM and dev to determine what we want to include in the first milestone.
