A proposal for an open-source multiuser extension for H5P

The commercial h5p.com service offers several H5P content types that allow students to simultaneously work on the same content and see each others’ actions in real time. This includes these activities:

  • Emoji Cloud
  • Multi Poll
  • Word Cloud
  • The Chase

It’s quite unlikely that these content types will find their way into the open source H5P version soon, even though Joubel have indicated that this might happen in the future. The content types are tied to the h5p.com infrastructure, which is probably quite different from the open-source PHP version. They all also run content-type-specific server side code and there is no generic multiplayer API.

That’s why I’ve decided to draft a system that adds multi-user support to H5P in a generic way and can work in conjunction with the existing open-source implementations of H5P. At the moment, it is still in an early experimental stage and not ready to be used in production. But as changing the interface of the system later will be costly, it makes sense to get feedback at this early stage.

This is what is currently possible (I already have more ideas / plans):

  • The system allows students to interact with the content and their actions are immediately visible to other student and their teacher.
  • Teachers have privileged access and can perform restricted actions (like resetting the state).
  • The system integrates into a standard WordPress H5P plugin installation.
  • Multi-user content types can be installed like regular content types.
  • There is no executable per-content-type executable code on the server. Everything is declarative, so the server cannot be compromised.

All of this is achieved by running a second server side-by-side to the regular WordPress server. I call it the H5P shared user state microservice. It shares the authentication session with WordPress and thus knows who logged-in users are and what permissions they have. Content types can get the endpoint of the shared state microservice through the configuration and initiate a websocket connection to it. They transmit their actions on the state to the server and receive changes by other users.

To get a robust system in a reasonable amount of time the system utilizes a lot of already existing technology:

  • NodeJS and Websockets
  • ShareDB for conflict-free multi-user states
  • action validation with JSON Schema and Json Path
  • a MongoDB inspired query language

For starters, I’ve implemented two content types:

1. A simple voting activity in which students can like or dislike something. All votes are counted and students can only vote once. Teachers (editors in WordPress terms) can reset all votes.

Teacher view of the voting activity

2. A Kahoot-style quiz in which the teachers opens the activity on a projection in the classroom. Students open the activity on their mobile devices. The teachers moves through the quiz for all students. Each answer is scored and there’s a leaderboard with a winner at the end.

These content types are meant to be technical demonstrations of what is possible with the shared state system and are by no means the only thing that can be implemented.

You can access the activities here on this WordPress installation (you need to log in to access them):

The voting activity

The quiz

There are three example users that you can use to log in (the password is the same as the username):

  • teacher1
  • demo1 (= student)
  • demo2 (= student)

Note that there are also a few still open issues:

  • Anonymous (not logged in) users cannot use the content.
  • The state is not persisted but kept in memory on the server.
  • The WordPress H5P plugin doesn’t notify the shared user state microservice of content deletion and updates, so it’s possible that there’s a mismatch between shared user state and content.
  • The system has no support for content type nesting / subcontent.

Now I want to ask the H5P community what they think of the system:

If you are daring, you can also run the system yourself with a simple docker-compose file and add upload the content type packages on your local system.

You can add your thoughts as a comment below, email me directly or via Twitter.

Leave a Reply

Your email address will not be published.