2016

UX/ UI project to improve student outcomes with drag and drop activities

 

For this project, our team was charged with improving student outcomes by evaluating the ease of use of our authoring tools. To accomplish this, we first sought out alignment with our development teams. We connected with the lead in authoring tool development and pulled usage data to prioritize our work on the most frequently used widgets.

Heuristic evaluation

Our team researched existing authored content across current disciplines pulling as many use cases of authored content as possible to understand the full scope of what students and teachers would anticipate.


Using Jakob Nielsen’s 10 usability heuristics for UI design, we had multiple reviewers evaluate a collection of four artifacts. In addition to this usability inspection method, we also pulled in experts to review for accessibility/ WCAG 2.0 compliance, academic integrity, brand alignment, and visual design, as well as instructional design.

 

Targeted user scenario to design against

As a student assigned a drag and drop activity, there is no clear style differentiation between the instruction line and the drag objects to indicate that that text is interactive, causing user fatigue and confusion.

Interactive prototypes

The designers created iterations of the new solution across multiple content sets. They implemented the new concept with examples that were art based instead of text, contained multiple drag objects per drop zone, content with style constraints around the drop zone that were inconsistent with the proposition.

The design team found existing web conventions and studies on primary and secondary actions from LukeW that solidified the new button alignment.