Note: You are currently viewing documentation for Moodle 3.11. Up-to-date documentation for the latest stable version of Moodle may be available here: Interactive Content - H5P activity.

Interactive Content - H5P activity: Difference between revisions

From MoodleDocs
(Added Infobox plugin)
(Expanded some activities descriptions)
Line 71: Line 71:
===Activities available for creation===
===Activities available for creation===


* [https://h5p.org/accordion Accordion]
* [https://h5p.org/accordion Accordion] - A free HTML5 based accordion content type allowing users to add accessible wai aria enabled accordions.
[[File:H5P example accordion.png|400px]]
[[File:H5P example accordion.png|400px]]
{{Note| The images pasted inside the text area will not show up in the final activity, only the text will be show.}}
{{Note| The images pasted inside the text area will not show up in the final activity, only the text will be show.}}


* [https://h5p.org/appear.in appear.in] for Chat and Talk
* [https://h5p.org/appear.in appear.in] for Chat and Talk - A free HTML5 based video conference content type allowing authors to set up conference rooms.
[[File:H5P example appear_in.png|400px]]
[[File:H5P example appear_in.png|400px]]


* Audio
* Audio - An easy to use audio player.
[[File:H5P example audio.png|400px]]
[[File:H5P example audio.png|400px]]


* [https://h5p.org/node/6729 Chart]
* [https://h5p.org/node/6729 Chart] - A free HTML5 based chart content type allowing users to create pie charts and bar charts with H5P, to present simple statistical data graphically without creating the artwork manually.
[[File:H5P example chart.png|400px]]
[[File:H5P example chart.png|400px]]


* [https://h5p.org/collage Collage]
* [https://h5p.org/collage Collage] - A free HTML5 based photo collage content type allowing users to set up multiple photos in a custom layout using only a web browser in order to show off their photos in a tasteful way.
[[File:H5P example collage.png|400px]]
[[File:H5P example collage.png|400px]]


* [https://h5p.org/presentation Course presentation]
* [https://h5p.org/presentation Course presentation] - A free HTML5- based presentation content type which allows users to add multiple choice, fill in the blanks, texts and other types of interactions to their presentations using only a web browser in order to make engaging presentations.
[[File:H5P example course presentation.png|400px]]
[[File:H5P example course presentation.png|400px]]


* [https://h5p.org/dialog-cards Dialog Cards]
* [https://h5p.org/dialog-cards Dialog Cards] - A free HTML5 based content type allowing authors to create great language learning resources with H5P.
[[File:H5P example dialog cards.png|400px]]
[[File:H5P example dialog cards.png|400px]]


* [https://h5p.org/documentation-tool Documentation Tool]
* [https://h5p.org/documentation-tool Documentation Tool] - A free HTML5 based content type allowing authors to create guides for structured writing processes with H5P.
[[File:H5P example documentation tool.png|400px]]
[[File:H5P example documentation tool.png|400px]]


* [https://h5p.org/drag-and-drop Drag and Drop]
* [https://h5p.org/drag-and-drop Drag and Drop] - A free HTML5 based drag and drop question type allowing creatives to create many forms of drag and drop using only a web browser in order to make engaging challenges using H5P.
[[File:H5P example drag and drop.png|400px]]
[[File:H5P example drag and drop.png|400px]]


* [https://h5p.org/drag-the-words Drag the Words]
* [https://h5p.org/drag-the-words Drag the Words] - A free HTML5 based question type allowing creatives to create text based challenges where users are to drag words into blanks in sentences. Excellent for language training.
[[File:H5P example drag the words.png|400px]]
[[File:H5P example drag the words.png|400px]]


* [https://h5p.org/fill-in-the-blanks Fill in the Blanks]
* [https://h5p.org/fill-in-the-blanks Fill in the Blanks] - A free HTML5 based question type allowing creatives to create fill in the blanks, also known as cloze tests.
[[File:H5P example fill in the blanks.png|400px]]
[[File:H5P example fill in the blanks.png|400px]]


* [https://h5p.org/image-hotspot-question Find the Hotspot]
* [https://h5p.org/image-hotspot-question Find the Hotspot] - A free HTML5 based question type allowing creatives to create an image based test where the learner is to find the correct spot on an image. Use this content type with the H5P plugin to challenge your users.
[[File:H5P example find the hotspot.png|400px]]
[[File:H5P example find the hotspot.png|400px]]


* [https://h5p.org/flashcards Flashcards]
* [https://h5p.org/flashcards Flashcards] - A free HTML5 based content type allowing creatives to create flashcards.
[[File:H5P example flashcards.png|400px]]
[[File:H5P example flashcards.png|400px]]


* Greeting Card
* Greeting Card - To easily create a greeting card.
[[File:H5P example greeting card.png|400px]]
[[File:H5P example greeting card.png|400px]]


* [https://h5p.org/node/2398 Guess the Answer]
* [https://h5p.org/node/2398 Guess the Answer] - A free HTML5 based content type allowing creatives to create challenges where the user is to guess an answer based on a picture.
[[File:H5P example guess the answer.png|400px]]
[[File:H5P example guess the answer.png|400px]]


* [https://h5p.org/iframe-embedder Iframe Embedder]
* [https://h5p.org/iframe-embedder Iframe Embedder] - The Iframe embedder makes it easy to make an H5P of already existing JavaScript applications.
[[File:H5P example iframe embedder.png|400px]]
[[File:H5P example iframe embedder.png|400px]]


* [https://h5p.org/image-hotspots Image Hotspots]
* [https://h5p.org/image-hotspots Image Hotspots] - A free HTML5 based content type allowing creatives to add hotspots to images. Hotspots may reveal texts, images and videos when clicked.
[[File:H5P example image hotspots.png|400px]]
[[File:H5P example image hotspots.png|400px]]


* [https://h5p.org/interactive-video Interactive Video]
* [https://h5p.org/interactive-video Interactive Video] - An HTML5 based interactive video content type allowing users to add multiple choice and  fill in the blank questions, pop-up text and other types of interactions to their videos using only a web browser. Make your videos more engaging.
[[File:H5P example interactive video.png|400px]]
[[File:H5P example interactive video.png|400px]]


* [https://h5p.org/mark-the-words Mark the Words]
* [https://h5p.org/mark-the-words Mark the Words] - A free HTML5 based question type allowing creatives to create challenges where the user is to mark specific types of verbs in a text.
[[File:H5P example mark the words.png|400px]]
[[File:H5P example mark the words.png|400px]]


* [https://h5p.org/memory-game Memory Game]
* [https://h5p.org/memory-game Memory Game] - A free HTML5-based memory game content type allowing authors to add their own images (and optional text) to a memory game. To play the game, users search for image pairs, which will display a specified text message once a matching pair has been found.
[[File:H5P memory game 001.png|400px]]
[[File:H5P memory game 001.png|400px]]


* [https://h5p.org/multichoice Multiple Choice]
* [https://h5p.org/multichoice Multiple Choice] - A free HTML5 based question type allowing creatives to create challenges where the user is to identify one ore more correct choices.
[[File:H5P example multiple choice.png|400px]]
[[File:H5P example multiple choice.png|400px]]


* [https://h5p.org/question-set Question Set]
* [https://h5p.org/question-set Question Set] - A free HTML5 based content type allowing creatives to create quizzes. Many question types are supported like multiple choice, fill in the blanks, drag the words, mark the words and regular drag and drop.
[[File:H5P example question set..png|400px]]
[[File:H5P example question set..png|400px]]



Revision as of 14:11, 7 August 2016

Highlights

  • H5P gives you access to lots of different interactive content types (see example activities below).
  • H5P allows you to easily share and reuse content.
    • To reuse content, you just download the H5P you would like to edit and make your changes – e.g. translate to a new language or adjust it to a new situation.

Overview

Supercharge your website with H5P

  • H5P makes it easy to create, share and reuse HTML5 content and applications.
  • H5P empowers creatives to create rich and interactive web experiences more efficiently - all you need is a web browser and a web site with an H5P plugin.

Mobile friendly content

  • Publish once, view and interact on all screens.
  • H5P content is responsive and mobile friendly.
  • Users experience the same rich, interactive content on computers, smartphones and tablets alike.

Share rich content

  • H5P enables existing CMSs and LMSs (such as Moodle) to create richer content.
  • With H5P, authors may create and edit interactive videos, presentations, games, advertisements and more.
  • Content may be imported and exported.
    • All that is needed to view or edit H5P content is a web browser.
  • Rich content, applications and content components may be shared on H5P.org.

Free to use

  • H5P is a completely free and open technology, licensed with the MIT license.
  • Demos/downloads, tutorials and documentation is available for users who want to join the community.

Links to examples and downloads

H5P download an activity.png

Compatible Moodle versions

Moodle 2.7 to 3.1

Potential privacy issues

The plugin is set up to automatically download content types and provide anonymous usage data which can be disabled through settings.

Installation

Usage

Display Options

You can enable/disable:

  • Display action bar and frame
  • Download button
  • Copyright button

Uploading versus Creating an activity

H5P upload an activity.png

  • If you choose to 'Upload' an activity, you can choose a (.h5p) file or drag and drop one into the designated area.

H5P upload a previously downloaded h5p activity.png

  • You can easily create an interactive activity with the built-in editor inside the plugin.

H5P create an activity.png

  • If you choose to 'Create' an activity, the Editor drop-down list will let you choose any one of the following:

Activities available for creation

  • Accordion - A free HTML5 based accordion content type allowing users to add accessible wai aria enabled accordions.

H5P example accordion.png

Note: The images pasted inside the text area will not show up in the final activity, only the text will be show.


  • appear.in for Chat and Talk - A free HTML5 based video conference content type allowing authors to set up conference rooms.

H5P example appear in.png

  • Audio - An easy to use audio player.

H5P example audio.png

  • Chart - A free HTML5 based chart content type allowing users to create pie charts and bar charts with H5P, to present simple statistical data graphically without creating the artwork manually.

H5P example chart.png

  • Collage - A free HTML5 based photo collage content type allowing users to set up multiple photos in a custom layout using only a web browser in order to show off their photos in a tasteful way.

H5P example collage.png

  • Course presentation - A free HTML5- based presentation content type which allows users to add multiple choice, fill in the blanks, texts and other types of interactions to their presentations using only a web browser in order to make engaging presentations.

H5P example course presentation.png

  • Dialog Cards - A free HTML5 based content type allowing authors to create great language learning resources with H5P.

H5P example dialog cards.png

  • Documentation Tool - A free HTML5 based content type allowing authors to create guides for structured writing processes with H5P.

H5P example documentation tool.png

  • Drag and Drop - A free HTML5 based drag and drop question type allowing creatives to create many forms of drag and drop using only a web browser in order to make engaging challenges using H5P.

H5P example drag and drop.png

  • Drag the Words - A free HTML5 based question type allowing creatives to create text based challenges where users are to drag words into blanks in sentences. Excellent for language training.

H5P example drag the words.png

  • Fill in the Blanks - A free HTML5 based question type allowing creatives to create fill in the blanks, also known as cloze tests.

H5P example fill in the blanks.png

  • Find the Hotspot - A free HTML5 based question type allowing creatives to create an image based test where the learner is to find the correct spot on an image. Use this content type with the H5P plugin to challenge your users.

H5P example find the hotspot.png

  • Flashcards - A free HTML5 based content type allowing creatives to create flashcards.

H5P example flashcards.png

  • Greeting Card - To easily create a greeting card.

H5P example greeting card.png

  • Guess the Answer - A free HTML5 based content type allowing creatives to create challenges where the user is to guess an answer based on a picture.

H5P example guess the answer.png

  • Iframe Embedder - The Iframe embedder makes it easy to make an H5P of already existing JavaScript applications.

H5P example iframe embedder.png

  • Image Hotspots - A free HTML5 based content type allowing creatives to add hotspots to images. Hotspots may reveal texts, images and videos when clicked.

H5P example image hotspots.png

  • Interactive Video - An HTML5 based interactive video content type allowing users to add multiple choice and fill in the blank questions, pop-up text and other types of interactions to their videos using only a web browser. Make your videos more engaging.

H5P example interactive video.png

  • Mark the Words - A free HTML5 based question type allowing creatives to create challenges where the user is to mark specific types of verbs in a text.

H5P example mark the words.png

  • Memory Game - A free HTML5-based memory game content type allowing authors to add their own images (and optional text) to a memory game. To play the game, users search for image pairs, which will display a specified text message once a matching pair has been found.

H5P memory game 001.png

  • Multiple Choice - A free HTML5 based question type allowing creatives to create challenges where the user is to identify one ore more correct choices.

H5P example multiple choice.png

  • Question Set - A free HTML5 based content type allowing creatives to create quizzes. Many question types are supported like multiple choice, fill in the blanks, drag the words, mark the words and regular drag and drop.

H5P example question set..png

H5P example single choice set..png

H5P example summary..png

H5P example timeline..png

H5P example twitter user feed..png

See also