» » Membuat Aplikasi Mobile Learning: Opening

Membuat Aplikasi Mobile Learning: Opening

posted in: Tutorial | 0

Bekerja dengan Flash Lite

Selain untuk membuat animasi dan multimedia pembelajaran berbasis desktop, Flash juga mampu membuat multimedia pembelajaran berbasis mobile atau yang sering disebut mobile learning (M-Learning). Flashlite adalah fasilitas yang khusus disediakan oleh program Flash untuk membuat M-Learning tersebut. Kita juga bisa membuat animasi, memasukkan gambar, suara, ataupun video. Untuk menjalankannya di HP ada yang bisa langsung plug and play, tetapi ada juga beberapa jenis HP yang membutuhkan software pendukung untuk memainkan flashlite, yakni Flashlite Player. Dengan menggunakan M-Learning, belajar bisa dilakukan di manapun dan kapanpun. Berikut adalah gambar beberapa tipe HP yang tersedia di dalam Macromedia Flash 8 untuk menjalankan preview project dari Flashlite :

pilih tipe device

Project yang akan kita buat kali ini ditujukan untuk pembelajaran. Buka program Macromedia Flash 8 Professional terlebih dahulu. Dari tampilan awal yang ada plih bagian Create From Template > klik Global Phones.

pilih global phoneAkan muncul kotak dialog New from Template > pilih Flash Lite 1-1- Symbian Series 60 > OK.

pilih template

Secara otomatis akan tersedia area kerja (Stage) yang berukuran 176 x 208 pixel dengan dua layer yang sudah tersedia. Tampilan tersebut adalah tampilan default Flash Lite yang digunakan.

layer default flashlite

tampilan panel properties stage

Membuat Opening Aplikasi Mobile Learning

  1. Setelah membuat dokumen baru, ganti nama layer Content menjadi isi
    ganti nama layer content
  2. Masukkan gambar dengan cara pilih File > Import > Import to Stage
    import to stage
  3. Cari dan tentukan gambar lalu klik Open
    cari gambar yang akan diimpor
  4. Atur posisi dan ukuran gambar sesuai keinginan dengan Free Transform Tools. Gunakan kombinasi klik drag mouse dan tombol Shift secara bersamaan agar lebar dan panjang gambar terskala bersamaan.
    penggunaan free transform
  5. Klik kanan pada gambar lalu pilih Convert to Symbol
    convert to symbol
  6. Ganti nama sesuai keinginan, pilih Movie clip. Tempatkan Registration Point di tengah akhiri dengan OK.
    registration point
  7. Klik dua kali gambar yang sudah menjadi Movie clip atau bisa juga melalui Edit > Edit in Place
  8. Kita akan menganimasikan gambar secara Zoom In. Terlebih dahulu, klik kanan gambar > Convert to Symbol > pilih Type Graphic dan Registration di tengah. Klik dua kali di gambar sehingga akan masuk pada bagian pengeditan Graphic.
    masuk ke pengeditan graphic
  9. Tambahkan layer di atas Layer 1 yang nantinya akan kita isi teks.
    tambahkan layer teks
  10. Kembali ke Movie clip Logo kemudian klik kanan frame ke-10 lalu pilih Insert Keyframe.
    masukkan keyframe
  11. Klik frame 1, lalu perkecil ukuran gambar sehingga skalanya menjadi 0% dengan Free Transform Tool. Kemudian, perhatikan
    bagian Tween pada jendela Properties. Ubah pilihan None menjadi Motion. Lakukan tes animasi sementara dengan Ctrl + Enter atau melalui menu Control > Test Movie.
    tambahkan keyframe di frame kesepuluh

    membuat motion
    Membuat motion
  12. Berikut tampilan timeline setelah diberi Motion.
    tampilan timeline setelah diberi motion
  13. Agar animasi gambar tidak berjalan terus, tambahkan action berikut di keyframe 10 dengan klik kanan keyframe 10 > Action. Perhatikan pada panel sebelah kiri jendela Action. Pilih Global Function > Timeline Control > klik dua kali stop sehingga otomatis actionscript akan muncul di bagian kanan.
    menambahkan script stop
  14. Kembali ke Scene > tambahkan teks di Layer isi sebagai pertanda tombol apa yang harus diklik user untuk menuju ke menu utama. Di sini dicontohkan kita harus menekan tombol Enter/Select (tombol tengah) untuk menuju menu utama.
    kembali ke scenetambahkan teks di layer isitombol enter di tengah
  15. Kita akan membuat 3 buah menu utama yakni Flash Dasar, Flash Lite, dan Evaluasi. Untuk menge-link-kan menu-menu tersebut, kita akan menggunakan label frame. Sebelumnya, blok frame ke-25 dari seluruh layer > klik kanan pilih Insert Frame.
    insert frame di 25

Nah, itu tadi cara pembuatan opening sebagai awal untuk pengembangan aplikasi mobile learning. Jika ada pertanyaan, bisa langsung ninggalin komentar yes 😀

Muhammad Faizin
Follow Faizin:

Writer and Developer

Dulu suka menulis kode dan sejenisnya sampe malem, sekarang juga masih. Kesukaan pada menulis cerita sedikit demi sedikit terpupuk, apalagi sebagai mantan anak sekolahan dengan cita-cita kuliah di luar negeri.