Articulate Storyline merupakan perangkat lunak yang menggabungkan teks, gambar, video, animasi dan suara sehingga dapat memberikan bentuk penyajian secara visual yang menarik, sering disebut dengan multimedia authoring tools yang berfungsi untuk membuat aplikasi multimedia interaktif dengan konten berupa teks, gambar, grafik, suara, video bahkan animasi dan simulasi, Hasil publikasi berupa media berbasis web (html5) atau application file (.exe) serta strom pada LMS yang dapat dijalankan pada berbagai perangkat seperti laptop, tablet dan smartphone.
Aplikasi ini memungkinkan pendidik untuk dapat merealisasikan kreativitasnya ke level yang lebih tinggi dan dengan mudahn memvisualisasikan cerita yang dibawakannya ke dalam bentuk storyline. Pada kesempatan ini akan dibahas tentang penggunaan aplikasi Acculate Storyline 3 (AC3) yang dapat diunduh di https://access.articulate.com/perpetual/downloads atau https://access.articulate.com/support/article/How-to-Install-Articulate-Storyline-3 kemudian install sesuai panduannya.
Setelah terinstall langkah berikutnya adalah membuat MPI, yang meliputi 3 tahapan, yaitu :
- Pra Produksi, meliputi :
- Menentukan materi, tujuan pembelajaran serta perangkat atau sumber pembelajaran yang dibutuhkan
- Membuat Aset MPI bisa audio, video, gambar, animasi, grafik, game, PDF, PPT, dll
- Membuat storyboard
- Produksi, langkahnya sebagai berikut :
- Buka aplikasi Articulate Storyline 3, buat projek baru dan beri nama projeknya, Atur slide ukuran 1280 x 720 landscape,
- Buat slide awal dengan bumper video, dilanjutkan slide berikutnya tampilan awal MPI atau halaman login
- Buat slide menu, yang berisi pilihan menu MPI
- Buat slide Tujuan pembelajaran, berisi identitas mapel, capaian pembelajaran, tujuan pembelajaran dan indikatornya
- Buat slide Panduan, berisi informasi mengenai cara penggunaan MPI dan fungsi tombol navigasi
- Buat slide Pengembang, berisi informasi pembuat dan sumber belajar atau referensi yang digunakan
- Buat slide Materi, berisi uraian materi
- Buat slide Asesmen, berisi asesmen diagnostik, sumatif/formatif, refleksi
- Lakukan koneksi antar slide dengan menghubungkan antar slide melalui tombol navigasi atau interaktifitas yang meliputi : trigger, layer dan states
- Preview untuk melihat hasilnya, jika sudah sesuai lakukan publish dan save
- Pasca Produksi, meliputi :
- Publish MPI, ada 3 pilihan, yaitu :
- Web berbasis html5
- Word
- LMS berbasis SCORM
- Publikasi MPI, dapat dilakukan 2 cara, yaitu :
- Online, dengan menyimpan di hosting berbayar atau yang gratis, seperti : drv.tw, github.io, itch.io
- Offline, membuat CD/DVD MPI dengan cara memburning file html MPI kedalam CD/DVD
- Publish MPI, ada 3 pilihan, yaitu :
TUTORIAL
- Gunakan template MPI yang sudah disediakan untuk latihan, download Aset MPI dan template MPI
- Pengaturan slide, atur ukuran slide 1280 x 720, landscape only, dan hilangkan centang pada tombol navigasi
- Pengaturan video bumper, buat slide bumper in dengan insert file video bumper in, kemudian tambahkan shape sampai menutupi area video dan atur transparen 100%, tujuannya agar kalau diklik diarea video tidak berhenti atau paly terus, trigernya :
- action : jump to slide
- slide : next slide
- when : timeline ends
- object : 1.1 bumper in
- Pengaturan login, buat slide menu, insert gambar login, text entry, start, background dan aset yang dibutuhkan, kemudian setting trigernya, sbb :
- action : jump to slide
- slide : next slide
- when : user clicks
- object : picture 3
- on conditions : TextEntry!=Not equal to AND TextEntry1!=Not equal to
- Pengaturan efek hover, sebagai contoh pada tombol start, klik states, klik edit states, klik duplicate, kemudian rubah ukurannya dan ganti nama menjadi mulai, kemudian setting trigernya, sbb :
- action : change state of
- on object : picture 3
- on state : mulai
- when : mouse hovers over
- object : picture 3
- Pengaturan menu, buat layer menu tambahan ditiap slide, insert ikon menu, buat layer baru pada sidebar dengan nama menu1, insert shape, text menu, insert shape dan beri nama sesuai slide tujuan, insert ikon close, kemudian setting triggernya, sbb :
- Tombol menu, triggernya sbb :
- action : show layer
- layer : menu1
- when : user clicks
- object : picture 2
- Tombol close, triggernya sbb :
- action : hide layer
- layer : menu1
- when : user clicks
- object : picture 1
- Tombol pilihan menu, triggernya sbb :
- action : jump to slide
- slide : sesuaikan dengan slide tujuan
- when : user clicks
- object : rectangle 2
- Tombol menu, triggernya sbb :
- Pengaturan tampilan nama dan kelas pada tiap slide, insert gambar untuk penulisan nama, insert text box dan isikan sebagi berikut : Selamat Belajar %TextEntry% – %TextEntry1%
- Pengaturan tombol navigasi, insert tombol navigasi yang dibutuhkan kemudian buat efek hover, kemudian setting trigernya, sbb :
- Close untuk mengakhiri program menuju slide terima kasih, trigernya sbb :
- action : jump to slide
- slide : 1.13 terima kasih
- when : user clicks
- object : picture 10
- Home untuk kembali ke slide menu, trigernya sbb :
- action : jump to slide
- slide : 1.3 menu
- when : user clicks
- object : picture 4
- Next, untuk menuju slide berikutnya, trigernya sbb :
- action : jump to slide
- slide : 1.6 materi 2
- when : user clicks
- object : picture 6
- Previous, untuk menuju slide sebelumnya, trigernya sbb :
- action : jump to slide
- slide : 1.5 materi 1
- when : user clicks
- object : picture 4
- Mute, untuk menghentikan musik, trigernya sbb :
- action : pause media
- media : audio 1 – intro.mp3
- when : user clicks
- object : picture 11
- Speaker, untuk menghidupkan musik, trigernya sbb :
- action : play media
- media : audio 1 – intro.mp3
- when : user clicks
- object : picture 12
- Close untuk mengakhiri program menuju slide terima kasih, trigernya sbb :
- Pengaturan insert, meliputi :
- Media : Character, Picture, Shape, Caption, Video, Audio, Web Object, untuk memasukan media disarankan dalam bentuk embed, misalnya memasukan video youtube langkahnya sbb :
- buka video yang mau dipakai diyoutube, klik share pilih embed, klik copy
- klik insert, pilih video, klik insert video from website, paste embed dari youtube
- atur ukuran layarnya sesuai dengan keinginan, kemudian klik publish
- Text : Text Box, Tables, Simbol, Reference, Hyperlink
- Interactive Object : Button, Slider, Dial, Hotspot, Input, Marker, Trigger, Scrolling Panel, Mouse
- Media : Character, Picture, Shape, Caption, Video, Audio, Web Object, untuk memasukan media disarankan dalam bentuk embed, misalnya memasukan video youtube langkahnya sbb :
- Penmbuatan Question Bank, klik menu slides, pilih question bank dan klik create question bank dan beri nama Bank Soal Coba, kemudian klik OK. ada 3 cara membuat soal, yaitu :
- Grade Question terdiri dari 11 jenis soal
- Survey Question terdiri dari 9 jenis survey
- Freeform Question, terdiri dari 5 jenis soal
- Pengaturan Quiz, buat scene baru,
- klik question banks, pilih new drwa from question banks,kemudian pilih bank soal yang mau digunakan dan centang draw question randomly, kemudian klik insert.
- klik slides, pilih result, pilih slide type yang sesuai, kemudian klik insert slide,
- klik design, tambahkan tombol :
- Print Button, dan setting trigernya sbb :
- action : print result, kemudian centang prompt the user for their name before printing
- results : slide result
- when : user clicks
- objects : button 2
- Review Button, dan setting trigernya sbb :
- action : review result, kemudian centang show corect/incorect responses when reviewing
- results : review result
- when : user clicks
- objects : button 1
- Retry Button, dan setting trigernya sbb :
- action : reset result,
- results : slide result
- when : user clicks
- objects : button 3
- Print Button, dan setting trigernya sbb :
PUBLISH MPI
- GitHub, dapat dijadikan hosting gratis untuk menjalankan file html5 atau MPI secara online. langkah-langkahnya sebagai berikut :
- Siapkan file MPI. “Publish” — “Web”
- Kunjungi https://github.com/ jika belum punya akun silahkan buat dulu
- Setelah berhasil login silahkan menuju menu “New Repository”
- Masukan Name Repository, bisa diisi sesuai judul MPI Anda — “Create repository”
- Selanjutnya akan terbuka tab menu “Code” cari menu “uploading an existing file”
- Agar file-file MPI satu folder dapat terupload sekigus Anda perlu membagi menjadi dua jendela untuk file explorer dan untuk browser. Nanti tinggal select semua (CTRL+A) kemudian drag Tarik tahan geser ke bagian halaman GitHub
- Jika sudah selesai proses upload, “Commit changes”
- Agar bisa tampil sebagai halaman website MPI perlu mengubah nama file “story.html” menjadi “index.html” , dengan cara buka file “Story.html” — pilih menu “edit icon gambar pensil”
- Anda hanya perlu mengganti “Story.html” manjadi “index.html” —- “Commit changes”
- File berhasil terupload, namun MPI belum langsung dapat dibuka. Lanjut ke menu “Settings” — “Pages”
- Pada bagian Buid and deployment source: “Deploy form a branch”, Branch: “Main” — “Save”
- tunggu beberapa saat dan lakukan refresh hingga muncul tulisan keterangan Your site is live at https://xxxxxxx.github.io/xxxxxxx/
- copy linknya dan bagikan
- itch.io, dapat dijadikan hosting gratis untuk menjalankan file html5 atau MPI secara online. langkah-langkahnya sebagai berikut :
- Siapkan file MPI. “Publish” — “Web”, rubah nama file “story.html” menjadi “index.html”, kemudian dikompres dalam zip
- Kunjungi https://itch.io/ jika belum punya akun silahkan buat dulu
- Setelah berhasil login silahkan menuju menu “create new project”
- tuliskan nama projek, Classification = pilih games, Kind of project = pilih HTML, Uploads files + pilih file mpi yang sudah di kompres dalam bentuk zip, embed option = isi 1280 x 720, Visibility & access = pilih public
- Kemudian klik save and view page, klik go it dan klik run game
- copy linknya dan bagikan
AKSI NYATA