Mengenal H5P untuk membuat Pembelajaran Interaktif yang dapat dikolaborasikan dengan LMS

Jika anda berkecimpung di dunia pendidikan dan sering berinteraksi dengan LMS seperti Moodle, maka H5P ini merupakan kerangka yang tepat buat anda untuk membuat pembelajaran yang interaktif yang bisa disematkan dan di upload di LMS, seperti Moodle.

 

{getToc} $title={Table of Contents}



H5P org pembelajaran Interaktif
Situs H5P org di screenshot 28 November 2021 oleh RahmanCyber NET

 

 

Apa itu H5P?

 

H5P ini merupakan "framework/kerangka kerja" untuk kolaborasi konten bebas dan "opensource/sumber terbuka" berbasis JavaScript. H5P ini sebenarnya singkatan dari Paket HTML5 lebih tepatnya (HTML 5 Package, dalam bahasa inggris), dan bertujuan untuk memudahkan semua orang untuk membuat, berbagi, dan menggunakan kembali konten HTML5 interaktif.

 

Anda bisa mengakses banyak template di situs resminya https://h5p.org/ , terdapat banyak sample juga yang dapat memberikan anda pemahaman secara langsung mengenai kerangka pembelajaran. Sehingga anda bisa berinovasi untuk membuat pembelajaran interaktif, sesuai dengan ampuan belajar anda.

 

 

H5P Pertama kali Rilis

 

Menurut situs Wikipedia, ternyata H5P yang telah dirilis pertama kali pada 25 Januari 2013; 8 tahun yang lalu ini telah digunakan oleh 17.000+ situs web. artinya H5P ini sudah cukup populer dikalangan pembelajar.

 

Pada Juni 2018 tim inti mengumumkan bahwa H5P akan didukung secara finansial oleh Mozilla Foundation dalam program MOSS 

 

Kerangka kerja H5P ini terdiri dari editor konten berbasis web, situs web untuk berbagi jenis konten, plugin untuk sistem manajemen konten yang ada, dan format file untuk menggabungkan sumber daya HTML5.



Editor berbasis web secara default dapat menambah dan mengganti file multimedia dan konten tekstual di semua jenis jenis konten dan aplikasi H5P. Selain itu, jenis konten dapat menyediakan widget khusus untuk editor yang memungkinkan segala jenis kemampuan dan pengalaman pengeditan termasuk pengeditan wysiwyg dari seluruh jenis konten.  



H5P.ORG


H5P.org adalah situs komunitas tempat perpustakaan, aplikasi, dan tipe konten H5P dapat dibagikan. Aplikasi dan tipe konten H5P bekerja dengan cara yang sama di semua situs web yang kompatibel dengan H5P.



PLATFORM yang dapat Integrasi dengan H5P


Saat ini ada empat integrasi platform, satu untuk Drupal, WordPress, Tiki, dan Moodle. Kemungkinan juga untuk LMS maupun CMS lain akan dapat menyusul.

 

Integrasi platform mencakup kode H5P generik serta implementasi antarmuka dan kode khusus platform yang diperlukan untuk mengintegrasikan H5P dengan platform. 

 

H5P telah dirancang untuk memiliki minimum kode khusus platform dan minimum kode backend. Sebagian besar kode adalah JavaScript. Tujuannya adalah untuk memudahkan pengintegrasian H5P dengan platform baru. 


Sedangkan untuk Format file terdiri dari file metadata dalam format JSON, sejumlah file perpustakaan yang menyediakan fitur dan desain untuk konten dan folder konten tempat konten tekstual disimpan dalam format JSON dan multimedia disimpan sebagai file atau tautan ke file di situs eksternal 



Contoh - Contoh Project H5P


Di Situs H5P.org anda bisa melihat berbagai sample yang dapat anda lihat - lihat dan jadikan acuan untuk mengkreasikan model pembelajaran sesuai dengan ampuan materi dan mata ajar anda.


Jika anda dosen, maka anda bisa menyesuaikan dengan mata kuliah yang anda ampu, sehingga dari berbagai template dan sample yang disediakan, anda bisa membuat materi ajar yang menarik untuk mahasiswa anda.



example h5p




Template H5P yang paling banyak diminati dan di fitur secara langsung oleh pihak H5P org, adalah 

  1. Interactive Video, Anda bisa Buat video yang diperkaya dengan interaksi 
  2. Course Presentation, Anda bisa Buat presentasi dengan slide interaktif 
  3. Branching Scenario, Anda bisa Buat Skenario Percabangan yang penuh dilema tanda tanya dan pembelajaran mandiri


Masih banyak lagi lainnya bro... 


  •  Accordion Create vertically stacked expandable items
  •  Advent Calendar (beta) Create an advent calendar
  •  Agamotto Create a sequence of images that gradually change
  •  Arithmetic Quiz Create time-based arithmetic quizzes
  •  Audio Recorder Create an audio recording
  •  Chart Quickly generate bar and pie charts
  •  Collage Create a collage of multiple images
  •  Column Column layout for H5P Content
  •  Crossword Create a crossword puzzle
  •  Dialog Cards Create text-based turning cards
  •  Dictation Create a dictation with instant feedback
  •  Documentation Tool Create a form wizard with text export
  •  Drag and Drop Create drag and drop tasks with images
  •  Drag the Words Create text-based drag and drop tasks
  •  Essay Create essay with instant feedback
  •  Fill in the Blanks Create a task with missing words in a text
  •  Find Multiple Hotspots Create many hotspots for users to find
  •  Find the Hotspot Create image hotspot for users to find
  •  Find the words Grid word search game
  •  Flashcards Create stylish and modern flashcards
  •  Guess the Answer Create an image with a question and answer button
  •  Iframe Embedder Embed from a url or a set of files
  •  Image Choice Create a task were the alternatives are images
  •  Image Hotspots Create an image with multiple info hotspots
  •  Image Juxtaposition Create interactive images
  •  Image pairing Drag and drop image matching game
  •  Image Sequencing Place images in the correct order
  •  Image Slider Easily create an Image Slider
  •  Impressive Presentation (ALPHA) Create a slideshow with parallax effects
  •  Interactive Book Create courses, books or tests
  •  KewAr Code Create QR codes for different purposes
  •  Mark the Words Create a task where users highlight words
  •  Memory Game Create the classic image pairing game
  •  Multiple Choice Create flexible multiple choice questions
  •  Personality Quiz Create personality quizzes
  •  Questionnaire Create a questionnaire to receive feedback
  •  Quiz (Question Set) Create a sequence of various question types
  •  Single Choice Set Create questions with one correct answer
  •  Sort the Paragraphs Create a set of paragraphs to be sorted
  •  Speak the Words Answer a question using your voice
  •  Speak the Words Set A series of questions answered by speech
  •  Summary Create tasks with a list of statements
  •  Timeline Create a timeline of events with multimedia
  •  True/False Question Create True/False questions
  •  Virtual Tour (360) Create interactive 360 environments
  •  Interactive Video Create videos enriched with interactions
  •  Course Presentation Create a presentation with interactive slides
  •  Branching Scenario Create dilemmas and self paced learning
  •  Advanced fill the blanks Fill in the missing words





Untuk melihat berbagai contoh dan template h5p, anda bisa pergi kesini



H5P Embeding Konten


Ternyata H5P ketika kita bisa Embed juga di website dengan membuat materi pembelajaran langsung melalui H5P, cuman itu nanti tidak dapat di privat alias konten pembelajarannya akan publik dan dapat di akses oleh semua orang.


Dengan embeding menggunakan iframe... maka kita bisa menyematkannya di Website seperti halnya anda melakukan embed instagram post, facebook post, embed twitter post atau youtube video... :)

 

Embedding H5P

 




Syaratnya tentu anda perlu membuat akun di H5P.org untuk dapat membuat pembelajaran interaktif disana.

 

 

Note: Anda perlu Internet yang baik untuk dapat menjalankan secara lancar, karena saya coba ketika internet buruk, konten tidak tampil/termuat... ya ya ya....




embed h5p

Ini adalah contohnya




Itu saya mengambil source dari Youtube atau tidak Upload Video di situs tersebut, jadi menghubungkan video youtube untuk dijadikan interaktif.


embed h5p

Disana anda juga dapat mengatur ukuran konten yang ditampilkan di website anda.

 

Untuk tampilan option Advancenya berikut ini...


advance h5p embed


Tetapi anda bisa lihat sendiri, saat ini terdapat warning bahwa kemungkinan fitur embed akan ada limitasinya segera... artinya, ya memang lebih aman anda bisa host di server anda sendiri... misal anda berlangganan Hosting Website.






Itu dia sekilas pembahasan tentang H5P yang dapat dimanfaatkan untuk mendukung Pembelajaran Jarak Jauh, dan Interaktif. Sehingga anda bisa membuat dan merancang pembelajaran yang keren, kekinian dan sesuai dengan generasi sekarang ini nih dibawahnya millenial yang susah untuk dapat lepas dari Internet...


Moga dapat bermanfaat, jika ada yang ingin menambahi... silahkan di kolom komentar... ty






F.N.A-RED






Posting Komentar

Untuk posting kode, bisa di parse dulu gan, pake tool parse yang udah disediakan di website ini https://www.rahmancyber.net/p/parse-code.html

agar kodenya tidak hilang... ^_^

Lebih baru Lebih lama

نموذج الاتصال