Blackboard Inline Interactions
Add a Feature Case Study
Blackboard is a Learning Management System that is used at many institutions. A popular request within the Blackboard community is to add a feature that allows instructors to ask questions inline with the material to gain spontaneous insight from learners.
Currently, the only way to get this type of data is to have the students email the instructor in an online course, or for the instructors to set up a survey. The ability to add interaction inline would help streamline the student experience because when instructors are asking for feedback they can get immediate answers through quick questions or metacognition exercises.
This design used the existing Blackboard Learn 9.1 layout. I designed the inline interactions and worked with users to test the prototype to make data informed changes to the design.
CLIENT
Based on Anthology Blackboard’s Parent company. This project was done with no affiliation to the company
ROLE
Product Design + UI
TIMELINE
8 weeks, 10 hours/week
PLATFORM
Desktop web LMS version
DELIVERABLES
User Interviews
Product Flow
Sketches
Mid-Fi Wireframes
Prototype
Usability Testing
High Fidelity Prototype
Research
I began by interviewing different Blackboard users to start thinking about what types of interaction they were looking for and to better understand how this inline feedback feature would be used by instructors and students.
After the interviews, I used Figjam to create affinity maps that grouped comments and preferences. ‘Ideas’ is one of the groupings that focused on types of interactions that instructors want in Blackboard.
I used the user data and placed them into a feature matrix to help determine what ideas to include in the initial testing of the inline feature.
After this was done, I looked at direct and indirect competitors to Blackboard to study the types of interactions inside these LMS. I then created a research ramp-up deliverable that helped outline the competitors and brought into focus the types of users.
All of the research lead me to the creation of a Primary Persona of John Emills.
Affinity Map
User Interviews: Ideas Grouping
Feature Matrix
Research Ramp-Up
Primary Persona
Defining the Product
With the research completed, my next step was determine the overall design of the interactions and to decide how they will be implemented in Blackboard. I created storyboard to help visualize the 3 distinct stages of getting feedback from students using the current survey in Blackboard:
1. Instructors create a survey
2. Students take the survey
3. Instructors gather feedback
This helped to illustrate that students have to interact with 8 unique pages to take a survey! My goal is to make sure students don’t have to leave the landing page when submitting their feedback. This led me to think about a better solution through inline interactions that would only require 3 steps (instructor creates inline interactions, students complete inline interactions, instructor views the interactions).
Using what I learned, I created the Task Flow based on how an instructor would add an interaction to a Blackboard item. The expanded the task flow to create the user flow and included guidelines on how students can submit the feedback and how instructors would view those results.
Storyboard: 3 Stages of Blackboard Interaction
Task Flow
User Flow
Design
I created sketches to understand how the inline interaction would work, and to study the instructor experience, the student experience, and the overall flow. I then created a Mid-Fi wireframe that incorporated screenshots from Blackboard and recreated some Blackboard elements in Figma. This was the backbone for the prototype to help determine issues before creating the Hi-Fi Prototype. Additionally, I created a style tile to maintain a consistent design.
Sketches
Mid-Fi Wireframe: Instructor Creating Interaction
Mid-Fi Wireframe: Student Completing Questions
Mid-Fi Wireframe: Instructor Viewing Results
Style Tile
Usability Testing
I ran 5 users through the prototype that I created from the Mid-Fi wireframes. 3 of the users were instructors and 2 were students. The users went through the prototype either in-person or remotely via a Microsoft teams virtual call. After the interviews, I added their comments to a Figjam board and created an affinity map. I then took the ideas grouping and categorized the ideas based on which ones would be easier or harder in the implementation process.
Hi-Fi Wireframes and Prototype
I created the Hi-Fi prototype that began from the Mid-Fi wireframes which included Blackboard screenshots. I then took time to recreate all of the Blackboard components in Figma to eliminate the screenshots. I simultaneously created the Blackboard components and integrated the changes from the user testing.
Hi-Fi Wireframes: Instructor Creating Interaction
Hi-Fi Wireframes: Student Completing Questions
Hi-Fi Wireframes: Instructor Viewing Results
Final Thoughts
In this project, I discovered that adding a feature to an existing learning management system has a lot of challenges.
Redesigning all of the elements is a great way to see how the components interact, but having to redesign all of the elements often results in some minor mistakes.
Since I am not affiliated with Blackboard, it made me see how easily scope creep can happen. It is enjoyable to ideate on the many different possibilities, so it can be challenging to limit the boundaries of the design.
I also realized that being outside of an organization when trying to add a new feature can be complicated because the internal user data cannot be accessed. In addition, organizations have a large user base that can be tapped for user research.
In conclusion, this is a good first draft of the feature but having the data that is available to the organization would help streamline the design process and also help with design validation.