Interactive content like never before. With our latest release, you can create H5Ps in a modern, fresh, and more customizable way.
We've updated how H5P looks and feels with our new look and feel, completely revamping the design of our different content types, making the already engaging interactives even more engaging. To learn which content types support the new design, visit this help article: List of content types with the new look and feel.
Organizations now may choose between prebuilt themes or create their own from scratch in a completely painless way in just a few steps. All preestablished themes are WCAG 2.0 AA compliant, ensuring sufficient color contrast and accessibility.
Adjusting color schemes and density is now smooth, giving more flexibility to your H5Ps. Subtle UX improvements, such as new appearances for Submit and Check buttons as well as drag-and-drop animations and larger tap zones, also enhance usability, particularly on mobile devices. To learn more in-depth about these updates, visit this link: Changes in H5P components.
The new look and feel topics
What's new:
Now, within the Organization Settings, as an admin, you will be presented with an entirely new setting called Content look and feel settings.
Visibility
Here, you can enable the new look and decide which user level can view it. Allowing you to test the themes before releasing the changes to the entire organization. Here's what can be done:
- Off – Disabled for all users
- Admins only (you) – Visible only to admins for testing and preview. Can be especially useful when testing Custom CSS.
- Everyone – Visible to all users, including learners
Important: The Visibility settings will only be available for existing organizations and will be set to Off by default. For organizations created after the release, only the new theme will be enabled, being the default theme for everyone.
Theme
You may also choose from our preestablished color schemes (all WCAG 2.0 AA color contrast approved): Daylight (default), Mint, or Sunset. Alternatively, you may create your own custom theme by choosing which elements you wish to be in which color, including buttons, navigation, backgrounds, and answer spaces.
Density
It is also possible to choose the density of the content, meaning how tightly the elements or components within an H5P will be displayed. For best readability, we'll recommend the Wide view.
Please note that some content types with fixed height, such as Course Presentation or Drag and Drop, may not fully reflect density changes.
After saving the settings
Once your theme and density settings are applied, all existing content and supported content types will display with the new theme—including content inside LMSs (Brightspace, Canvas, Moodle, Blackboard, etc.) and content created via Smart Import and Layout Builder.
Your content should look something like this:
We believe that with the new look and feel, content creators will have a wider range of what can be achieved with the tool, as well as make the interactives more engaging for their viewers.
Visual demonstration
Here's a visual demo of what you, as an H5P admin, can expect to see before and after the changes, as well as how to enable the new look and feel:
Here's what your students will see after you enable the new look and feel:
Known limitations
These are the current known limitations:
- Chase and Multipoll remain in the legacy design, and the subcontent will not adopt the new theme in this initial release. Future updates may expand support.
- Branching Scenario and Game Map display subcontent with the new theme, while the container remains in the legacy design. Minor visual differences may appear.
- Density settings do not apply to content types like Course Presentation and Drag and Drop, since they allow for element resizing.
FAQs
Q: Can authors access the new theme settings?
A: No, only admins have access.
Q: When will my users see the new theme?
A: Immediately. Once the theme is set as the default for everyone, any supported H5P opened will display the new look.
Q: Can I opt out of the new theme?
A: Existing customers, created before this release, can deactivate it initially, but it will become the default in the future.
Q: Will this only be available in H5P.com?
A: This will be supported in H5P.com as well as in the OER Hub (with the Daylight theme default), with the plan of enabling this in the Plugins too.
Q: Will I still be able to use Custom CSS?
A: Yes, you can find out more about how this is expected to work here: Custom CSS issues with the new look and feel