Solving major UX issues in the authoring tool

Submitted by falcon on Thu, 08/15/2019 - 11:27

With funding from Mozilla Open Source Support (MOSS), we have been able to work on two of the most considerable user experience issues in the H5P authoring tool:

  1. Pop-ups displaying inside of pop-ups resulting in multiple scroll bars
  2. The space available for H5P authoring is very limited in some Drupal and Moodle themes

We are very pleased to release solutions to these issues.


Breadcrumb based authoring

We have removed the pop-ups and thus also the internal scrollbars from our two most used content types: Interactive Video and Course Presentation. The pop-ups previously used to edit sub-content have been replaced with a breadcrumb based approach:

This has multiple advantages:
  • Authors can now use the full width of the authoring tool to create content. Previously, more and more space was lost for each pop-up.
  • There are no extra scrollbars. Previously, we had multiple scrollable areas inside each other, making it hard to navigate the authoring tool.
  • Controls for navigating between layers and showing you where you are in the authoring tool is now much more clear.

We have added animations for when you navigate in and out of the layers of the authoring tool to make it more clear what is happening.


Full screen authoring

We have now made it possible to go full-screen when editing any H5P content! This ensures that as long as your screen is large enough, you will have the recommended space available for creating H5P content and any distractions added by your Drupal, Moodle, or WordPress site is hidden allowing you to focus solely on content creation:


In addition to the ability to go full screen with all content types, the MOSS project has funded the full-screen features for the editor for Branching Scenario:

Branching scenario in a full-screen mode

Other content types does not make use of the full width of the screen if you have a large screen. Branching Scenario does, and similar approaches will be used for other content types as well in the future.

We are immensely grateful for Mozilla’s support. Mozilla has been very easy to work with, incredibly supportive and understanding from when we first began the application process and throughout.