Modul Multimedia Dalam PdPc STEM Abad 21

Kenali H5P

1. Contoh penggunaan plugin H5P pada laman web berasaskan Drupal boleh dilihat seperti
di bawah.

2. Contoh di bawah menggunakan H5P Video Interaktif ke atas video yang telah aktif berada
dalam Youtube.

3. Video akan berhenti dan penonton video perlu menekan [Klik sini untuk Pop Kuiz].
4. Soalan kuiz akan dipaparkan, penonton perlu menjawab soalan sebelum menonton

sambungan video.

Membudayakan Teknologi Digital 145

BAB 7: PENILAIAN DALAM PDPC

Jom H5P : Wordpress tanpa domain

1. Buka dashboard Wordpress melalui backend yang berakhir dengan /wp-admin. dan tekan
[Login].

4

23
5

6

2. Pada menu navigasi, klik [Plugins].
3. Tekan butang [Add] pada menu Configure Plugins.
4. Taipkan H5P dalam kotak carian [Search Plugins].
5. Klik hasil carian [Interactive Content – H5P].

Limitasi:
6. Untuk Wordpress yang dipasang tanpa domain (contoh: namablog.wordpress.com), menu

[Add plugins] tidak boleh dilaksanakan.
7. Kandungan Wordpress perlu diletakkan dalam domain anda sendiri. (contoh: namablog.

edu.my, namablog.com, namablog.net.

146 Modul Multimedia Dalam PdPc STEM Abad 21

Jom H5P : Wordpress tanpa domain

1. Buka dashboard Wordpress melalui backend yang berakhir dengan /wp-admin. dan tekan
[Login].

2. Tekan Plugins [Add New].

3. Tekan butang [Install Now] pada plugin Interactive Content – H5P.

Membudayakan Teknologi Digital 147

BAB 7: PENILAIAN DALAM PDPC

4. Tekan butang [Activate].

5. Setelah mengaktifkan plugin, klik [H5P Content] pada bar navigasi dan klik [Add New].

148 Modul Multimedia Dalam PdPc STEM Abad 21

Jom H5P : Wordpress tanpa domain

6. Taip video sebagai kata kunci dalam carian [content type].
7. Pilih [Interactive Video] dan tekan butang [Use].

8. Terdapat tiga (3) langkah dalam menetapkan kuiz ke atas video Youtube.
9. Masukkan nama video di petak [Enter title here].

Membudayakan Teknologi Digital 149

BAB 7: PENILAIAN DALAM PDPC

Langkah 1:
10. Tampal URL video stem yang telah berada di Youtube.
11. Tekan butang [Insert].

Langkah 2:
12. Terdapat beberapa ikon di bar menu. Untuk modul ini, anda akan diberi contoh bagaimana

kita hendak memapar soalan menggunakan ikon
[Single Choice Set].

13. Tetapkan masa soalan keluar [Display time].
Tandakan [/] pada checkbox Pause video.

150 Modul Multimedia Dalam PdPc STEM Abad 21

Jom H5P : Wordpress tanpa domain
14. Masukkan label: Klik sini untuk papar soalan kuiz.
15. Masukkan soalan (bergantung kepada jenis video anda).

16. Masukkan jawapan kepada petak [Alternative].

17. Jawapan hendaklah dimasukkan ke petak alternatif yang pertama.

18. Secara default, terdapat dua pilihan jawapan. Tekan butang [Add answer] untuk menambah
pilihan jawapan.

Membudayakan Teknologi Digital 151

BAB 7: PENILAIAN DALAM PDPC

19. Tekan butang [Done].

20. Untuk menyimpan video yang telah diperkaya dengan soalan interaktif, tekan butang
[Create].

21. Cipta artikel baharu. Tekan [Add New Post].
22. Masukkan tajuk artikel.
23. Tekan butang [Add H5P].

24. Pilih video yang telah diperkaya dengan H5P. Tekan butang [Insert].

152 Modul Multimedia Dalam PdPc STEM Abad 21

Jom H5P : Wordpress tanpa domain
25. Tag [h5p id=“1”] akan dipapar secara automatik dalam ruangan cipta artikel.
26. Tekan butang [Publish] untuk menyimpan dan menerbitkan artikel.

27. Contoh paparan video Youtube yang diperkaya dengan H5P atas platform Wordpress.

Membudayakan Teknologi Digital 153

BAB 7: PENILAIAN DALAM PDPC

28. Untuk melihat respon penonton, masuk Dashboard Admin, dan klik [H5P Content].
29. Tekan [Results].

30. Pengguna perlu login masuk ke platform Wordpress supaya skor kuiz boleh disimpan dalam
pangkalan data laman web.

154 Modul Multimedia Dalam PdPc STEM Abad 21

Vizia

Vizia
Kenali Vizia

1. Buka url https://vizia.co/ dan tekan [Login].

2. Sekiranya anda belum mencipta akaun Vizia, tekan [Create an account].
3. Atau anda boleh menggunakan akaun Gmail anda untuk login. Tekan

[Sign in with Google].

Membudayakan Teknologi Digital 155

BAB 7: PENILAIAN DALAM PDPC

4. Selepas login, halaman [Add a New Video] akan dipaparkan. Letakkan URL video Youtube
di sini.

5. Salin URL dari Youtube dan tampalkan seperti rajah di atas. Tekan butang [Continue].

6. Paparan selepas video Youtube berjaya dipautkan. Secara default, video ini boleh dilihat
semula dalam [My Videos].

156 Modul Multimedia Dalam PdPc STEM Abad 21

Jom Vizia

Jom Vizia

7. Menu [Add interaction] berada di bawah video secara default. Masa yang ditunjukkan
menunjukkan saat atau minit ke berapa interaksi akan dipaparkan.

8. Terdapat empat (4) jenis interaksi yang disediakan dalam aplikasi Vizia:
• Quiz
• Poll
• Response
• Call-To-Action

9. Pilih saat/minit untuk ditayangkan interaksi (kuiz). Kemudian tekan [Quiz].

Membudayakan Teknologi Digital 157

BAB 7: PENILAIAN DALAM PDPC

10. Taip soalan dan masukkan pilihan jawapan. Tekan butang [Save].

11. Sekiranya soalan tersebut hendak dikemaskini, klik indikator putih berbentuk bulat pada
bar navigasi di bawah ini. Kemudian tekan [Edit].

12. Untuk menghapuskan soalan interaksi, tekan [Delete].

158 Modul Multimedia Dalam PdPc STEM Abad 21

Uji Diri

Uji Diri

13. Untuk melihat contoh soalan (pratonton), sila tekan [Preview]. Video pratonton akan dibuka
melalui tab yang baharu [New tab].

14. Untuk membenam video interaktif dalam blog, laman web atau dashboard/laman VLE Frog,
salin kod HTML dalam kotak [Embed] dan tampalkan ke dalam artikel atau post yang baharu.

15. Sebagai contoh, untuk membenam video ke dalam Wordpress, buka Dashboard Admin dan
cipta artikel baharu [Posts > Add New].

Membudayakan Teknologi Digital 159

BAB 7: PENILAIAN DALAM PDPC

16. Untuk melihat contoh soalan (pratonton), sila tekan [Preview]. Video pratonton akan dibuka
melalui tab yang baharu [New tab].

17. Untuk membenam video interaktif dalam blog, laman web atau dashboard/laman VLE Frog,
salin kod HTML dalam kotak [Embed] dan tampalkan ke dalam artikel atau post yang baharu.

18. Sebagai contoh, untuk membenam video ke dalam blog, buka blogger dan cipta artikel
baharu [Posts > Add New].

19. Pastikan mode HTML telah dipilih.
20. Tampal kod HTML dari Vizia dan tekan [Publish].

160 Modul Multimedia Dalam PdPc STEM Abad 21

Uji Diri

21. Paparan interaktif akan muncul pada minit yang telah ditetapkan.
22. Untuk melihat contoh video di atas, sila imbas kod QR di sebelah.

23. Untuk melihat jawapan (response), login Vizia dan klik [My Videos].

24. Guru boleh melihat respon pelajar berkaitan video yang dilihat.

Membudayakan Teknologi Digital 161









Guru-guru pakar dalam bidang ICT dan STEM telah berkongsi pengalaman mereka cara
menggunakankan aplikasi yang mereka guna semasa dalam PdPc. Gabungan ini telah
menghasilkan beberapa kaedah yang boleh diketengahkan menerusi penggunaan peranti

pintar atau telefon pintar yang digunakan secara meluas.

Modul ini menggabungkan beberapa idea bagaimana guru-guru boleh mencipta
persekitaran pembelajaran yang interaktif, komuniktif dan efektif menerusi penggunaan

ICT dalam dan luar bilik darjah.

Tajuk-tajuk yang sesuai dimuatkan dalam modul ini membantu guru mengoptimumkan
masa PdPc dengan menjimatkan masa penyediaan Bahan Bantu Mengajar.

Selain itu, modul ini telah menekankan penggunaan telefon bimbit Yes Altitude sebagai
peranti yang boleh dimanfaatkan oleh guru untuk melancarkan proses PdPc STEM.

Aplikasi yang digabungkan dalam modul ini juga merupakan aplikasi yang percuma dan
mesra pengguna. Guru diberi kemahiran langkah demi langkah untuk menggunakan setiap

aplikasi yang sarankan.

Sila imbas QR Code di sebelah untuk
menonton himpunan video tutorial

ISBN 978-967-13839-1-9

Kementerian Pendidikan Malaysia
Bahagian Pengurusan Sekolah Berasrama Penuh
dan Sekolah Kecemerlangan
Aras 3, Blok 2251, Jalan Usahawan 1,
63000 Cyberjaya, Selangor Darul Ehsan.