You need to enable javaScript to run this app.

Kegiatan Selasa, 7 jan 2024 : Mengajar Kelas XIDKV2 : Membuat Multimedia Pembelajaran Interaktif dengan Adobe Animate: Scene Opening

Kegiatan Selasa, 7 jan 2024 : Mengajar Kelas XIDKV2 : Membuat Multimedia Pembelajaran Interaktif dengan Adobe Animate: Scene Opening

 

Bahan Ajar: Membuat Multimedia Pembelajaran Interaktif Berisi Scene Opening

Kelas XIDKV2 => Jam ke 3 - 7 (08.30 - 11.15)

Tujuan Pembelajaran:

  1. Memahami dasar penggunaan Adobe Animate dengan ActionScript 3.0.
  2. Membuat scene opening pada multimedia pembelajaran interaktif.
  3. Menggunakan ActionScript 3.0 untuk navigasi antar scene.

I. Pengenalan Adobe Animate dengan ActionScript 3.0

Adobe Animate menyediakan ActionScript 3.0 untuk menambahkan interaktivitas ke proyek animasi.
Scene Opening adalah halaman awal yang berisi animasi pembuka, seperti judul, logo, atau tombol navigasi ke konten utama.

Keunggulan ActionScript 3.0:

  1. Mendukung logika pemrograman untuk interaksi kompleks.
  2. Memungkinkan navigasi antar scene, kontrol audio, dan animasi.

II. Membuat Proyek Baru

  1. Buka Adobe Animate

    • Pilih File > New.
    • Pilih ActionScript 3.0 dengan ukuran stage Full HD : 1920 x 1080 px.
  2. Atur Frame Rate:

    • Pada Properties Panel, set Frame Rate ke 24 fps.
  3. Tambahkan Scene:

    • Pilih Window > Scene untuk membuka panel Scene.
    • Tambahkan dua scene:
      • Scene 1: "Opening" (untuk animasi pembuka).
      • Scene 2: "Main Menu" (untuk konten utama).

III. Membuat Scene Opening

  1. Desain Scene Opening:

    • Tambahkan Teks Judul menggunakan Text Tool (T), misalnya:

      "Multimedia Pembelajaran Interaktif"

      di bawahnya "Dasar-Dasar Desain grafis"

    • Tambahkan Logo atau gambar pendukung (File > Import to Stage).
  2. Animasi Sederhana:

    • Pilih teks atau logo > Convert to Symbol (F8) > Pilih Movie Clip.
    • Tambahkan animasi motion tween:
      • Klik kanan di timeline > Create Motion Tween atau Clasic Tween.
      • Gerakkan objek dari frame awal ke frame tertentu (misal, dari frame 1 ke frame 50).
  3. Tambahkan Tombol Navigasi:

    • Gambar tombol (misal, persegi panjang) > Convert to Symbol (F8) > Pilih Button.
    • Edit tampilan tombol (Up, Over, Down, Hit) dengan klik dua kali tombol di Library.

IV. Menambahkan Navigasi dengan ActionScript 3.0

  1. Beri Instance Name pada Tombol:

    • Pilih tombol di Scene 1.
    • Pada Properties Panel, beri nama instance, misalnya: btn_start.
  2. Tambahkan Script untuk Navigasi:

    • Pilih frame pertama di Scene 1.
    • Buka panel Actions (F9), lalu tambahkan kode berikut:
actionscript
 
// Tombol Navigasi ke Scene 2
btn_start.addEventListener(MouseEvent.CLICK, goToMainMenu);
function goToMainMenu(event:MouseEvent):void {
gotoAndPlay(1, "Main Menu"); }

V. Membuat Scene Main Menu

  1. Desain Main Menu:

    • Tambahkan teks menu (misalnya: "Materi", "Kuis", "Tentang").
    • Tambahkan gambar atau ilustrasi sesuai kebutuhan.
  2. Tambahkan Tombol Menu:

    • Buat tombol untuk setiap menu (seperti langkah pada Scene Opening).
    • Beri instance name pada masing-masing tombol, misalnya: btn_materi, btn_kuis, btn_tentang.
  3. Tambahkan Script untuk Navigasi Antar Konten:

    • Pilih frame pertama di Scene 2.
    • Tambahkan kode berikut di panel Actions:
actionscript
 
// Tombol Materi
btn_materi.addEventListener(MouseEvent.CLICK, openMateri); function openMateri(event:MouseEvent):void
{ trace("Navigasi ke Materi") // Ganti dengan fungsi ke konten materi }
// Tombol Kuis
btn_kuis.addEventListener(MouseEvent.CLICK, openKuis); function openKuis(event:MouseEvent):void
{ trace("Navigasi ke Kuis"); // Ganti dengan fungsi ke konten kuis }
// Tombol Tentang
btn_tentang.addEventListener(MouseEvent.CLICK, openTentang); function openTentang(event:MouseEvent):void
{ trace("Navigasi ke Tentang"); // Ganti dengan fungsi ke konten tentang }

VI. Menguji Proyek

  1. Pilih Control > Test Movie > Test untuk menjalankan proyek.
  2. Pastikan navigasi dari Scene Opening ke Main Menu berjalan dengan benar.

VII. Menyimpan dan Mengekspor Proyek

  1. Simpan proyek dengan format .fla (File > Save As).
  2. Ekspor proyek ke format .EXE untuk digunakan:
    • File > Export > Export Movie > Pilih format Exe atau Win Projector.

VIII. Tugas Mandiri

  1. Buatlah opening Multimedia Pembelajaran Interaktif menggunakan adobe Animate dengan ketentuan sebagai berikut :

    1. Background
    2. Logo sesuai judul MPI
    3. Judul Multimedia Pembelajaran Interaktif
    4. Identitas Mapel dan Pembuat
    5. Animasi
    6. Tombol Start
    7. Tombol Close

    Kirim File Fla dan Exe di halaman Besmart => https://besmart.smkn1pengasih.sch.id 

Bagikan artikel ini:

Beri Komentar

Kang Haki

- Ketua -

Jika kamu tak tahan letihnya dan penatnya belajar, maka sungguh kamu akan menanggung perihnya kebodohan (nasehat imam syafi'i). Kulon Progo, 22…

Berlangganan
Jajak Pendapat

Skill apa yang kalian pengin kuasai selama PKL?

Hasil
Banner