Download Sertifikat Ketuntasan Belajar pada Articulate Storyline 3

Certificate of Complation ( Sertifikat Ketuntasan Belajar) pada umumnya menjadi hal yang paling ditunggu oleh siswa kita setelah mengakhiri pembelajarannya dengan menyelesaikan tes uji kompetensi atau quiz. 

Kita dapat membuat sebuah sertifikat ketuntasan belajar untuk siswa kita setelah menyelesaikan quiz diakhir pembelajaran dengan menggunaan media pembelajaran berbasis Articulate Storyline 3. Sertifikat ketuntasan belajar ini dapat dibuat pada sebuah slide setelah siswa kita mendapatkan nilai quiz diatas KKM yang kita tentukan sebelumnya pada saat kita membuat sebuah quiz. Nah agar media pembelajaran kita terlihat lebih interaktif (dan seoalah-olah canggih πŸ˜‹), maka kita dapat memfasilitasi siswa kita untuk mendownload sertifikat ketuntasan belajar nya, sebagai bukti kalo siswa kita sudah tuntas belajar dengan mempelajari media pembelajaran yang kita buat.  Selanjutnya siswa kita tinggal mencentak/print sertifikat ketuntasan belajarnya, sebagai bukti telah tuntas belajar. Menarik kanπŸ˜‰

Berikut cara membuat fitur Download Sertifikat Ketuntasan Belajar pada Articulate Storyline 3, simak dengan baik yaaa....😊

Membuat Folder Certificate_File
Yang anda lakukan pertamakali adalah membuat satu folder namakan saja "Certificate_File" yang berisi file folder pdfmake dan file certificate.html yang dapat didwonload disini  Seperti pada gambar berikut in


Anda dapat mengganti background sesuai dengan keinginan anda, dengan cara mengedit script file certificate.html dengan text editor seperti notepad++. File background yang akan diganti harus berstandar images encoded as base64 strings, anda dapat mengconvert standar gambar/image backgruondnya ke https://www.base64-image.de/ agar menjadi file image standar encoded as  base64 strings.
Selain itu teks pada sertifikat ketuntasan belajar juga dapat anda edit sesuai dengan kebutuhan dengan cara mengedit script html seperti cara tersebut diatas. Perhatikan gambar berikut ini :

(Perhatikan contoh gambar tersebut, script yang distabilo yang dapat anda ganti sesuai dengan kebutuhan, dalam contoh tersebut yang dapat diganti adalah backgorund, certificate text dan project title)

Membuat Variabel Project Title
Pada disain sertifikat ketuntasan belajar terdapat identitas nama coursenya yang diberi nama variabel "projectTitle". Cara membuatnya adlah tambahkan variabel dengan klik tombol "X" yaitu tombol "manage project variabels" seperti pada gambar berikut ini :



Kemudian klik tanda "+" dan buat sebuah variabel dengan nama "projectTitle" dengan default value "The Eye as an Optical Instrument Course" seperti pada gambar berikut ini :


Anda dapat mengganti default value dari variabel projectYitle sesuai dengan topik course media pembelajaran anda😊


Membuat Slide Sertifikat Ketuntasan Belajar
Membuat Tombol Navigasi ke Slide Sertifikat Ketuntasan Belajar

Buat sebuah slide sertifikat ketuntasan belajar, yang berisi variable username, projectTitle dan DateValue seperti pada gambar berikut ini :


Gambar Slide Sertifikat Ketuntasan Belajar
(Catatan: isi dari sertifikat ketuntasan belajar dapat bervariasi sesaui dengan kebutuhan anda)

Tambahkan Trigger untuk menampilkan data tanggal pada sertifikat ketuntasan belajar dengan cara sebagai berikut :
1. Klik Slide ketuntasan belajar
2. Klik "Create a new trigger"
3. Klik Script dan copas code Java Script tanggal seperti ini
4. Pilih when nya "Timeline Start"


Buat tombol download Sertifikat Ketuntasan Belajar (dalam gambar diatas tombol berwarna hijau) dan berikan trigger code script download sertifikat dari pdfmake
1. klik tombol navigasi download (tombol warna hijau pada gambar diatas)
2. Klik "Create a new trigger"
3. Klik script dengan copas code JavaScript seperti ini 
4. Pilih when nya "User clicks"



Tambahkan WebObject
Pada Slide sertifikat ketuntasan belajar tambahkan sebuah WebObect dengan cara sebagai berikut :
1. Klik insert, pilih webobject
2. Browse folder "Certificate_File >Certificate yang berisi folder pdfmake dan file cdertificate.html
3. Pastikan "Display in Slide" dan "Load web object automatically" dalam tanda aktif (dipilih)
4. Klik "Ok"



Buat Tombol navigasi ke slide sertifikat ketuntasan
Pada Slide result buatlha sebuah tombol navigasi dengan trigger jump to slide yang berisi gambar sertifikat ketuntasan belajar, seperti pada gambar berikut ini :

Gambar Tombol Navigasi ke Slide Sertifikat Ketuntasan Belajar


Publish Project Articulate Storyline Untuk mendapatkan ID WebObject
Publish Project Articulate Storyline, bisa dalam format WEB (html5,html5/flash, flash/html5) atau dalam format EXE (CD) untuk mendapatkan ID Web Object

Cara mendapatkan ID WebObject
Untuk mendapatkan ID WebObject maka Publishlha media anda dan lihat ID WebObject pada folder output story_content/WebObject/5ogrsg2pAqq
Maka ID WebObject adalah "5ogrsg2pAqq"

Edit Folder WebObject
Catat ID WebObject tersebut, kemudian edit folder WebObject yang sudah dibuat dengan menambahkan satu folder dengan nama file sama dengan ID WebObject, kemudian  folder pdfmake dan file certificate.html pindahkan pada folder ID WebObject. Sehingga url WebObject nya menjadi "Certificate_File/ID WebObject/

Edit WebObject pada Articulate Storyline
1. Klik kanan WebObject pada Slide pertama kemudian pilih edit
2. Browse URL WebObject baru, dimana folder pdfmake dan file certificate.html  sudah berada pada folder ID WebObject
3. Klik "Ok"


Publish Project Articulate Storyline, bisa dalam format WEB (html5,html5/flash, flash/html5) atau dalam format EXE (CD), maka ketika siswa anda tuntas dalam menyelesaikan tes uji kompetensi / quiz maka siswa dapat mendownload sertifikat ketuntasan belajar dalam format pdf. πŸ˜ƒ


Bagaimana, mudahkan πŸ˜‰


Selamat mencoba yaaa.....πŸ™

Sumber :









Komentar