Creating H5P content

H5P (HTML5 Package) is an open standard for interactive learning content directly in the browser. With it you build content that offers considerably more interaction than classic multiple-choice quizzes — from interactive videos through memory games to virtual 360° tours.

Which H5P types are available

Type	Description	Ideal for
Interactive Video	Videos with embedded quiz questions, hotspots, links	Tutorials with comprehension checks
Course Presentation	Slide-based presentation with interactions	Structured knowledge transfer
Quiz (Question Set)	Multiple question types combined in one quiz	End-of-unit test
Drag and Drop	Match elements via drag and drop	Classification, anatomy, diagrams
Fill in the Blanks	Cloze texts	Vocabulary, technical terms
Memory Game	Memory with card pairs	Term pairs, synonym exercises
Image Hotspots	Images with clickable points	Explaining charts, diagrams
Timeline	Interactive timelines	History or process depictions
Branching Scenario	Branched scenarios with decisions	Role-plays, case studies, soft skills
Virtual Tour (360°)	360-degree walkthroughs	Showing rooms, machines, locations
Accordion	Expandable info blocks	FAQs, structured overviews
Dialog Cards	Flashcards with front and back	Vocabulary, questions with answers

If you're missing a type that the H5P hub offers: your platform manager can install it.

Creating an H5P content item

1. Create a new lesson in your course.
2. Choose lesson type H5P.
3. In the H5P editor, choose the content type (list of available types).
4. Design the content in the visual editor — every field is click-and-type, no code.
5. Save — the lesson is available immediately.

Screenshot to follow

H5P editor with the content-type selection

Example: Interactive Video

One of the most powerful H5P types — great for any kind of explainer video you want to enrich with comprehension checks.

1. Lesson of type H5P → choose content type Interactive Video.
2. Choose a video source:
3. URL (YouTube, Vimeo)
4. upload a file from the media library
5. Insert interactions at the desired points:
6. show a multiple-choice question at a certain second
7. a hotspot to an external link
8. a text overlay with additional information
9. an image overlay
10. a summary quiz at the end
11. Choose options:
12. Does the video pause automatically at an interaction?
13. Can learners skip interactions?
14. Is a total score shown?
15. Preview, adjust, save.

Screenshot to follow

Interactive Video editor with timeline and interaction markers

Example: Branching Scenario

Suitable for soft-skills trainings, role-plays, case studies — learners make decisions that lead to different paths through the content.

1. Lesson of type H5P → choose content type Branching Scenario.
2. Define the start sequence — e.g. a video or text describing the initial situation.
3. Insert decision points — ask a question, offer several answer options.
4. Link a follow-up content to each answer — new text, new video, new decision point.
5. Define endpoints — e.g. with feedback or a reflection on the learning effect.
6. Preview, adjust, save.

Tips from practice

• Open the editor in a separate browser tab — it may take a moment to load on first access.
• Copy H5P content between courses — H5P offers its own "copy" feature in the editor (icon in the toolbar), handy for similar lessons.
• Export as an .h5p file is possible — good for backups or for transferring between platforms.
• For large content (Interactive Video with many overlays, Course Presentation with many slides) saving takes longer — wait for the confirmation message, don't click away in between.
• Test on mobile — many H5P types look different on tablet/phone than on desktop. Check in preview mode.

What learners experience

As soon as the lesson is saved, learners see the H5P content in the same place as a quiz or video. While working on it:

• Progress is saved automatically — learners can leave the content in between and later resume where they left off.
• Results feed into the course grade — quiz score, drag-and-drop correctness etc. contribute to course completion.

Frequently asked questions

My H5P content won't play — the page stays blank. This usually indicates that the connection to the H5P server isn't working at the moment. Reload the page. If that doesn't help, contact your platform manager — they can check the H5P server status.

My Interactive Video doesn't load the right video. For external URLs (YouTube, Vimeo), check whether the video is still public and not restricted (e.g. to certain countries). For file upload from the media library: test the video directly in the library.

Learners say they get stuck in the Branching Scenario. Go through it yourself in preview mode and test all paths. Common pitfalls: an endpoint was forgotten, a path leads to empty content, an answer doesn't branch.

Can I import H5P content from another platform? If it's available as an .h5p file: yes, import it in the H5P editor under Upload. Direct import from the H5P.org hub is currently not supported in the UI, but you can download content from there as .h5p and then upload it.

How hard is H5P compared to classic quizzes? For simple quiz types (multiple choice, cloze) the native lesson types are faster. H5P pays off when you really want interactive things (hotspots in a video, branched scenarios, virtual tours). Plan a little learning time for your first H5P content — after that it goes quicker.