Perkembangan teknologi informasi mendorong perubahan yang besar di berbagai aspek
kehidupan. Dalam ranah pembelajaran di sekolah, terjadi perubahan dan pergeseran
paradigma pendidikan dimana perkembangan pesat dibidang teknologi informasi
ini , mempercepat aliran ilmu pengetahuan yang menembus batas-batas dimensi
ruang, birokrasi, kemapanan, dan waktu. Teknologi informasi dapat menampilkan data
dan mentransfer informasi dengan kecepatan tinggi, menyebabkan ilmu pengetahuan
dapat diakses secara cepat oleh penggunanya. Tentu saja kondisi ini berpengaruh pada
kebiasaan dan budaya pendidikan yang dikelola selama ini.
Perkembangan ilmu pengetahuan dan teknologi ini semakin mendorong upaya-
upaya pembaharuan dalam pemanfaatan hasil-hasil teknologi dalam proses belajar
mengajar. Para guru dituntut agar mampu memakai alat-alat yang dapat disediakan
oleh sekolah, dan tidak tertutup kemungkinan bahwa alat-alat ini sesuai dengan
perkembangan dan tuntutan zaman. Guru sekurang-kurangnya dapat memakai alat
yang murah dan bersahaja tetapi merupakan keharusan dalam upaya mencapai tujuan
pengajaran yang diharapkan. Disamping mampu memakai alat-alat yang tersedia,
guru juga dituntut untuk dapat mengembangkan keterampilan membuat media
pengajaran yang dapat digunakan untuk mengoptimalkan pencapaian tujuan
pembelajaran.
Pembelajaran yaitu perpaduan dari dua aktivitas, yaitu aktivitas mengajar dan aktivitas
belajar. Aktivitas mengajar menyangkut peranan seorang guru dalam konteks
mengupayakan terciptanya jalinan komunikasi harmonis antara pengajar itu sendiri
dengan si belajar. Menurut Sugandi (2000) ciri–ciri dari pembelajaran antara lain:
1. Pembelajaran dilakukan secara sadar dan direncanakan secara sistematis;
2. Pembelajaran dapat menumbuhkan perhatian dan motivasi siswa dalam belajar;
3. Pembelajaran dapat menyediakan bahan belajar yang menarik dan menantang
bagi siswa;
4. Pembelajaran dapat memakai alat bantu belajar yang tepat dan menarik;
5. Pembelajaran dapat menciptakan suasana belajar yang aman dan menyenangkan
bagi siswa;
6. Pembelajaran dapat membuat siswa siap menerima pelajaran baik secara fisik
maupun psikologis.
Dalam pembelajaran komponen terpenting yaitu pendidik dan peserta didik yang selalu
berinteraksi dalam proses belajar mengajar. Dari komponen pelajar meliputi tingkat
perkembangan, tingkat kesiapannya, minatnya, aspirasi dan sebagainya. Dari komponen
pengajar, meliputi tingkat kemampuan, minat, waktu, wibawa, status, dan sebagainya.
Dari komponen interaksi meliputi isi interaksi, apa yang dilakukan pelajar, alat-alat yang
dipakai, metode yang dipergunakan dalam mengajar, sikap belajar yang tumbuh pada
pelajar sebagai hasil interaksi belajar mengajar.
Dalam belajar mengajar hal yang harus diutamakan yaitu proses, karena proses inilah
yang menentukan tujuan belajar akan tercapai atau tidak tercapai. Ketercapaian dalam
proses belajar mengajar ditandai dengan adanya perubahan tingkah laku. Perubahan
tingkah laku ini baik yang menyangkut perubahan bersifat pengetahuan (kognitif),
keterampilan (psikomotor) maupun yang menyangkut nilai dan sikap (afektif). Seringkali
terjadi dalam proses belajar mengajar yang hanya berorientasi pada hasil dengan
mengabaikan proses, hal ini tentunya akan mengakibatkan kualitas pendidikan yang
sesungguhnya terabaikan. Dalam proses belajar mengajar ada banyak faktor yang
mempengaruhi tercapainaya tujuan pembelajaran diantaranya pendidik, peserta didik,
lingkungan, metode/teknik serta media/alat pembelajaran.
Dalam kaitannya dengan usaha untuk mencapai tujuan pembelajaran, media
pembelajaran mempunyai peran yang sangat penting. Media pembelajaran merupakan
sarana yang dapat membantu proses pembelajaran karena berkaitan dengan indera
pendengaran dan penglihatan. Adanya media pembelajaran bahkan dapat mempercepat
proses belajar mengajar menjadi efektif dan efisien dalam suasana yang kondusif,
sehingga dapat membuat pemahaman peserta didik lebih cepat. Dengan adanya media
pembelajaran maka tradisi lisan dan tulisan dalam proses pembelajaran dapat diperkaya
dengan berbagai media pengajaran. Selanjutnya, guru pendidik dapat menciptakan
berbagai situasi kelas, menentukan metode pengajaran yang akan dipakai dalam situasi
yang berlainan dan menciptakan iklim yang emosional yang sehat diantara peserta didik.
Lebih lanjut, media pembelajaran dapat membantu guru membawa dunia luar ke dalam
kelas. Dengan demikian ide yang abstrak dan asing (remote) sifatnya menjadi konkrit
dan mudah dimengerti oleh peserta didik. Bila media pembelajaran ini dapat di fungsikan
secara tepat dan proforsional, maka proses pembelajaran akan dapat berjalan efektif.
Permasalahan yang terjadi di lapangan yaitu banyak pendidik yang belum mampu
mengoptimalkan teknologi yang ada untuk mewujudkan sebuah pembelajaran yang
melibatkan media pembelajaran berbasis teknologi seperti komputer. Sebagian besar
pendidik terkendala permasalahan teknis tentang prosedur pembuatan media
pembelajaran elektronik baik dari ranah penguasaan teknik pemrograman, maupun
tampilan visual atau desain. Pada akhirnya media pembelajaran berbasis komputer hanya
sebatas pemindahan media kertas ke media digital dengan tampilan yang sama, dan
interaktifitas yang relatif minim. Hal ini yang menyebabkan media pembelajaran menjadi
kurang optimal
Sebagai salah satu solusi yang ditawarkan atas permasalah ini , buku ini akan
memfokuskan pembahasan terkait proses pembuatan media pembelajaran interaktif
dengan memakai aplikasi Adobe Flash. Pembahasan dalam buku ini meliputi proses
membanggun interaktifitas, pemakaian animasi, audio dan video, serta pemanfaatan
kode actionscript dalam aplikasi permainan edukatif.
Media Pembelajaran
Kata media berasal dari bahasa latin medius yang secara harfiah berarti “tengah”,
“perantara”, atau “pengantar”. Dalam bahasa Arab, media yaitu perantara atau
pengantar pesan dari pengirim kepada penerima pesan (Arsyad, 2011). Pada pengertian
lain, media yaitu segala sesuatu yang dapat digunakan utuk menyampaikan pesan dari
pengirim ke penerima pesan (Prawiradilaga, 2008). Menurut Gagne (1992), media yaitu
berbagai jenis komponen dalam lingkungan siswa yang dapat merangsangnya untuk
belajar. Senada dengan pendapat Gagne, Briggs mendefinisikan media pembelajaran
sebagai bentuk fisik yang dapat menyajikan pesan yang dapat merangsang siswa untuk
belajar. Dari dua definisi ini tampak pengertian media mengacu pada pemakaian alat
yang berupa benda untuk membantu proses penyampaian pesan. Sementara itu Asosiasi
Pendidikan Nasional (Nation Education Association/ NEA) memberikan batasan tentang
media yaitu bentuk-bentuk komunikasi baik tercetak maupun audi visual serta bebagai
peralatannya. Media pendidikan yaitu sumber belajar dan dapat juga diartikan dengan
manusia dan benda atau peristiwa yang membuat kondisi siswa mungkin memperoleh
pengetahuan, keterampilan atau sikap. Selain alat yang berupa benda, yang digunakan
untuk menyalurkan pesan dalam proses pendidikan, pendidikan sebagai figur sentral atau
model dalam proses interaksi edukatif merupakan alat pendidikan yang juga harus di
perhitungkan.
Menurut Oemar Hamalik (1986), media pembelajaran yaitu hubungan komunikasi
interaksi akan berjalan lancar dan tercapainya hasil yang maksimal, apabila
memakai alat bantu yang disebut media komunikasi. Dalam pengertian komunikasi,
media yaitu alat yang memindahkan informasi (pesan) dari sumber kepada penerima.
Menurut Edgar Dale (1946), media pembelajaran merupakan klasifikasi pengalaman
menurut tingkat dari yang paling konkrit ke yang paling abstrak, dimana partisipasi,
observasi, dan pengalaman langsung memberikan pengaruh yang sangat besar terhadap
pengalaman belajar yang diterima siswa. Penyampaian suatu konsep pada siswa akan
tersampaikan dengan baik jika konsep ini mengharuskan siswa terlibat langsung
didalamnya bila dibandingkan dengan konsep yang hanya melibatkan siswa untuk
mengamati saja. Sedangkan menurut Newby (2000), media pembelajaran yaitu media
yang dapat menyampaikan pesan pembelajaran atau mengandung muatan untuk
membelajarkan seseorang. Dari beberapa pendapat ini dapat disimpulkan bahwa
media pembelajaran yaitu media kreatif yang digunakan dalam memberikan materi
pelajaran kepada anak didik sehingga proses belajar mengajar lebih efektif, efisien dan
menyenangkan.
Manfaat Media Pembelajaran
Media pembelajaran memiliki peranan yang besar dan berpengaruh terhadap pencapaian
tujuan pendidikan yang diinginkan. Kegunaan Media/ alat pembelajaran dalam proses
belajar mengajar diantaranya:
1. Memperjelas penyajian pesan supaya tidak terlalu verbalitas (dalam bentuk kata-
kata tertulis atau hanya kata lisan)
2. Mengatasi keterbatasan ruang, waktu dan daya indera, misalnya;
Objek yang terlalu besar – bisa digantikan dengan realita, gambar,film bingkai,
film, atau model.
Objek yang kecil – dibantu dengan proyektor mikro, film bingkai, film, atau
gambar.
Gerak yang terlalu lambat atau terlalu cepat, dapat dibantu dengan timelapse atau
high-speed photography.
Kejadian atau peristiwa yang terjadi dimasa lalu bisa ditampilkan lagi lewat
rekaman film, video, film bingkai, atau foto objek yang terlalu kompleks, dapat
disajikan dengan model, diagram atau melalui program komputer animasi.
Konsep yang terlalu luas (gempa bumi, gunung berapi, iklim, planet dan lain-
lain) dapat divisualisasikan dalam bentuk film, gambar dan lain-lain.
3. Dengan memakai media pendidikan secara tepat dan bervariasi dapat diatasi
sikap pasif anak didik. Dalam hal ini media pembelajaran berguna untuk
menimbulkan motivasi belajar, memungkinkan interaksi langsung antara anak
didik dengan lingkungan secara seperti senyatanya, memungkinkan peserta didik
belajar mandiri sesuai dengan kemampuan dan minatnya.
4. Dengan latar belakang dan pengalaman yang berbeda diantara peserta didik,
sementara kurikulum dan materi pelajaran di tentukan sama untuk semua peserta
didik dapat diatasi dengan media pendidikan yaitu : memberikan perangsang
yang sama, mempersamakan pengalaman, menimbulkan persepsi yang sama.
Selain itu beberapa pakar berpendapat bahwa kegunan media pembelajaran itu antara
lain yaitu :
1. mampu mengatasi kesulitan-kesulitan dan memperjelas materi pelajaran yang
sulit,
2. mampu mempermudah pemahaman dan menjadikan pelajaran lebih hidup dan
menarik,
3. merangsang anak untuk bekerja dan menggerakkan naluri kecintaan menelaah
(belajar) dan menimbulkan
4. kemauan keras untuk mempelajarai sesuatu,
5. membantu pembentukan kebiasaan, melahirkan pendapat, memperhatikan dan
memikirkan suatu pelajaran serta,
6. menimbulkan kekuatan perhatian (ingatan) mempertajam indera, melatihnya,
memperluas perasaan dan kecepatan dalam belajar.
Jenis Media Pembelajaran
Rudi Bretz mengidentifikasi ciri utama dari media menjadi tiga unsur pokok yaitu suara,
visual dan gerak. Visual sendiri di bedakan menjadi tiga yaitu gambar, garis (line
graphic) dan simbol yang merupakan suatu kontinum dari bentuk yang dapat di tangkap
dengan indera penglihatan. Disamping itu Bretz juga membedakan antara media siar
(telecommunication) dan media rekam (recording) sehingga ada 8 klasifikasi media,
yaitu:
1. media audio visual gerak
2. media audio visual diam
3. media audio semi gerak
4. media visual gerak
5. media visual diam
6. media semi gerak
7. media audio
8. media cetak.
Sementara menurut Gagne (1992) mengelompokan media dalam 7 macam yaitu;
1. benda untuk didemonstrasikan
2. komunikasi lisan
3. media cetak
4. gambar diam
5. gambar gerak
6. film bersuara dan
7. mesin belajar.
Para ahli telah mengklasifikasikan media pendidikan kepada dua bagian yaitu alat
pendidikan yang bersifat benda (materil) dan alat pendidikan yang bukan benda (non
materil). Oemar Hamalik menyebutkan, secara umum alat pendidikan materil terdiri dari:
pertama, bahan-bahan cetakan atau bacaan, dimana bahan-bahan ini lebih
mengutamalkan kegiatan membaca atau pemakaian simbol-simbol kata dan visual.
Kedua, alat-alat audio visual yakni alat-alat yang dapat digolongkan pada:
1. alat tanpa proyeksi seperti papan tulis dan diagram
2. media pendidikan tiga dimensi, seperti benda asli, peta
3. alat pendidikan yang memakai teknik seperti radio, tape recorder,
transparansi.
Ketiga, sumber-sumber masyarakat, seperti peninggalan sejarah. Keempat,kumpulan
benda-benda (material collection), seperti dedaunan, benih, batu, dan sebagainya.
Menurut Ronald H. Anderson yang termasuk media dalam bentuk materil yaitu media
auditif, dimana pesan-pesan pengajaran dituangkan dalam lambang-lambang auditif,
yang termasuk media auditif yaitu , tape recorder dan radio. Disamping media visual
dan media auditif, media audio visual merupakan media yang berhubungan dengan
indera pendengaran dan indera penglihatan sekaligus.
Perkembangan media pembelajaran seiring dengan perkembangan teknologi. Seels dan
Richey (dalam Azhar Arsyad, 2006) membagi media pembelajaran dalam empat
kelompok berdasarkan perkembangan teknologi, yaitu:
a. Media hasil teknologi cetak
Media hasil teknologi cetak yaitu cara untuk menghasilkan atau menyampaikan
materi melalui proses pencetakan mekanis atau fotografis. Kelompok media hasil
teknologi cetak meliputi teks, grafik, foto, dan representasi fotografik. Materi
cetak dan visual merupakan pengembangan dan pemakaian kebanyakan materi
pengajaran lainnya. Teknologi ini menghasilkan materi dalam bentuk salinan
tercetak, contohnya buku teks, modul, majalah, hand-out, dan lainlain.
b. Media hasil teknologi audio-visual
Media hasil teknologi audio-visual menghasilkan atau menyampaikan materi
dengan memakai mesin-mesin mekanis dan elektronik untuk menyajikan
pesan-pesan audio dan visual. Contohnya proyektor film, televisi, video, dan
sebagainya.
c. Media hasil teknologi berbasis komputer
Media hasil teknologi berbasis komputer merupakan cara menghasilkan atau
menyampaikan materi dengan memakai sumber-sumber yang berbasis
mikro-prosesor. Berbagai jenis aplikasi teknologi berbasis komputer dalam
pengajaran umumnya dikenal sebagai computer-assisted instruction (pengajaran
dengan bantuan komputer).
d. Media hasil teknologi gabungan
Media hasil teknologi gabungan yaitu cara untuk menghasilkan atau
menyampaikan materi yang menggabungkan beberapa bentuk media yang
dikendalikan oleh komputer. Perpaduan beberapa teknologi ini dianggap teknik
yang paling canggih. Contohnya: teleconference, realitas maya (virtual reality)
Pada tahun 2010 perkembangan teknologi digital menuju ke arah mobile (gadget),
sebagian peserta didik memiliki gadget berupa smartphone yang merupakan media
efektif dalam menyampaikan suatu informasi. Dari data yang dikumpulkan oleh WaiWai
Marketing pada tahun 2014, pengguna mobile phone berbasis android di Indonesia
yaitu yang tertinggi di Asia Tenggara yaitu 44 juta pengguna. Dari jumlah ini ,
11% yaitu pengguna handphone berusia antara 7 - 17 tahun, yang merupakan usia aktif
peserta didik. Berkembangnya media mobile phone telah dimanfaatkan oleh beberapa
pihak sebagai salah satu media pembelajaran, sehingga menjadikan klasifikasi atau jenis
media pembelajaran bertambah. Meskipun beberapa pakar mengklasifikasikan media
pembelajaran berbasis mobilephone masuk ke dalam kategori pembelajaran berbasis
komputer (CAI), namun demikian dalam buku ini pembelajaran berbasis mobile phone
diklasifikasikan secara tersendiri karena memiliki perbedaan yang signifikan
dibandingkan dengan pembelajaran berbasis komputer.
Desain Media Pembelajaran
Pada bab I, sempat disinggung bahwa kelemahan beberapa media pembelajaran berbasis
komputer yang sudah ada yaitu sifat dari media ini yang hanya memindah materi
di dalam buku ke layar komputer. Layar pada akhirnya berisi penuh dengan materi yang
harus dibaca oleh peserta didik, yang mana menurut Edgar Dale (1946) efektifitas
membaca sebuah materi hanya berada dikisaran 10%. Berbeda halnya jika sebuah media
pembelajaran dibuat dengan desain yang baik, dengan melibatkan grafis, audio, video
dan interaktifitas akan menaikkan efektifitas penyerapan materi hingga 80 – 90%.
Pentingnya sebuah desain yang baik dalam sebuah media pembelajaran terkadang
terbentur dengan pengetahuan dasar desain tenaga pengajar yang membuat media
ini . Pada umumnya tenaga pengajar menguasai materi yang diajarkannya, akan
tetapi pengetahuan dasar tentang desain yang baik, komposisi, tata letak, warna dan
elemen kesenirupaan jarang dikuasai. Hal inilah yang menyebabkan media pembelajaran
pada akhirnya menjadi tidak optimal dalam menyampaikan materinya.
saat kita memakai istilah “desain”, maka dalam teori desain kita harus melakukan
beberapa langkah yaitu: design treatment, visual development phase, programming
phase, testing phase.
Design Treatment
Design treatment merupakan sebuah istilah desain yang mengandung pengertian analisis
tentang produk apa yang akan dibuat dan apa yang dibutuhkan untuk membuatnya. Pada
tahapan ini sebuah media pembelajaran harus melalui sebuah proses analisis secara
mendalam tentang apa saja yang terkait dengan media ini diantaranya yaitu :
- Materi apa sajakah yang akan disampaikan dalam media ini . Pembatasan
materi mutlak diperlukan untuk menjaga media agar fokus mencapai tujuan yang
diharapkan.
- Siapakah target audience media yang akan dibuat, apakah balita, anak-anak,
remaja atau orang dewasa. Penentuan target audience digunakan untuk
menetapkan pengayaan desain, kekompleksan navigasi, dan interaktifitas.
- Fitur-fitur apa saja yang akan ditampilkan. Apakah media nantinya menampilkan
sebatas materi, atau terdapat simulasi, evaluasi dalam bentuk kuis, penyimpanan
data evaluasi dan sebagainya.
- Bagaimana dengan media sejenis yang sudah ada sebelumnya. Jika ada, apa yang
membedakan media yang akan dibuat dengan media yang sudah ada. Selain itu
juga perlu dipikirkan fitur apa yang akan menjadi nilai tambah dari media
ini , sehingga penggunanya mendapatkan manfaat khusus saat
memakai media ini .
- Berapakah lamanya waktu untuk mewujudkan media ini dan aplikasi yang
akan digunakan untuk mewujudkannya.
Semua hal yang terkait dengan ide yang akan kita wujudkan perlu didokumentasikan
dalam bentuk catatan atau sebuah sket gambar untuk mempermudah gambaran anda atau
tim anda dalam mewujudkannya.
Sebagai contoh design treatment, Laras Safitri (2012) mendesain sebuah media
pembelajaran “Pengenalan Sayur dan Buah” pada anak usia dini. saat berbicara target
audiense dari media yang akan dibuat yaitu anak usia dini, maka harus didefinisikan
terlebih dahulu sifat-sifat dari target ini yaitu suka sesuatu yang berwarna cerah,
sebagian besar belum bisa membaca namun aktif mendengar (dalam hal ini audio akan
berperan penting), menyukai benda-benda yang bergerak dan dapat mengoperasikan
media dengan cara yang paling sederhana yaitu dengan menekan layar (touch).
Maka desain yang ditampilkan yaitu sebuah layar dengan gambar buah dan sayur yang
dipersonalifikasi, dalam artian buah dan sayur seolah-olah hidup dan bergerak bebas di
alam. saat anak menyentuh salah satu objek, maka akan muncul penjelasan secara
audio pada objek ini .
Gambar 5. Pengenalan Buah dalam Taman Bermain
Pada gambar 5, beberapa buah ditampilkan dalam sebuah taman bermain yang bergerak
(beranimasi), pepaya ditampilkan seolah-olah kapal kora-kora, buah jeruk seolah-olah
yaitu bianglala, buah semangka seolah-olah pulau fantasi yang melayang di angkasa
dan dengan iringan audio yang sesuai akan menjadikan target audiense menjadi tertarik
untuk melihat sampai menyentuh objek. saat objek disentuh, maka akan muncul
penjelasan secara audio dilengkapi dengan beberapa kalimat pendek bagi audiense yang
sudah bisa membaca.
Gambar 6. Penjelasan audio dan video tentang buah jeruk
Dalam gambar di atas ditampilkan sebuah screenshot saat objek jeruk ditekan.
Tampilan audio, grafis dari buah jeruk dan video tentang buah jeruk ditampilkan.
Audiense dapat menekan tombol kembali, atau aplikasi akan kembali ke tampilan
sebelumnya jika penjelasan sudah selesai.
Pada tampilan berikutnya pengenalan buah dan sayur dibuat seolah-olah buah-buahan
hidup di dalam ekosistem air. Buah naga ditampilkan seolah-olah naga air yang sedang
berenang. Buah nanas sebagai pepohonan di sebuah pulau. Sayur kacang-kacangan
berenang bebas. Beberapa objek ditampilkan dalam format animasi berulang, hal ini
akan menimbulkan atensi pada audiense sehingga keinginan untuk mempelajari lebih
lanjut semakin besar.
Gambar 8. Tampilan sayur dan buah dalam ekosistem danau
Sebuah media pembelajaran interaktif memiliki kemampuan untuk diulang-ulang, namun
demikian beberapa media sering kali dimainkan satu kali saja oleh audiense karena
merasa sudah cukup. Agar media memiliki nilai pengulangan yang tinggi (dalam artian
audiense tidak cepat bosan), maka perlu ditambahkan kreatifitas dalam menyampaikan
materi dan visualisasi yang beragam. Dalam Yummy Land ini beberapa animasi
buah-buahan dan sayuran ditampilkan dalam beberapa ekosistem, sehingga audiense
didorong untuk melakukan eksporasi secara menyeluruh.
Gambar 9. Halaman permainan Interaktif
Untuk lebih menarik audiense yang dalam hal ini yaitu anak-anak, ditampilkan pula
permainan interaktif sederhana seperti puzzle buah dan sayur serta permainan menebak
gambar.
Contoh ke 2 design treatment yaitu media interaktif pembelajaran “Mengenal Pakaian
dan Rumah Adat Nusantara” karya Murtiningsih (2012). Media ini ditargetkan untuk
anak usia sekolah dasar dan menengah pertama, sehingga dari sisi grafis dan
interaktifitas jauh lebih kompleks jika dibandingkan dengan contoh pertama.
Gambar 10. Media pembelajaran
“Mengenal pakaian dan rumah adat nusantara”
Dalam media ini , pada awalnya audiense akan dihadapkan dengan sebuah tampilan
depan dengan 2 menu yaitu “belajar” dan “bermain”, menu belajar akan membawa
audiense ke materi interaktif pengenalan pakaian dan rumah adat nusantara, sedang
menu bermain akan membawa ke permainan interaktif untuk menguji kemampuan
audiense.
Gambar 11. Pulau interaktif
Berbeda dengan interaktifitas yang sederhana pada media untuk anak usia dini, audiense
yang lebih besar mampu mengoperasikan media yang lebih kompleks. Dalam hal ini
Nusantara ditampikan dalam masing-masing pulau, dan audiense dapat memilih lokasi
berdasarkan propinsi yang ingin diketahui pakaian atau rumah adatnya. Dalam tampilan
ini secara tidak langsung audiense juga belajar tentang geografis Nusantara.
Gambar 12. Penjelasan baju dan rumah adat
Selanjutnya audiense akan diberikan halaman penjelasan tentang pakaian dan rumah adat
provinsi yang dipilih. Gambar yang ditampilkan merupakan gambar terolah yang sudah
digayakan sesuai dengan audiense, namun demikian gambar asli juga diperlukan untuk
memberikan penjelasan lebih lanjut, sehingga diberikan sebuah tombol navigasi yang
menunjukkan foto asli dari pakaian dan rumah adatnya.
Gambar 13. Foto pakaian dan rumah adat
Pada menu bermain ditampilkan permainan “Drag and drop matching”, yaitu
mencocokan pakaian adat. Karena audiense dianggap sudah mampu mengoperasikan
mouse atau touch dalam mode drag, maka permainan dapat memakai opsi ini .
Berbeda dengan permainan anak usia dini yang cukup hanya dengan menyentuh (touch).
Permainan dalam media pembelajaran selain dapat menambah daya tarik bagi audiense,
juga dapat digunakan sebagai bahan evaluasi untuk menilai pencapaian audiense dalam
memahami materi yang ada di dalam media. Dengan menambahkan sistem scoring
(penilaian) kita dapat mencatat dengan baik pencapaian masing-masing target audiense.
Visual Development Phase
Pada tahapan ini aset-aset visual dibuat. Asets visual meliputi grafik yang akan dipakai
sebagai objek dalam media, efek visual, typografi (pengggunaan huruf) dan grafik untuk
keperluan interface (antar muka). Pada umunya tahapan ini lebih mudah dilakukan oleh
desainer grafis, karena membutuhkan skill grafis dan kepekaan estetik. Sebuah media
pembelajaran interaktif merupakan produk dari multidisiplin ilmu, sehingga apabila
pembuat media pembelajaran hanya menguasai pembuatan dan pengolahan materi, maka
dibutuhkan tenaga grafis untuk mengerjakan tahapan ini.
Beberapa aplikasi yang dapat dimanfaatkan untuk membangun grafis dari sebuah
multimedia pembelajaran diantaranya yaitu Photoshop, Corel Draw, Adobe Ilustrator,
Adobe Flash dan sejenisnya. Penguasaan teknis terhadap aplikasi ini diperlukan
agar tampilan multimedia pembelajaran yang dibuat menjadi lebih atraktif dan efisien
dari sisi ukuran file.
Pada saat ini terdapat beberapa situs yang menyediakan aset grafis secara gratis maupun
berbayar. pemakaian aset yang sudah tersedia secara online dapat menghemat waktu
dan biaya, namun demikian perlu diperhatikan beberapa aturan agar media yang
dihasilkan nantinya menjadi lebih optimal, yaitu :
1. Gambar yang tersedia di internet memiliki lisensi yang bermacam-macam, mulai
dari 100% gratis, lisensi nama pembuat dan lisensi berbayar. Sebelum
memanfaatkan gambar ini kita harus memastikan dulu tentang lisensinya.
2. Gambar yang memiliki “watermark” menandakan bahwa gambar ini
berlisensi dan tidak boleh dipakai tanpa ijin.
3. Gambar yang tersedia secara online memiliki variasi tipe grafis. Pada dasarnya
tipe grafis ada 2 jenis yaitu vector dan bitmap. Vector merupakan gambar yang
terbentuk atas beberapa kurva, sedangkan bitmap terbentuk atas titik-titik yang
berwarna. Karena terdapat perbedaan yang signifikan antara gambar bertipe
vektor dan bitmap, maka diperlukan kemampuan dalam mengolahnya.
4. Setiap gambar yang tersedia secara online memiliki ukuran tertentu. Untuk
gambar bertipe bitmap, harus dilakukan penyesuaian ukuran sebelum gambar
dipakai dalam media. Gambar yang terlalu kecil akan terdistorsi jika diperbesar,
dan sebaliknya gambar yang terlalu besar akan memakan banyak memori dan
ukuran file sehingga tidak efektif.
5. pemakaian gambar yang bersumber secara online, memungkinkan sebuah objek
ditampilkan secara berulang-ulang di media lain. Sehingga kesan eksklusif
sebuah media menjadi berkurang.
Programming Phase
Pemrograman diperlukan dalam sebuah aplikasi media pembelajaran interaktif.
Pekerjaan pemrograman membutuhkan ketelitian dan pemahaman atas logika. Pada
umumnya kegiatan pemrograman dapat dilakukan dengan mudah oleh programmer,
namun khusus untuk pemrograman multimedia pembelajaran dapat dilakukan oleh non
programer karena tidak membutuhkan kode yang terlalu panjang.
Untuk mempermudah proses pemrograman dapat digunakan sistem flowchart. Flowchart
yaitu yaitu suatu bagan dengan simbol-simbol tertentu yang menggambarkan urutan
proses secara mendetail dan hubungan antara suatu proses (instruksi) dengan proses
lainnya dalam suatu program. Perhatikan contoh flowchart berikut :
Testing Phase
Tahapan testing yaitu sebuah proses pengumpulan informasi untuk memperbaiki segala
kesalahan desain dan kesalahan programming. Tahapan ini diperlukan sebagai bentuk
quality control dari media pembelajaran yang dibuat. Dari tahapan ini akan diketahui
berbagai kesalahan, kesalahan penulisan materi, kesalahan logika, kesalahan ukuran
interface dan sebagainya.
Tahapan testing lebih baik dilakukan oleh beberapa orang dengan tingkat keahlian yang
berbeda, sehingga akan didapatkan masukan dari berbagai sudut pandang, apakah media
pembelajaran sudah sesuai atau belum. Dari masukan-masukan ini dilakukan
perbaikan ulang, untuk memperoleh hasil akhir yang benar-benar siap untuk
dipublikasikan.
Prinsip Desain Media Pembelajaran
Di dalam unsur-unsur senirupa dikenal adanya garis, raut, warna, ruang, tekstur dan
gelap terang. Unsur ini juga muncul dalam sebuah desain media pembelajaran
interaktif, sehingga kita dapat mengaitkan prinsip desain/seni rupa pada desain media
pembelajaran. Beberapa prinsip yang dapat diaplikasikan dalam desain media
pembelajaran antara lain :
1. Prinsip Kesebandingan (Proporsi)
Kesebandingan (proporsi) merupakan hubungan perbandingan antara bagian
dengan bagian lain atau bagian dengan elemen keseluruhan. Kesebandingan
dapat dijangkau dengan menunjukkan hubungan antara:
- Suatu elemen dengan elemen yang lain,
- Elemen bidang/ ruang dengan dimensi bidang atau ruangnya.
- Dimensi bidang/ruang itu sendiri.
Dalam sebuah media pembelajaran interaktif terdapat beberapa elemen. Secara
umum elemen yang terdapat pada pembelajaran interaktif antara lain :
- Antarmuka (User Interface) meliputi : tombol navigasi, teks, dan elemen
grafis di luar konten.
- Konten, merupakan materi utama dalam media pembelajaran
- Audio
- Video/animasi
Setiap elemen ini ditampilkan dalam proporsi yang berbeda. Untuk
memenuhi prinsip kesebandingan, harus diperhatikan ukuran output yang ingin
dihasilkan. Untuk output aplikasi desktop (komputer) ukuran elemen navigasi
dapat dibuat antara 10-20% dari ukuran layar, dan materi yang ditampilkan
berukuran 60 – 70%. Berbeda dengan output untuk smartphone (handphone),
dimana ukuran yang lebih kecil menuntut proporsi navigasi yang lebih besar
yaitu 15 – 25 % dari ukuran layar.
Gambar 17. pemakaian proporsi tombol dalam pembelajaran rambu lalulintas
untuk handphone (Trifandianto, 2016)
Prinsip utama dalam proporsi yaitu setiap elemen dapat difungsikan dengan
baik. Misal, elemen teks diatur sedemikian rupa dari sisi ukuran dan jenis huruf
agar keterbacaannya tinggi.
Gambar 18. Keterbacaan yang kurang baik pada media pembelajaran berbasis
mobile/handphone
(Trifandianto, 2016)
2. Prinsip Penekanan (Emphasis)
Di dalam sebuah karya desain/seni terdapat beberapa bahan atau gagasan yang
lebih perlu ditampilkan dari pada yang lain. Dalam penciptaan desain/seni tidak
seharusnya elemen yang ada menonjol semuanya, dalam artian sama kuatnya,
sehingga terlihat ramai dan informasi atau apa yang akan disampaikan akan
menjadi tidak jelas.
Tampilnya emphasis merupakan strategi komunikasi yang bertujuan untuk
mengarahkan pandangan pembaca pada suatu yang ditonjolkan. Emphasis dalam
media pembelajaran dapat dicapai misalnya mengganti ukuran teks, menampilkan
ilustrasi dengan proporsi yang lebih besar atau memakai warna yang berbeda
untuk penekanan.
3. Prinsip Keseimbangan (Balance)
Keseimbangan dipengaruhi berbagai faktor, antara lain faktor tempat posisi suatu
elemen, perpaduan antar elemen, besar kecilnya elemen, dan kehadiran lemen
pada luasnya bidang. Keseimbangan akan terjadi bila elemen-elemen
ditempatkan dan disusun dengan rasa serasi atau sepadan. Dengan kata lain bila
bobot elemen-elemen itu setelah disusun memberi kesan mantap dan tepat pada
tempatnya.
Bentuk keseimbangan yang sederhana yaitu keseimbangan simetris yang
terkesan resmi atau formal, sedangkan keseimbangan asimetris terkesan informal
dan lebih dinamis.
4. Prinsip Irama (Ritme)
Ritme terjadi karena adanya pengulangan pada bidang/ruang yang menyebabkan
kita dapat merasakan adanya perakan, getaran, atau perpindahan dari unsur satu
ke unsur lain. Gerak dan pengulangan ini mengajak mata mengikuti arah
gerakan yang terjadi pada sebuah karya.
Dari ritme dapat ditentukan eyeflow atau arah baca sebuah desain. Secara umum
arah baca suatu desain yaitu dari kiri ke kanan dan dari atas ke bawah.
5. Prinsip Keselarasan (Harmony)
Kondisi selaras atau harmoni terbentuk karena tidak adanya pertentangan antara
satu elemen dengan elemen lainnya. Dalam desain untuk membentuk harmoni
dengan dilakukan dengan mengaplikasikan bentuk dan warna yang sama pada
elemen sejenis dan menampilkan elemen dengan penggayaan yang sama.
6. Prinsip Kesatuan (Unity)
Pada akhirnya prinsip kesatuan yaitu sebuah kohesi, konsistensi, ketunggalan
atau keutuhan, yang merupakan isi pokok dari komposisi. Prinsip ini akan
tercapai jika prinsip-prinsip sebelumnya telah diterapkan. Untuk mememenuhi
prinsip kesatuan, hal yang dapat dilakukan antara lain:
- memakai hanya dua atau tiga type styles (jenis huruf) dengan ukuran
yang memiliki keterbacaan yang baik dan relatif sama di seluruh halaman
media pembelajaran interaktif.
- memakai palet warna yang identik di seluruh halaman.
- Mengulang warna, bentuk, atau tekstur untuk membentuk irama dan eyeflow
- memakai proporsi ukuran objek grafis yang baik dan peletakan yang
teratur
- Menyediakan ruang kosong untuk menghadirkan harmoni
Adobe Flash
Setelah memahami proses perancangan suatu media pembelajaran interaktif, maka
tahapan berikutnya yaitu proses pengembangan untuk menghasilkan produk yang
dimaksud. Pada saat ini cukup banyak tool atau aplikasi yang dapat digunakan untuk
mengembangkan sebuah media pembelajaran interaktif. Diantara aplikasi ini antara
lain :
- Microsoft Power Point
- Prezi
- Android Studio
- Construct
- Unity
- Adobe Flash
Masing-masing aplikasi memiliki keunggulan dan kelemahan. Namun demikian dalam
memilih aplikasi kita dapat mengukur dari parameter harga aplikasi, kemudahan untuk
didapatkan, kemudahan operasional, fitur yang ditawarkan dan sumber belajar. Dari
beberapa parameter ini Adobe Flash dipilih oleh penulis sebagai aplikasi untuk
mengembangkan media pembelajaran interaktif, karena menawarkan berbagai fitur yang
menunjang proses pengembangan media.
Adobe Flash - sebelumnya bernama Macromedia Flash - yaitu salah satu perangkat
lunak komputer yang didesain khusus oleh Adobe dan merupakan program aplikasi
standar authoring tool professional yang digunakan untuk membuat animasi, web
maupun aplikasi yang interaktif dan dinamis. Flash didesain dengan kemampuan untuk
membuat animasi 2 dimensi yang handal dan ringan sehingga flash banyak digunakan
untuk membangun dan memberikan efek animasi pada website, multimedia interaktif,
film animasi, game dan yang lainnya. Pada tahun 2012 fitur Flash bertambah sehingga
dapat mengelola grafik 3 dimensi melalui bahasa pemrograman dasar bernama AGAL.
Flash memiliki fitur untuk membuat animasi berbasis motion, fasilitas action script 3
(bahasa pemrograman), mengelola video lengkap dengan fasilitas playback FLV,
mengelola audio dan menghasilkan output dalam berbagai format. Keunggulan lain yang
dimiliki Flash yaitu output dengan ukuran file yang kecil dan dapat ditampilkan dengan
ukuran layar yang dapat disesuaikan dengan keingginan.
Gambar 26. Pemanfaatan Flash dalam aplikasi Sekaran Ville yang memiliki fitur
animasi, video dan interaktifitas.
Ruang kerja Adobe Flash
Adobe Flash dapat diinstall dengan memakai aplikasi installer yang dengan mudah
didapatkan. Pada saat buku ini ditulis Adobe Flash telah memasuki versi CC 2016
(Creative Cloud 2016). Namun demikian buku ini masih sesuai untuk diterapkan dengan
memakai aplikasi Adobe Flash Profesional CS3 ke atas. Setelah proses installasi
selesai dan aplikasi dijalankan maka akan didapatkan tampilan sebagai berikut :
Dalam buku ini sengaja digunakan Adobe Flash CS5 karena memiliki tampilan yang
relatif sama dengan semua versi Adobe Flash terbaru, namun dengan warna yang lebih
terang sehingga lebih mudah untuk dijelaskan dengan gambar / screenshot.
Selanjutnya agar lebih familiar dengan versi Flash lama, kita dapat merubah tampilan
Adobe Flash menjadi dengan memilih mode Classic. Pilihan mode terdapat di bagian
atas tengah, dan mode classic dipilih karena lebih memudahkan kita dalam membangun
media pembelajaran interaktif.
terdiri dari 5 elemen utama, yaitu :
1. Main Menu
Seperti pada aplikasi umumnya, pada bagian atas terdapat menu utama yang di
dalamnya terdapat beberapa submenu.
2. Timeline
Timeline merupakan rangkaian waktu yang tersusun atas beberapa frame.
3. Toolbar
Toolbar berisi beberapa perangkat yang dapat digunakan untuk menambah dan
mengatur ulang objek yang berada di stage.
4. Stage
Stage merupakan area kerja yang digunakan dalam sebuah proyek.
5. Dynamic Panel
Merupakan panel yang selalu berubah secara dinamis mengikuti tool atau objek
aktif, dan berisi properti dari objek atau tool yang aktif ini .
Masing-masing tombol, menu dan panel akan dijelaskan fungsinya pada tutorial yang
akan di bahas pada bab berikutnya.
Membuat animasi sederhana
Fungsi dasar Flash pada saat pertama kali diciptakan yaitu untuk membuat animasi
sederhana sebagai elemen dalam website. Flash memfasilitasi pembuatan animasi
dengan metode yang paling sederhana yaitu frame by frame animation, animasi berbasis
motion sampai animasi berbasis kode. Pada bab berikut akan dijelaskan proses membuat
animasi sederhana yang nantinya dapat digunakan sebagai salah satu elemen dalam
media pembelajaran interaktif.
Dalam Flash kita bisa membedakan jenis animasi berdasarkan tekniknya menjadi 3,
yaitu:
1. Animasi Frame by Frame yaitu animasi dengan memakai beberapa gambar
yang berurutan (sequence), sebagai contoh animasi klasik memakai teknik
ini. Frame by Frame animation digunakan untuk menampilkan animasi yang
mengalami perubahan bentuk seperti animasi karakter melakukan gerak tubuh,
animasi perubahan bentuk secara dinamis seperti efek gerakan air, api, ledakan
dan sebagainya.
2. Animasi Motion Tween yaitu animasi dengan memakai dua buah keyframe
dengan menggerakkan 1 objek dari titik satu ke titik lain, tanpa mengalami
perubahan bentuk. Misal kita ingin menganimasikan mobil bergerak dari kiri ke
kanan layar.
3. Animasi Motion Guide yaitu animasi motion tween yang memakai lintasan
(guide) sehingga perubahan gerak dapat diatur sedemikian rupa sesuai dengan
lintasan yang diinginkan. Misal kita ingin membuat animasi daun yang jatuh dari
pohon dan tertiup angin, animasi mobil berjalan disebuah bukit yang tidak rata
dan sebagainya
Dengan memakai beberapa jenis animasi ini , kita dapat memanfaatkan
software Flash untuk mengerjakan animasi 2 dimensi untuk film, game, web dan
multimedia.
Sebelum mulai membuat animasi sederhana, berikut akan dijelaskan beberapa istilah
penting dalam sebuah animasi yang dibuat dengan memakai Flash :
1. Frame
Frame dapat kita ibaratkan sebagai lembaran kertas yang di dalamnya terdapat
sebuah gambar. saat lembaran-lembaran kertas tadi dimainkan satu lembar
demi satu lembar, maka gambar yang terdapat dalam frame ini seolah-olah
mengalami ilusi pergerakan.
Adobe Flash memberikan frame secara digital dan tersusun pada panel timeline.
Satu kotak dalam timeline mengindikasikan satu frame.
Gambar 30. Frame
2. KeyFrame
Keyframe yaitu sebuah frame yang berisi gambar yang menjadi tolak ukur dari
suatu perubahan (gerak, ukuran, warna). Sebagai contoh saat akan dibuat
sebuah animasi tangan melambai, maka yang dimaksud dengan keyframe yaitu
gambar dengan posisi tangan di awal dan gambar dengan posisi tangan di akhir.
Gambar 31. Keyframe
3. Blank KeyFrame
Dalam Flash Blank Keyfame, yaitu Keyframe yang tidak memiliki objek /
gambar di dalamnya. Blank keyframe ditandai dengan titik putih pada frame
sedang keyframe ditandai dengan titik hitam.
35
Gambar 32. Keyframe dan Blank Keyframe pada timeline
4. Frame per Second
Frame per Second (FPS) yaitu jumlah frame yang digunakan untuk menyusun
animasi berdurasi 1 detik. Secara default Flash memakai 24 fps, namun
demikian standart animasi untuk film yaitu 30 fps dan standart untuk game
yaitu 48 – 60 fps.
Semakin tinggi nilai fps akan menghasilkan animasi yang terkesan halus. Untuk
merubah nilai fps cukup dengan klik ganda angka fps dan ubah nilainya.
Gambar 33. Frame Per Second
5. Onion skin
Sesuai dengan namanya Onion skin akan menampilkan secara transparan frame
yang ada sebelum atau sesudah frame aktif. Untuk mempermudah pemahaman
terhadap Onion skin, bayangan anda akan membuat sebuah gerakan animasi di
beberapa lembar kertas. Setelah kertas pertama selesai digambar, gambar ini
diletakkan di atas meja kaca dengan sumber cahaya di bawahnya, dan lembaran
kertas baru diletakkan di atas gambar ini . Hal ini dimaksudkan agar gambar
di kertas ke 2 lebih mudah dibuat karena berdasarkan gambar ke 1.
Gambar 34. Onion Skin perubahan bentuk lingkaran ke bentuk tidak beraturan
6. Symbol
Symbol yaitu sebuah objek yang dapat digunakan secara berulang. Symbol
terdiri dari tiga jenis yaitu graphic, button (tombol) dan movieclip. Pemahaman
tentang symbol akan lebih lengkap seiring dengan tutorial pada bab selanjutnya.
Animasi Frame by Frame
Animasi Frame by Frame yaitu sebuah ilusi pergerakan dari sebuah gambar/objek yang
diam (still image) yang tersusun oleh gambar demi gambar. Animasi ini sering dipakai
dalam animasi klasik. Seorang animator harus membuat gambar di tiap-tiap frame sesuai
dengan durasi yang diinginkan.
Untuk membuat animasi frame by frame sederhana, perhatikan langkah berikut :
1. Buka aplikasi Adobe Flash, lalu buatlah sebuah file baru dengan menekan tombol
File > New
Gambar 35. New File
2. Pada panel pilihan New Document, pilih type Actionscript 3.0. Actionscript 3.0
(AS3) yaitu sebuah bahasa pemrograman yang digunakan oleh Flash. Versi 3
merupakan versi pembaruan dari AS1 dan AS2 dan menjadi standart sejak
37
kemunculannya di tahun 2005. Untuk itu setiap project nantinya memakai
pengaturan AS3 ini .
Gambar 36. New Document AS3
3. Klik OK, maka stage akan terbentuk secara default. Pada awal installasi default
dari Adobe Flash yaitu proyek dengan ukuran 550 x 440 pixel dan 24 fps.
Standart ini perlu kita ganti sesuai dengan output yang kita inginkan.
Sebagai contoh untuk output berupa aplikasi komputer/desktop gunakan ukuran
standart minimal 800x600 pixel dan 30 fps, sedang untuk handphone
memakai ukuran minimal 800x480 pixel dan 30fps.
Untuk merubah seting dari projek perhatikan pada bagian Dynamic panel di
sebelah kanan layar. Pada bagian properties terdapat tombol edit untuk mengatur
properties proyek. Klik tombol edit dan ubah parameter Dimensions menjadi
width :800 pixel height:600 pixel dan fps 30.
Gambar 37. Document Settings
4. Tekan OK, dan ukuran stage akan berubah mengikuti pengaturan setting ini .
5. Untuk membuat animasi frame by frame, langkah pertama yaitu membuat
sebuah gambar sebagai KeyFrame 1. Sebagai contoh kita akan menggambar
burung sederhana.
Dengan memakai brush tool, gambarlah burung sederhana seperti berikut :
Gambar 38. Brush tool
6. Selanjutnya klik frame ke 2, dan tambahkan Blank Keyframe. saat ada
perintah seperti pada kalimat ini , maka langkah yang dilakukan yaitu klik
kanan frame ke 2 lalu memilih opsi Insert Blank Keyframe.
Gambar 39. Insert Blank Keyframe
Blank Keyframe diibaratkan sebagai kertas kosong yang siap untuk ditambahkan
gambar animasi berikutnya. Dalam hal ini akan ditambahkan gambar burung
dengan posisi sayap yang berbeda
7. Untuk menambahkan gambar burung kita membutuhkan panduan agar gambar di
“kertas” (frame) ke dua tidak berbeda ukuran dari gambar di “kertas” pertama.
Untuk itu dapat digunakan fitur Onion Skin. Tekan tombol Onion Skin pada
timeline, maka gambar di frame 1 akan muncul dalam format transparan.
Gambar 40. Onion skin dan hasilnya
8. lalu dengan memakai brush tool, gambar burung dengan posisi sayap
yang berbeda. Lihat gambar :
Gambar 40. Gambar di frame 2
9. Non aktifkan Onion Skin, lalu jalankan animasi dengan menekan tombol
Ctrl+Enter. Maka akan muncul jendela Flash Player yang menampilkan animasi
burung ini , namun dalam gerakan yang terlalu cepat.
Gambar 41. Hasil animasi frame by frame
Gerakan yang terlalu cepat dikarenakan durasi animasi yang hanya sepersekian
detik. Dalam proyek ini FPS di set di angka 30, artinya untuk menghasilkan 1
detik animasi dibutuhkan 30 frame, sedangkan dalam animasi yang telah dibuah
hanya berdurasi 2 frame, sehingga dapat diartikan animasi ini berdurasi 2/30
detik atau sekitar 7 milidetik.
10. Untuk memperlambat animasi ini , maka diperlukan durasi frame yang lebih
panjang. Untuk melakukannya drag KeyFrame 2 menuju ke frame 5.
Gambar 42. Menggeser Keyframe
Dengan cara ini frame 1 akan ditampilkan sebanyak 5/30 detik (5 kali lebih lama
dari waktu sebelumnya), sehingga jika animasi dijalankan gambar pertama akan
muncul lebih lama dari gambar kedua.
11. Agar gambar ke 2 juga ditampilkan dalam waktu yang sama dengan gambar 1,
maka gambar ke 2 membutuhkan durasi. Untuk memberikan durasi yang sama,
klik kanan frame 10 lalu pilih Insert Frame.
Gambar 43. Insert Frame
12. Jalankan kembali dengan menekan Ctrl+Enter, maka animasi akan berjalan
lebih lambat dari sebelumnya. Sampai dengan langkah ini animasi frame by
frame sudah selesai dibuat, namun jika diinginkan gerakan yang lebih halus,
maka dapat dilakukan dengan memperbanyak jumlah keyframe dengan
perubahan posisi sayap sedikit demi sedikit.
Animasi Frame by Frame dengan Gambar Siap Pakai
Bagi beberapa orang, menggambar dengan aplikasi lain lebih familiar daripada membuat
gambar dengan drawing tool Flash secara langsung. Sebagai contoh dalam proyek
selanjutnya akan dibuat sebuah animasi frame by frame burung terbang dengan gambar
yang sudah siap pakai. Pada proyek ini digunakan gambar siap pakai yang disimpan dari
situs artists-help.tumblr.com, gambar dipisahkan menjadi 9 file dengan penamaan yang
berurutan.
Gambar 44. File gambar dengan penamaan berurutan
Penamaan yang berurutan merupakan standart untuk produksi animasi, karena akan
mempermudah penataan gambar. Selain itu masing-masing gambar harus memiliki
ukuran yang sama agar proses pengaturan animasi menjadi lebih mudah.
Selanjutnya buatlah sebuah file baru dalam Flash dan ikuti langkah-langkah berikut :
1. Klik menu File>Import to Stage, untuk mengimport gambar yang telah
disiapkan sebelumnya.
2. Setelah jendela Import muncul pilih file gambar pertama (gambar dengan no urut
paling kecil). Dalam contoh ini gambar yang dipilih yaitu file burung_1.jpg.
lalu klik OK.
Gambar 45. Import file
3. Selanjutnya akan muncul dialog import sequence. Klik Yes untuk mengimport
seluruh gambar dan menatanya secara otomatis ke dalam frame sebagai satu
sequence.
Gambar 46. Import sequence
4. Apabila penomoran file benar dan tidak terputus, maka gambar secara otomatis
akan tertata sebagai animasi frame by frame. Hal ini tentu saja mempermudah
seorang animator dalam mengatur sebuah rangkaian animasi yang terdiri dari
beberapa gambar.
Gambar 47. Animasi Frame by Frame hasil import
5. Jalankan file dengan menekan Ctrl + Enter, maka akan dihasilkan animasi
burung terbang yang lebih baik dari tutorial sebelumnya.
Animasi Motion Tween
Motion Tween yaitu animasi pergerakan suatu objek dari keadaan awal sampai keadaan
akhir. Motion tween dapat digunakan untuk jenis animasi yang merubah posisi objek,
merubah ukuran objek, merubah visibilitas, kecerahan (brightness), dan transparansi
warna benda.
Sebagai contoh, pada tutorial berikut akan dibuat sebuah animasi motion tween bola
yang bergerak dari kiri ke kanan layar. Perhatikan langkah-langkah berikut :
1. Buatlah sebuah file baru
2. Dengan memakai Oval Tool buatlah sebuah lingkaran, dengan cara drag
and release pada Stage. Perlu diketahui bahwa Flash yaitu program berbasis
vector. Setiap objek gambar memiliki 2 penyusun yaitu outline/stroke (garis tepi)
dan fill (isian). Anda dapat merubah warna, ukuran dan posisi objek gambar
dengan memakai panel properties (dynamic panel).
Gambar 48. Oval tool
3. Selanjutnya seleksi lingkaran yang anda buat (stroke dan fill nya), lalu pilih
menu Modify > Convert to Symbol atau menekan tombol F8. lalu anda
saat n “bola” pada kolom Name, pilih Movieclip pada opsi Type dan pilih
tengah pada opsi Registration Lihat gambar!
Gambar 49. Convert to Symbol
4. Untuk membuat animasi bola sepanjang 2 detik, klik kanan Frame 60 pada
timeline lalu pilih Insert Keyframe.
Gambar 50. Insert Keyframe
5. Selanjutnya geser posisi bola yang berada di Frame 60 seperti di gambar. Jadi di
frame 1 bola berada di posisi sebelah kiri stage dan di frame 2 berada di kanan.
Gambar 51. Peletakan objek di frame 2
6. Klik kanan Frame di antara 2 Key Frame (bebas antara frame 2 sampai frame 59,
misal anda klik kanan frame 25) pada timeline lalu pilih Create Create
Classic Tween. Maka timeline akan berubah menjadi berwarna biru dan bergaris.
Gambar 52. Create Classic Tween
7. Simpan file, lalu jalankan animasi dengan menekan tombol Ctrl+Enter
Maka akan terbentuk sebuah file animasi bertipe SWF dimana bola bergerak dari
kiri ke kanan selama 2 detik dan looping secara terus menerus.
Gambar 53. Hasil animasi motion tween
Prinsip Dasar Animasi Tween Dalam Flash
1. Objek harus di convert menjadi symbol jika tidak flash secara otomatis akan
mengkonvert objek dengan nama otomatis, yang akan mempersulit kita saat
sudah memiliki banyak objek untuk dianimasikan.
2. Satu keyframe khusus untuk satu symbol dalam animasi tween, 1 keyframe hanya
boleh ditempati 1 buah symbol. Apabila terdapat 2 objek atau lebih maka garis
putus-putus pada timeline akan muncul dan animasi tween tidak akan terbentuk
sempurna. Gunakan beberapa layer untuk menganimasikan beberapa objek
sekaligus
3. Minimal harus memiliki 2 keyframe animasi motion-tween selalu membutuhkan
keyframe awal dan keyframe akhir.
Animasi Tween dengan Ease
Ease yaitu upaya untuk membuat gerakan sebuah animasi menjadi lebih realistik, bisa
disebut sebagai perlambatan atau percepatan sebuah animasi. Untuk mendapatkan kesan
realis dalam sebuah animasi, kita perlu mengacu pada kondisi riil di dunia nyata. Sebagai
contoh saat kita membuat animasi bola memantul dari atas ke bawah, akan ada efek
percepatan dan perlambatan akibat adanya grafitasi. saat bola baik ke atas, maka bola
akan melambat karena tertarik grafitasi dan saat bola bola bergerak ke bawah maka
bola akan tertarik grafitasi (mengalami percepatan). Perhatikan gambar berikut
Gambar 54. Animasi dengan ease
Pada tutorial berikut akan dijelaskan teknik membuat animasi pendulum dengan
memakai ease untuk menambah kesan realis. Untuk melakukannya perhatikan
langkah berikut :
1. Buatlah sebuah file baru. lalu dengan memakai Oval tool dan line
tool, buatlah sebuah bola yang tergantung pada seutas tali. lalu seleksi
semua dan pilih menu Modify > Convert to Symbol atau menekan tombol F8.
lalu anda saat n “pendulum” pada kolom Name, pilih Movieclip pada
opsi Type dan pilih atas tengah pada opsi Registration. Perhatikan gambar.
Gambar 55. Symbol “pendulum”
2. Untuk membuat animasi 2 buah pendulum yang saling memantul diperlukan 2
gambar pendulum dan 2 buah layer (Karena peraturan bahwa satu keyframe
hanya boleh diletakkan 1 buah symbol jika dianimasikan dengan motion tween).
Untuk itu buatlah sebuah layer baru di atas layer 1 dengan menekan menu Insert
> Timeline > Layer atau menekan tombol New Layer yang berada di timeline.
Gambar 56. New Layer
3. Karena gambar pendulum yang digunakan sama, maka tidak perlu dibuat ulang.
Setiap symbol yang sudah dibuat, secara otomatis akan masuk ke dalam Library
dan dapat digunakan secara berulang. Buka Library dengan menekan menu
Window > Library atau dengan menekan tombol Ctrl+L. Pada panel Library
akan anda dapati symbol pendulum yang telah dibuat sebelumnya.
Gambar 57. Library
4. Untuk menambahkan pendulum kedua, klik frame 1 layer 2, lalu drag
symbol pendulum dari library ke stage. Atur posisinya, sesuaikan dengan
pendulum pertama.
Gambar 58. Menambahkan symbol dari library ke stage
5. Karena gerakan pendulum yaitu gerakan melengkung / parabola, kita harus
memperhatikan titik pusat rotasi. Dengan memakai Free Transform Tool,
geser titik pusat rotasi (pivot point) menuju ke ujung atas benang. Lakukan ada
ke dua pendulum.
Gambar 59. Menggeser Pivot Point
6. Setelah pengaturan pivot point kedua pendulum, dengan memakai Free
Transform Tool atur posisi ke dua pendulum ini ke posisi awal. Untuk
merotasi objek dekatkan mouse ke ujung objek sehingga muncul ikon rotasi,
lalu drag sesuai dengan kebutuhan. Lihat gambar!
Gambar 60. Posisi awal pendulum
7. Perlu diperhatikan bahwa gerakan pendulum akan berulang, dimana gerakan
utama pendulum ada tiga langkah seperti pada gambar 62, sehingga masing-
masing layer membutuhkan 3 buah Key Frame.
8. Karena posisi awal dan posisi akhir dari pendulum sama, maka langkah yang
paling tepat yaitu mengerjakan terlebih dahulu posisi awal dan akhir. Seleksi
frame 40 layer 1 dan layer 2 (dengan menahan tombol shift + klik pada frame
40), lalu pertahankan posisi mouse, klik kanan dan pilih Insert Key
Frame.
Gambar 61. Insert Keyframe 40 – tanpa perubahan apapun
9. saat posisi pendulum sedang turun (di tengah / di bawah), maka waktu yang
tepat yaitu setengah dari waktu total. Karena waktu total yaitu 40 frame, maka
setengah dari waktu yaitu 20 frame. Seleksi frame 20 layer 1 dan layer 2
(dengan menahan tombol shift + klik pada frame 20), lalu pertahankan
posisi mouse, klik kanan dan pilih Insert Key Frame.
lalu dengan memakai Free Transform Tool, atur posisi kedua
pendulum sesuai dengan gambar berikut:
Gambar 62. Pengaturan Keyframe pendulum
10. Untuk menambahkan animasi, seleksi seluruh frame layer 1 dan layer 2 (klik
frame 1 layer 2, tahan tombol shift dan klik frame 2 layer 1). Pertahankan posisi
kursor mouse, klik kanan dan pilih Create Classic Tween.
Gambar 63. Menambahkan Classic Tween pada seluruh layer
11. Jalankan aplikasi dengan menekan tombol Ctrl+Enter. Maka akan terbentuk
animasi gerakan pendulum. Namun demikian jika anda perhatikan gerakan
ini masih terkesan kaku (tidak alami), karena efek grafitasi tidak bekerja.
12. Untuk membuat animasi ini lebih terkesan realis, perlu ditambahkan ease.
saat objek tertarik grafitasi (frame 1 sampai frame 20) maka diperlukan ease
bernilai negatif (ease in) dan sebaliknya saat objek memantul ke atas maka
pendulum akan semakin melambat, sehingga diperlukan ease bernilai positif
(ease out).
Untuk mengatur ease, klik frame 10 layer 1 dan layer 2. Pada panel properties
ubah nilai parameter ease menjadi -100 (ease in). Selanjutnya klik frame 30
layer 1 dan layer 2 lalu ubah nilai parameter ease menjadi 100 (ease out).
Gambar 64. Pengaturan ease
13. Jalankan aplikasi dengan menekan Ctrl+Enter. Maka animasi pendulum yang
dihasilkan akan lebih realis.
Gambar 65. Perbedaan Animasi pendulum tanpa dan dengan ease
Animasi Tween dengan Rotasi
Dalam animasi, rotasi merupakan salah satu gerak yang sering dipakai. Sebagai contoh :
gerakan roda, perubahan sudut gerak dan sebagainya. Flash memiliki opsi rotasi pada
