Development of Learning Application with Adobe Flsh CS5 (Case Study Space Geometry) Ayu Florensia Haniq Undergraduate Program, Faculty of Industrial Engineering, 2010 Gunadarma University http://www.gunadarma.ac.id
Keywords : Computer-Based Applications, Mathematics, Space Geometry, Adobe Flash CS5
ABSTRACT In learning, the learning process using information and communication technologies is called the Learning-Based Information and Communication Technology (ICT). Based Learning Information and Communication Technology (ICT) must not be connected to the internet. One form of Learning-Based Information and Communication Technology (ICT) that are not connected to the Internet is learning to use computer applications. Use of computer-based learning application is intended to assist teachers in delivering the materials and also assist students in understanding the material being taught. Subjects with Mathematics Geometry Space as one material that is taught in high school (SMA) especially to the students of class X. Most of the material contained in the subjects of Mathematics given at a meeting in the classroom. Based on the above issues, then be made to Computer Based Learning Application Using Adobe Flash CS5 (Case Study Room Geometry). This application provides an interactive content with animation, audio, video and comes with an evaluation form about the exercises. Results to be achieved from the making of this application is that students can understand the subject with the subject of Mathematics Geometry Room. Hopefully, with this application, it can ease and inprove the quality of teaching and learning process.
PENDAHULUAN Pada era modernisasi ini, memang harus diakui bahwa kemajuan teknologi semakin pesat. Teknologi informasi dan komunikasi telah merambah kesegala aspek kehidupan, dimana saja membaca selalu berhubungan dengan informasi atau tulisan tentang Teknologi Informasi. Teknologi informasi dan komunikasi (TIK) telah banyak memberikan sumbangsihnya untuk perkembangan dalam segala bidang kehidupan, termasuk dalam perkembangan dunia pendidikan khususnya proses pembelajaran di sekolah pada saat ini. Tujuan digunakannya Teknologi informasi dalam proses pembelajaran adalah untuk menghapus posisi penyambung komunikasi dari dua tempat yang berkepentingan, juga menghapus batas waktu untuk operasi internasional dengan konsep real time. Maka dari itu aplikasi yang saat ini sangat baik untuk dikembangkan di bidang pendidikan adalah Aplikasi Pembelajaran Berbasis Komputer. Penggunaan aplikasi pembelajaran berbasis komputer ini dimaksudkan untuk membantu guru dalam penyampaian materi dan juga membantu siswa dalam memahami materi yang diajarkan. Konten Aplikasi Pembelajaran Berbasis Komputer semakin mengalami peningkatan. Berawal dari animasi pada slide presentasi yang menjadi bahan Pembelajaran Berbasis Teknologi Informasi dan Komunikasi (TIK), hingga penambahan Audio dan video tutorial. Hal tersebut ditujukan agar bahan ajar Aplikasi Pembelajaran berbasis Komputer menjadi lebih menarik, dan siswa dapat menerima materi lebih jelas. Karena pada Aplikasi Pembelajaran berbasis komputer, konsep pembelajaran dilakukan tanpa melalui proses tatap muka antara siswa dengan Pengajar.
Biasanya pembelajaran berbasis komputer adalah untuk penyiapan tenaga ahli pada suatu bidang yang memerlukan pelatihan terlebih dahulu sebelum menempati posisinya. Namun sekarang aplikasi ini berguna untuk membantu proses pengajaran. Aplikasi ini berjalan dalam standalone PC ataupun berbentuk kemasan CD-ROM. Isi berupa materi dalam bentuk tulisan maupun multimedia (video dan audio) dalam format MOV, AVI dan WAV. Mata pelajaran Matematika sebagai salah satu mata pelajaran yang didapat sejak sekolah dasar bahkan saat taman kanakkanak sudah mempelajari dasar dari pelajaran Matematika. Bahkan banyak orang yang berpendapat bahwa matematika itu sulit dan membosankan. Namun sudah tidak diragukan lagi matematika sangat penting guna mengasah logika. Hal ini membuktikan bahwa mata pelajaran Matematika sangat dibutuhkan bagi para siswa sehingga harus diperhatikan kualitasnya. Salah satu materi matematika yang dianggap bersifat abstrak adalah materi geometri ruang. Materi ini didapat di Sekolah Menengah Atas (SMA) kelas X. tidak sedikit para siswa SMA yang menganggap materi tersebut sulit untuk dipahami. Jika melihat dari segi kemampuan seseorang untuk memahami dan menyerap pelajaran sudah pasti berbeda tingkatnya. Ada yang cepat, sedang dan ada pula yang sangat lambat. Karenanya, mereka seringkali harus menempuh cara berbeda untuk bisa memahami sebuah informasi atau pelajaran yang sama. Setiap mahasiswa memiliki karakteristik atau gaya belajar yang berbeda dalam memahami atupun menerima informasi yang mereka dapat. Di era sekarang muncul istilah baru dalam dunia pendidikan, yaitu PAIKEM (Pembelajaran Aktif, Inovatif, Kreatif, Efektif dan Menyenangkan). Selanjutnya, PAIKEM dapat didefinisikan sebagai: pendekatan mengajar (approach to teaching)
yang digunakan bersama metode tertentu dan pelbagai media pengajaran yang disertai penataan lingkungan sedemikian rupa agar proses pembelajaran menjadi aktif, inovatif, kreatif, efektif, dan menyenangkan. Dengan demikian, para siswa merasa tertarik dan mudah menyerap pengetahuan dan keterampilan yang diajarkan. Selain itu, PAIKEM juga memungkinkan siwa melakukan kegiatan yang beragam untuk mengembangkan sikap, pemahaman, dan keterampilannya sendiri dalam arti tidak semata-mata “disuapi” guru. Diantara metode-metode mengajar yang amat mungkin digunakan untuk mengimplementasikan PAIKEM, ialah Metode Ceramah Plus, Metode Diskusi, Metode Demonstrasi, Metode Role-Play dan Metode Simulasi. Berdasarkan alasan di atas, betapa pentingnya suatu aplikasi berbasis computer untuk mata pelajaran matematika yang dianggap abstrak untuk bisa lebih dimengerti dan lebih menyenangkan bagi para siswa. Tidak hanya menyenangkan tetapi juga harus bersifat aktif, inovatif, kreatif dan efektif sehingga para siswa bisa lebih interaktif dengan aplikasi berbasis komputer guna meningkatkan pemahaman siswa pada suatu mata pelajaran.
TINJAUAN PUSTAKA Teknologi Informasi dan Komunikasi (TIK) Istilah teknologi informasi dan komunikasi (TIK) sudah sering digunakan di dalam kehidupan sehari-hari termasuk dalam kegiatan pembelajaran. Sekalipun sudah sering digunakan, namun tampaknya masih terjadi pemahaman yang berbeda mengenai istilah TIK. Bahkan ada sebagian orang yang agak berlebihan pemahamannya, yaitu yang mengidentikkan TIK itu dengan
komputer atau internet saja. Akibatnya, setiap ada pembicaraan mengenai TIK, maka yang terlintas di dalam pemikiran yang bersangkutan adalah komputer atau internet. Di lingkungan pendidikan atau pembelajaran, apabila ada topik pembicaraan mengenai TIK, ternyata masih ada sebagian guru yang pemahamannya langsung mengarah atau terpusat pada komputer atau internet. Pemahaman yang demikian ini mengakibatkan bervariasinya sikap para guru dalam pemanfaatan TIK untuk pembelajaran. Ada sebagian guru yang secara spontan mengemukakan bahwa belum saatnya dilakukan pemanfaatan TIK dalam kegiatan pembelajaran. Penyampaian pendapat ini disertai dengan sejumlah argumentasi pembenaran terhadap pendapat atau sikap mereka. Tetapi ada juga sebagian guru yang mengatakan bahwa pada dasarnya sebagian guru sudah mulai memanfaatkan TIK dalam kegiatan pembelajaran. Perbedaan pendapat atau sikap guru ini dapat saja diakibatkan oleh berbedanya pemahaman mereka mengenai TIK itu sendiri. TIK dikatakan dapat memberikan suatu solusi praktis untuk meningkatkan kualitas dan kuantitas pendidikan (http://www.unicttaskforce.org/). Dalam kaitan ini, keberhasilan untuk memecahkan masalah pendidikan/pembelajaran dan yang mengarah pada peningkatan kualitas dan kuantitas pendidikan adalah sepenuhnya sangat ditentukan oleh guru yang melaksanakan pemanfaatan TIK itu sendiri. Para peneliti telah menyadari bahwa TIK tidak dapat diperlakukan sebagai variabel bebas tunggal, dan prestasi belajar siswa tidak semata-mata hanya ditentukan oleh sebaik apapun para siswa mencapai hasil tes standar tetapi ditentukan juga oleh kemampuan siswa untuk menggunakan keterampilan berpikir tingkat tinggi (seperti:
berpikir kritis, berpikir analitis, membuat inferensi, dan pemecahan masalah). Mempertimbangkan dampak dari TIK jenis apapun menuntut suatu pemahaman tentang bagaimana TIK itu dimanfaatkan di dalam kelas dan untuk mencapai tujuan pembelajaran (perlu ditetapkan oleh para guru yang memanfaatkannya) di samping pengetahuan tentang jenis penilaian yang akan digunakan untuk menilai peningkatan prestasi belajar siswa, dan kesadaran tentang hakekat perubahan yang kompleks di lingkungan sekolah. (http://www.ncrel.org/sdrs/areas/issues/meth ods/ technlgy/ te800.htm). Pada umumnya, pengalaman menunjukkan bahwa semangat untuk melakukan pembangunan termasuk pengadaan peralatan selalu menggebu-gebu. Tetapi, setelah pembangunan selesai atau perangkat fasilitas/peralatan telah tersedia, masalah yang cenderung terjadi adalah bahwa bangunan yang telah jadi atau peralatan yang telah tersedia lebih banyak menganggurnya (idle). Keadaan yang demikian ini dapat juga terjadi di lingkungan sekolah. Sebagai contoh adalah pengadaan perangkat fasilitas/peralatan TIK, baik yang diadakan sendiri oleh sekolah maupun yang diterima sekolah sebagai hasil pengadaan pihak lain. Di beberapa sekolah, perangkat fasilitas/peralatan yang ada, belum atau tidak pernah digunakan sekolah atau baru dipakai sudah rusak. Banyak faktor penyebabnya, antara lain misalnya: (a) para guru belum dipersiapkan dengan baik untuk memiliki kesiapan dalam memanfaatkan peralatan/fasilitas TIK secara optimal bagi kepentingan kegiatan pembelajaran, (b) para guru juga tidak dibekali dengan pengetahuan dan keterampilan yang memadai di bidang pengembangan bahan-bahan belajar yang dapat disajikan melalui fasilitas/ peralatan TIK yang telah diadakan sekolah, (c) para
guru tidak mendapatkan appresiasi atas usaha atau kerja ekstra yang telah mereka lakukan dalam mengoptimalkan pemanfaatan fasilitas/ peralatan TIK yang tersedia di sekolah, dan (d) kurangnya perhatian untuk melakukan perawatan atau pemeliharaan fasilitas/peralatan TIK yang telah dimiliki sekolah (enerjik dalam membangun/ mengadakan tetapi lemah dalam melakukan perawatan/pemeliharaan). Secara sederhana dapatlah dikemukakan bahwa pada umumnya fasilitas/peralatan TIK dimanfaatkan untuk kegiatan pembelajaran karena potensinya antara lain yang dapat: a. membuat konkrit konsep yang abstrak, misalnya untuk menjelaskan sistem peredaran darah; b. membawa obyek yang berbahaya atau sukar didapat ke dalam lingkungan belajar, seperti: binatangbinatang buas, atau penguin dari kutub selatan; c. menampilkan obyek yang terlalu besar, seperti pasar, candi borobudur; d. menampilkan obyek yang tidak dapat dilihat dengan mata telanjang, seperti: mikro organisme; e. mengamati gerakan yang terlalu cepat, misalnya dengan slow motion atau time-lapse photograhy; f. memungkinkan siswa berinteraksi langsung dengan lingkungannya; g. memungkinkan keseragaman pengamatan dan persepsi bagi pengalaman belajar siswa; h. membangkitkan motivasi belajar siswa; i. menyajikan informasi belajar secara konsisten, akurat, berkualitas dan dapat diulang penggunaannya atau disimpan sesuai dengan kebutuhan; atau j. menyajikan pesan atau informasi belajar secara serempak untuk lingkup sasaran yang sedikit/kecil
atau banyak/luas, mengatasi batasan waktu (kapan saja) maupun ruang di mana saja). TIK memiliki potensi yang sangat besar dalam membantu peningkatan efektivitas pembelajaran berdasarkan referensi penelitian yang dirujuk Ade Kusnandar. Potensi TIK yang dimaksudkan dikemukakan sebagai berikut: a. 10% informasi diperoleh dengan cara membaca (teks). b. 20% informasi diperoleh dengan cara mendengar (suara). c. 30% informasi diperoleh dengan cara melihat (grafis/foto). d. 50% informasi diperoleh dengan cara melihat dan mendengar (video/animasi). e. 80% informasi diperoleh dengan cara berbicara. f. 80% informasi diperoleh dengan cara berbicara dan melakukan (interaktif).
Aplikasi Perangkat lunak aplikasi adalah suatu subkelas perangkat lunak komputer yang memanfaatkan kemampuan komputer langsung untuk melakukan suatu tugas yang diinginkan pengguna. Biasanya dibandingkan dengan perangkat lunak sistem yang mengintegrasikan berbagai kemampuan komputer, tapi tidak secara langsung menerapkan kemampuan tersebut untuk mengerjakan suatu tugas yang menguntungkan pengguna. Contoh utama perangkat lunak aplikasi adalah pengolah kata, lembar kerja, dan pemutar media. Beberapa aplikasi yang digabung bersama menjadi suatu paket kadang disebut sebagai suatu paket atau suit aplikasi (application suite). Contohnya adalah Microsoft Office dan OpenOffice.org, yang menggabungkan suatu aplikasi pengolah kata, lembar kerja, serta beberapa aplikasi lainnya. Aplikasi-aplikasi dalam suatu paket
biasanya memiliki antarmuka pengguna yang memiliki kesamaan sehingga memudahkan pengguna untuk mempelajari dan menggunakan tiap aplikasi. Sering kali, mereka memiliki kemampuan untuk saling berinteraksi satu sama lain sehingga menguntungkan pengguna. Contohnya, suatu lembar kerja dapat dibenamkan dalam suatu dokumen pengolah kata walaupun dibuat pada aplikasi lembar kerja yang terpisah. Klasifikasi Aplikasi dapat digolongkan menjadi beberapa kelas, antara lain: 1. Perangkat lunak perusahaan (enterprise) 2. Perangkat lunak infrastruktur perusahaan 3. Perangkat lunak informasi kerja 4. Perangkat lunak media dan hiburan 5. Perangkat lunak pendidikan 6. Perangkat lunak pengembangan media 7. Perangkat lunak rekayasa produk
Perancangan Aplikasi Perancangan aplikasi adalah proses merancang halaman aplikasi dengan memanfaatkan berbagai disiplin ilmu, seperti animasi, authoring, desain komunikasi, desain grafis, interaksi manusia-komputer, arsitektur informasi, interaksi desain, pemasaran, fotografi, mesin pencari optimasi dan tipografi. Halaman aplikasi dapat berupa halaman statis, atau dapat diprogram ke halaman yang dinamis akan secara otomatis menyesuaikan konten atau tampilan visual, tergantung pada berbagai faktor. Dengan berkembangnya spesialisasi dalam desain komunikasi dan bidang teknologi informasi, ada kecenderungan kuat untuk menarik garis yang jelas antara desain aplikasi khusus untuk halaman
aplikasi dan pengembangan aplikasi untuk logistik secara keseluruhan dari semua layanan berbasis komputer. Pengukuran diantaranya
Kesuksesan
aplikasi
1. Response time adalah total waktu yang dibutuhkan sistem untuk memproses sebuah request dari luar ke sistem tersebut. Mungkin sebuah aksi terhadap UI, seperti penekanan tombol, atau sebuah pemanggilan API. 2. Responsiveness adalah seberapa cepat sistem mengenali sebuah request sebagai sesuatu untuk diproses dan kemudian mengembalikan feedback walaupun proses belum selesai. a. User bisa frustasi walapun response time baik b. Walaupun belum selesai proses, sistem harus tetap memberikan respon. Misalnya gunakan timer atau progressbar, atau informasi lain. 3. Latency adalah waktu minimum yang dibutuhkan untuk mendapatkan segala bentuk response. 4. Throughput adalah berapa hasil yang diperoleh dalam suatu satuan waktu tertentu. a. Jika mengukur copy file, throughput diukur dalam berapa bytes per second. b. Untuk enterprise applications pengukuran berdasarkan transactions per second (tps), tapi masalahnya bergantung pada kompleksitas transaksi. 5. Capacity adalah indikasi maximum dari throughput 6. Load adalah tingkat tekanan / stress sebuah sistem
a. Misalnya diukur dengan berapa banyak user yang sedang terhubung saat itu. b. Misalnya response time untuk suatu request pada sat peak adalah 0.5 seconds dengan 10 users dan 2 seconds dengan 20 users. 7. Load sensitivity adalah bagaimana response time bervariasi dengan load. a. Misalnya sistem A memiliki response time 0.5 seconds untuk 10 sampai 20 users dan sistem B memiliki response time 0.2 seconds untuk 10 users yang naik menjadi 2 seconds untuk 20 users. Pada contoh di atas, sistem A memiliki load sensitivity yang lebih rendah daripada sistem B. 8. Efficiency adalah performa dibagi dengan resources. Sebuah sistem yang memiliki 30 tps pada 2 CPU akan lebih efisien dibanding dengan sebuah sistem yang memiliki 40 tps pada 1 CPU. 9. Scalability adalah ukuran bagaimana penambahan resources (biasanya hardware) mempengaruhi performance. a. Sebuah scalable system memperbolehkan untuk menambah hardware dan mendapatkan peningkatan performa, seperti penambahan server. b. Vertical scalability atau scaling up, berarti menambahkan lebih banyak tenaga terhadap single server, seperti penambahan memory. c. Horizontal scalability atau scaling out, berarti menambahkan lebih banyak server.
Pembelajaran berbasis komputer pembelajaran berbasis komputer merupakan salah satu bentuk Pembelajaran Berbasis Teknologi Informasi dan Komunikasi (TIK) yang tidak tersambung dengan internet. Biasanya pembelajaran berbasis komputer digunakan untuk penyiapan tenaga ahli pada suatu bidang yang memerlukan pelatihan terlebih dahulu sebelum menempati posisinya. Perangkat lunak simulasi membantu peserta didik melakukan simulasi atas pekerjaan yang hendak dilakukan. Dengan simulasi maka proses belajar menjadi lebih mudah dan biaya pun bisa ditekan lebih murah dibandingkan apabila mereka harus mempraktekkan sendiri pada peralatan yang sebenarnya. Pembelajaran berbasis komputer harus ditampilkan ke dalam bentuk yang menarik dan tidak membosankan. Pada pembelajaran berbasis komputer harus terdapat tulisan, gambar, suara animasi dan video yang berhubungan dengan materi pelajaran, sehinngga para siswa yang akan menggunakan aplikasi tersebut lebih semangat untuk mengaplikasikan dan memanfaatkan aplikasi pembelajaran ini guna memperbaiki kualitas dari mata pelajaran yang bersangkutan.
Pengenalan Adobe Flash CS5 Flash dirancang dan dikembangkan untuk membuat presentasi, aplikasi, dan beberapa karya multimedia interaktif. Pekerjaan yang dapat dilakukan oleh Flash meliputi animasi, video, presentasi, dan aplikasi lainnya. Secara umum, semua hasil pekerjaan menggunakan Flash disebut aplikasi. Aplikasi dalam Flash dapat menggunakan elemen-elemen, seperti gambar atau foto, suara, video, dan special efek.
Selain itu Flash juga unggul dalam pembuatan aplikasi untuk keperluan internet, karena file yang dihasilkan relatif kecil. Meskipun mempunyai kemampuan untuk mengecilkan file bitmap, namun sebaiknya tetap menggunakan gambar berbasis vektor, karena akan menghasilkan file yang relatif lebih kecil. Perbedaan Adobe Flash CS5 dari perangkat animasi tradisional lainnya adalah bahwa Adobe Flash CS5 beroperasi dengan vector. Vector ini dipakai untuk mem-plot koordinat garis serta bentuk objek. Player Flash menerjemahkan informasi vector itu kegambar-gambar di layar serta dapat menggerakkan atau menganimasikan sesuai instruksi. Fungsi gerak dan bentuk pada flash menjadikan software ini secara otomatis mengerjakan sejumlah frame antara awal dan akhir sebuah sekuen animasi. Frame yaitu suatu bagian yang diperlukan dalam pembuatan animasi. Untuk membangun sebuah aplikasi dengan Flash dapat menggunakan tools yang telah disediakan atau mengimpor gambar ke dalam dokumen Flash Layar Flash terbagi dalam empat area utama seperti pada gambar di bawah ini, yaitu toolbox, timeline, stage, properties dan panel. Tampilan lima area utama ini merupakan tampilan standar ketika program Adobe Flash CS5 dijalankan.
Timeline
T o o l b o x
Stage
Properties
Gambar 2.2 Flash Work Area STAGE Seperti film, flash movie mempunyai panjang yang terdiri dari sejumlah frame. Stage merupakan bidang yang berwarna putih, dimana semua objek seperti gambar, teks dan foto ditempatkan dan diatur di dalamnya. Tampilan stage dapat diubah dengan mengubah magnification level atau mengubah ukuran stage dengan view command.
Gambar 2.4 Mengatur Karakter pada Panels Properties PANEL Terdapat beberapa macam Flash, dan setiap panel informasi dari suatu dikehendaki, seperti simbol, dan lain-lain.
panel dalam menampilkan objek yang warna, frame
Color Mixer dan Color Swatches Component Library
Gambar 2.5 Panel Warna Gambar 2.3 Stage PROPERTY INSPECTOR Property berfungsi untuk menampilkan serta mengubah informasi objek yang ada di stage, seperti mengatur character, alignment dan lain-lain.
TIMELINE Timeline digunakan untuk mengatur semua jalan cerita, dimana aktor ditampilkan dan menghilang. Suatu objek yang muncul diatur di dalam timeline tersebut. Komponen utama dalan timeline adalah layer, frame dan playhead. Timeline berfungsi untuk mengatur suatu movie dan memunculkan objek tertentu. Penempatan efek suara dan musik latar belakang juga diatur dalam timeline.
a. Stroke color – menampilkan warna outline pada gambar b. Fill color – untuk mewarnai gambar
\
Gambar 2.6 Timeline Di dalam Flash terdapat tool-tool yang mempunyai fungsinya masing-masing. Kumpulan tool disebut Toolbox. Toolbox berisi alat – alat kerja dengan icon untuk masing – masing fungsi. Toolbox terdiri dari empat bagian, yaitu tools, view, color dan options. TOOLS Tools berisi fungsi – fungsi untuk menggambar, memilih, membuat teks, mewarnai, menghapus dan membuat path. Tools terdiri dari beberapa icon untuk menggambar, yaitu : a. Pencil Tool – untuk menggambar garis seperti menggunakan pensil b. Pen Tool – untuk menggambar path seperti garis lurus dan garis lengkung c. Line Tool – untuk menggambar garis lurus d. Oval Tool – untuk menggambar lingkaran dan elips e. Rectangle Tool – untuk menggambar kotak f. Brush tool – untuk menggambar menggunakan brush VIEW View berisi fungsi – fungsi untuk mewarnai. a. Zoom Tool – untuk memperbesar dan memperkecil gambar b. Hand Tool – untuk menggeser gambar COLORS Colors berisi fungsi menampilkan gambar.
–
fungsi
untuk
OPTION Berisi pilihan lain untuk membuat variasi pada fungsi-fungsi tools dan view. Bila Eraser tool diklik, akan muncul Eraser Mode, Faucet dan Eraser Shape, dengan banyak pilihan.
Gambar 2.7 Toolbox FRAME Frame adalah gambar yang membentuk suatu gerakan bila frame tersebut ditampilkan satu demi satu berurutan. Frame merupakan konsep animasi yang dibuat secara manual maupun dengan alat bantu komputer. Untuk membuat movie menyajikan suatu action pada saat playhead mencapai frame tertentu pada timeline. PLAYHEAD Playhead dengan garis merah vertikal, menunjukkan posisi frame pada suatu saat. Bila posisi playhead tersebut berubah, maka gambar yang ada di stage juga akan berubah.
yang dikehendaki. Untuk menampilkan panel scene seperti pada gambar di bawah ini, pilih menu Window Scene
Gambar 2.8 Playhead menunjukkan Action pada Frame 6 LAYER Layer digunakan untuk menempatkan objek yang berbeda-beda seperti kertas transparan, dimana beberpa layer bersama-sama merupakan suatu gambar yang lengkap. Objek tidak hanya gambar animasi saja, melainkan dapar berupa gambar latar belakang, teks, movie dan suara. Setiap objek berada pada layer tersendiri yang independent. Macam-macam layer dapat dilihat pada gambar berikut
Gambar 2.9 Layer SCENE Pada pembuatan film yang mempunyai jalan cerita yang cukup panjang, untuk memudahkan pembuatannya, maka dibagibagi menjadi beberapa tema yang dinyatakan dalan scene. Seperti halnya pembuatan film yang terdiri dari banyak scene, animasi juga dibuat dengan konsep yang sama, untuk memudahkan dalam mengatur movie. Namun scene dapat diubah dengan mengklik dua kali pada nama scene tersebut, kemudian diketik dengan nama
Gambar 2.10 Scene
MODEL ANIMASI BERGERAK Pada Adobe Flash CS5 model animasi bergerak yang dapat dipakai pada kanvas dengan bantuan Timeline (baris waktu) meliputi : 1. Motion Tween adalah animasi yang paling mendasar dan sering digunakan dalam membuat animasi. Fungsi utamanya untuk menggerakan objek dari satu titik ke titik lainnya. 2. Motion Shape atau animasi bentuk adalah suatu cara animasi untuk mengubah atau mengganti suatu bentuk dengan bentuk lain. 3. Motion Guide atau animasi jalur adalah objek yang bergerak mengikuti suatu jalur tertentu yang telah ditentukan pada layer guide. SYMBOL Symbol adalah suatu objek yang memiliki instance, instance tersebut digunakan untuk menunjukkan symbol yang berada pada stage. Penggunaan symbol dapat dilakukan berulang kali tanpa menambah besarnya file dokumen Flash
yang dibuat. Pemberian nama symbol sebaiknya menggunakan keterangan tambahan setelah nama, misalnya animasi_mc. Keterangan (_mc) dimaksudkan agar pada penulisan ActionScript, secara otomatis menampilkan kode-kode yang dapat digunakan pada symbol tersebut. Symbol memiliki tiga jenis, yaitu : 1. Movie Clip Symbol, digunakan untuk membuat animasi yang dapat dipakai berulang kali, tipe symbol ini memiliki Timeline yang berdiri sendiri dan dapat dimasukkan ke dalam Movie Clip lain sebagai movie clip tersarang. Movie Clip Symbol juga dapat diberi nama instance dan ActionScript 2. Button Symbol, digunakan untuk membuat tombol interaktif yang dapat merespon klik mouse, rollovers atau aksi lainnya. Tipe symbol ini dapat digabungkan dengan symbol movie clip dan symbol graphic. Button Symbol juga dapat diberi nama instance dan ActionScript 3. Graphic Symbol, digunakan untuk membuat gambar statis yang dapat dipakai berulang kali atau untuk membuat animasi yang targabung dalam Timeline utama. Tidak seperti Movie Clip Symbol dan Button Symbol, Graphic Symbol tidak dapat diberi nama instance dan ActionScript. (Lukmanul Hakim dan Siti Mutmainah, 2003)
3.
disebabkan karena Dynamic Text memiliki variabel yang nilainya dapat diubah. Input Text, adalah komponen untuk memasukkan teks kotak dialog input umum. Input Text sama seperti Dynamic Text namun dapat berinteraksi.
SEKILAS TENTANG ACTIONSCRIPT Bahasa pemrograman pada Flash yaitu ActionScript banyak sekali kesamaannya dengan JavaScript, misalnya keduanya yaitu berbasis event. Pada JavaScript fungsi atau kode script dipanggil di atribut onClick, onLoad, onUnload, dan sebagainya. Pada ActionScript pun kode dijalankan jika sebuah event yang ditentukan, seperti tombol mouse ditekan, dilepas, kursor masuk ke daerah tertentu, dan sebagainya. Pada dasarnya Actionscript dibuat mengikuti JavaScript, akan tetapi ActionScript masih lebih sederhana. Fitur JavaScript seperti eksepsi (try…catch dan throw) atau pernyataan switch belum ada, eval-nya juga terbatas. ActionScript pun belum mendukung set karakter Unicode. Pada saat ini perusahaan Adobe terus mengembangkan dan melakukan revolusi ActionScript agar secanggih JavaScript, Java, atau bahasa-bahasa pemrograman lainnya. Flash jauh lebih mudah dipelajari dibandingkan Java, dan karena sifatnya interpreted, maka tidak perlu dilakukan siklus kompilasi. Begitu selesai menulis bisa langsung mencoba kode.
TEKS Adobe Flash CS5 mendukung tiga tipe text fields : 1. Static Text adalah teks yang bersifat statis, tidak dapat diubah saat runtime karena tidak mempunyai variabel. Static text biasa digunakan untuk label atau judul. 2. Dynamic Text adalah teks yang dapat dikontrol pada saat aplikasi berjalan. Ini
KATEGORI ACTIONSCRIPT Dalam Normal Mode, action dibagi ke dalam berbagai kategori, yaitu : a. Actions Kategori ini meliputi basic action yang menampung action sederhana yang sering kali digunakan untuk movieF dan ditambah action lain yang lebih
kompleks. Dikategori ini juga pilihan untuk men-set variabel dipilih. b. Operators Kategori ini berisi simbol yang digunakan, misalnya untuk operasi logika dan matematika, seperti tambah, kurang, kali, dan lain-lain. c. Functions Functions ini berisi action yang dapat menerima data tertentu yang kemudian menghasilkan informasi yang dapat digunakan. d. Constants Functions ini berisi action untuk memberi nilai suatu konstanta atau variabel secara boolean. e. Deprecated Function ini berisi action untuk memberikan nilai suatu konstanta/variabel dengan menggunakan parameter. f. Properties Kategori properties berisi properti objek yang dapat dimodifikasi. Sebagian besar properti ini digunakan untuk objek movie klip. g. Objects Flash memiliki kelas objek yang sudah didefinisikan (predefined class). Kelas-kelas ini berada dalam kategori object di ActionScript h. Flash UI components Kategori ini berisi actionaction yang diberikan untuk panel Components, seperti pada Combobox, Listbox, Pushbutton, RadioButton, ScrollBar, dan CheckBox Struktur Navigasi Struktur navigasi termasuk penting dalam pembuatan suatu aplikasi multimedia dan gambarnya harus sudah ada pada tahap
perancangan. Struktur navigasi merupakan rancangan hubungan dan rantai kerja dari beberapa area yang berbeda dan dapat membantu mengorganisaiskan seluruh elemen aplikasi multimedia dengan pemberian perintah dan pesan. Struktur navigasi juga memberikan kemudahan dalam menganalisa keinteraktifan seluruh objek dalam aplikasi multimedia dan bagaimana pengaruh keinteraktifannya terhadap pengguna. Struktur navigasi memiliki ciri khas yang dapat membedakannya menurut kebutuhan objek, kemudahan pemakaian, keinterktifannya dan kemudahan membuatnya yang berpengaruh terhadap waktu pembuatan suatu aplikasi multimedia. Ada empat macam bentuk dasar dari peta penjejakan yang biasa digunakan dalam proses pembuatan aplikasi multimedia, yaitu : Navigasi Linier Linier merupakan struktur yang hanya mempunyai satu rangkaian cerita yang berurut. Struktur ini menampilkan satu demi satu tampilan layar secara berurut menurut urutannya dan tidak diperbolehkan adanya percabangan. Tampilan yang dapat ditampilkan adalah satu halaman sebelumnya atau satu halaman sesudahnya tidak dapat dua halaman sebelumnya atau dua halaman sesudahnya. Pada struktur navigasi ini tidak diperkenakan adanya percabangan. Biasanya struktur ini digunakan untuk membuat multimedia presentasi karena tidak terlalu menuntut keinteraksian, tetapi hanya memerlukan keindahan dan kemudahan menampilkan data sebagai informasi.
Gambar 2.17 Navigasi linier Navigasi Hirarki Struktur hirarki merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan data berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai Master Page, halaman utama ke satu. Halaman utama ini akan mempunyai halaman percabangan yang dikatakan Slave Page, halaman pendukung. Jika salah satu halaman pendukung diaktifkan, maka tampilan tersebut akan bernama Master Page, halaman utama kedua. Pada struktur navigasi ini tidak diperkenankan adanya tampilan secara linear.
Gambar 2.19 Navigasi Non Linier Navigasi Campuran Struktur navigasi campuran merupakan gabungan dari ketiga struktur sebelumnya. Struktur navigasi ini banyak digunakan dalam pembuatan aplikasi multimedia sebab dapat memberikan keinteraksian yang lebih tinggi.
Gambar 2.18 Navigasi Hirarki Navigasi Non Linier Pada struktur non linear diperkenankan membuat penjejakan bercabang. Percabangan ini berbeda dengan percabangan pada struktur hirarki. Pada percabangan non linier walaupun terdapat percabangan tetapi tiap-tiap tampilan mempunyai kedudukan yang sama tidak ada pada master page dan slave page.
Gambar 2.20 Navigasi Campuran
Perancangan Aplikasi Perancangan Struktur Navigasi
Struktur navigasi adalah struktur atau alur dari suatu program (navigasi) yang merupakan perancangan hubungan dan rantai kerja dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh elemen dalam aplikasi ini. Struktur navigasi yang digunakan pada program ini adalah Struktur Navigasi campuran, yang mana merupakan gabungan dari struktur linier, non-linier, serta hirarki. Alasan penggunaan struktur navigasi campuran ini disebabkan karena sifat dari struktur navigasi ini yang sangat interaktif, dimana akan menghasilkan aplikasi yang membuat pemakainya dapat dengan leluasa menelusuri program aplikasi ini. Struktur navigasi program aplikasi pembelajaran berbasis komputer dengan studi kasus Geometri Ruang bisa dililhat pada gambar dibawah ini
Gambar 4.1 Struktur Navigasi
Pembuatan aplikasi Pembelajaran berbasis komputer Geometri Ruang menggunakan Adobe Flash CS5 Pembuatan aplikasi menggunakan Adobe Flash CS5 dengan desain yang dibuat berdasarkan perancangan halaman. File yang dihasilkan bernama matematika.swf, file tersebut merupakan file utama yang digunakan untuk memanggil file SWF lain yang terdapat dalam folder Interjar. Halaman Pembuka Pembuatan halaman pembuka terdiri dari movieclip yang menampilkan animasi lambang gunadarma. Berikut langkahlangkah pembuatan halaman pembuka: 1. Membuat file baru flash dengan ukuran 850x200 pixel 2. Mengubah warna latar belakang menjadi hitam 3. Membuat movieclip logo berisikan gambar logo pendidikan tutwurihandayani 4. Memasukkan gambar lambang pendidikan dengan cara menekan file>import>import to stage 5. Membuat animasi pada logo lalu memberikan actionscript stop(); pada akhir frame agar logo tidak berulang getURL("index.htm", "_self");, agar setelah halaman intro berupa animasi logo akan menuju ke halaman berikutnya
Gambar 4.19 Pembuatan Header Gambar 4.18 Pembuatan Halaman Pembuka Halaman Menu Pembuatan halaman menu terdiri dari button yang menampilkan animasi tombol menu dan animasi pada bagian header yang berupa teks “Electronic Learning”. Pembuatan header dan tampilan awal menu dibuat secara terpisah. File header dan file tampilan awal menu dipisah pembuatannya. Berikut langkah-langkah pembuatan halaman awal : Pertama buat dulu file header dengan langkah berikut : 1. Membuat file baru flash dengan ukuran 850x200 pixel 2. Mengubah warna latar belakang menjadi warna hitam 3. Menambahkan animasi berupa teks bertuliskan “Electronic Learning” dengan cara membuat movieclip slogan, animasi pada slogan berupa teks bergerak yang dibuat dengan cara memperpanjang frame.. 4. Memasukkan gambar lambang pendidikan dengan cara menekan file>import>import to stage.
Selanjutnya akan membuat tampilan menumenu di halaman awal dengan langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi hitam 3. Membuat tombol dengan memilih tool button berbentuk kotak sudut tumpul berwarnawarni dengan membuat animasi. 4. Setiap tombol menu diberi animasi, jika tombol disorot bentuk tombol akan berubah dan akan muncul keterangan dari tombol. Cara membuat animasinya adalah dengan membuat symbol berupa button dengan menekan F8 kemudian masukkan action script play(); untuk memulai animasi dan stop(); untuk menghentikan animasi, action script berikutnya adalah gotoAndPlay("1"); yang berfungsi agar saat menekan tombol tampilan akan muncul ke halaman berikutnya yang dikodekan dengan angka 1
4.
5.
6. Gambar 4.20 Pembuatan Halaman menu Kedua file tersebut disatukan untuk menampilkan bentuk yang sempurna, tampilannya adalah sebagai berikut :
7.
panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujuan yaitu halaman sebelumnya. Memasukkan tulisan berupa teks ke dalam halaman introduction menggunakan text tool. Memasukkan gambar ke dalam halaman dengan cara file>import>import to stage. Gambar yang dimasukkan bisa berupa gambar diam atau gambar bergerak. Jika gambar yang dimasukkan bergerak harus memasukkan action script stop(); untuk menghentikan pergerakkan
Gambar 4.21 Halaman Awal Halaman Introduction Halaman introduction secara utuh juga merupakan penggabungan dari 2 file, yaitu file header dengan file introduction. Langkah-langkah pembuatan file header sama dengan langkah yang sudah dijelaskan di atas. Lakukan penggabungan file ini untuk semua halaman. Pembuatan halaman introduction langkahlangkahnya ada sebagai berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi hijau 3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi
Gambar 4.22 Pembuatan Halaman Introduction Berikut tampilan halaman introduction setelah dilakukan penggabungan dengan header.
4.
5.
6.
Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujuan yaitu halaman sebelumnya. Memasukkan video ke dalam halaman Opening dengan cara file>import>import to stage.
Gambar 4.23 Halaman Introduction Langkah–langkah pembuatan halaman Introduction akan dilakukan juga pada pembuatan halaman About Us, hanya isi dari saja yang berbeda. Gambar 4.25 Pembuatan Halaman Opening Berikut tampilan halaman Opening setelah dilakukan penggabungan dengan header.
Gambar 4.24 Halaman About us Halaman Opening Pembuatan halaman Opening dilakukan langkah-langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi merah muda 3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai
Gambar 4.26 Halaman Opening Langkah–langkah pemmbuatan halaman Opening akan dilakukan juga pada pembuatan halaman closing, hanya isi dari videonya saja yang berbeda.
Gambar 4.27 Halaman Closing Pembuatan video untuk halaman opening dan closing Video pada opening dan closing menampilkan presenter yang memberikan pengenalan tentang aplikasi pembelajaran berbasis komputer ini. Pengambilan gambar dilakukan di lab audio visual Universitas Gunadarma menggunakan teknik blue screen (layar biru). Narasi yang dibacakan presenter, berdasarkan naskah (frame yang telah dibuat sebelumnya. Peralatan yang digunakan dalam pembuatan video adalah 1 Kamera Mini DV, 2 buah lampu penerangan dan kain biru dengan ukuran panjang 7 m dan lebar 4 m sebagai latar belakang. Setelah proses pengambilan gambar selesai, video yang dihasilkan diedit dengan program Ulead Videostudio 9 untuk mengganti latar belakang biru dengan gambar latar belakang.
Gambar 4.28 Tampilan editing video dengan Ulead
Untuk memulai proses editing langkahlangkahnya adalah 1. Buat sebuah sesi baru 2. Memasukkan video opening.avi dan closing.avi ke bagian input clip dengan menekan tombol pada window browse lalu letakan pada timeline 3. Setelah melakukan input video saatnya pilih background sesuai keinginan dan letakan juga pada timeline. Background bisa dimasukkan gambar yang diam dan juga bisa masukkan gambar yang bergerak seperti yang sudah dilakukan 4. Agar tampilan presenter dapat terlihat berada di depan gambar background, pilih mask & chroma key yang ada di menu attribute 5. Proses terakhir adalah untuk menghasilkan keluaran ke dalam format video yaitu dengan merender editan video yang sudah dilakukan dengan format yang diinginkan Setelah proses editing dilakukan dengan format .mpg harus melakukan proses convert karena format .mpg tidak bisa digunakan di flash. Langkah selanjutnya harus mengubahnya menjadi format .flv. program yang gunakan untuk mengubah format video adalah Total Video Converter. Langkah-langkahnya adalah 1. Buka program Total Video Converter 2. Masukkan video yang ingin diubah formatnya dengan memilih menu new task lalu pilih import media files 3. Selanjutnya pilih format yang diinginkan, di sini bisa memilih format .flv 4. Langkah terahir pilih menu convert now untuk mulai melakukan convert
7. Memasukkan tulisan berupa teks ke dalam halaman Kompetensi. 8. Langkah terahir adalah membuat tombol back di bagian tengah bawah halaman. Pertama harus membuat sebuah kotak button agar tombol back tersebut dapat berfungsi untuk bisa kembali ke halaman sebelumnya Gambar 4.29 Tampilan convert video dengan Total Video Converter Halaman Kompetensi Pembuatan halaman Kompetensi dilakukan langkah-langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi cokelat muda 3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai 4. Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. 5. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujiuan yaitu halaman sebelumnya. 6. Tampilan pertama saat masuk ke halaman Kompetensi aka nada tampilan 2 button yang bisa dipilih, karena itulah harus membuat 2 button tersebut yang dibuat dengan rectangle tool untuk bisa menuju ke halaman berikutnya di dalam halaman Kompetensi. Action script yang digunakan pada halaman ini adalah stop(); untuk menghentikan tampilan
Gambar 4.30 Pembuatan Halaman Kompetensi (pembuatan button)
Gambar 4.31 Pembuatan Halaman Kompetensi (masukkan isi tulisan)
Gambar 4.32 Halaman Kompetensi (tampilan button) Halaman Let’s Study Pembuatan halaman Let’s Study dilakukan langkah-langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi biru muda 3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai 4. Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. 5. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujiuan yaitu halaman sebelumnya. 9. Tampilan pertama saat masuk ke halaman Let’s Study akan ada tampilan 3 button yang dibuat dengan meng-import gambar yang dijadikan sebaagai tombol untuk bisa menuju ke halaman berikutnya di dalam halaman Let’s Study. Action script yang digunakan pada halaman ini adalah stop(); untuk menghentikan tampilan. Button tersebut bisa dipilih untuk bisa menuju ke halaman berikutnya di dalam halaman Let’s Study
6. Memasukkan tulisan berupa teks ke dalam halaman Let’s Study. 7. Membuat animasi pada halaman Let’s Study. 8. menggunakan action script stop(); untuk menghentikan animasi agar tidak berulang 9. Animasi pada materi bermacammacam. Ada yang berupa gambar yang dibuat dan gambar yang di import. Untuk gambar yang dibuat misalnya membuat sebuat jajar genjang yang dibuat dengan Rectangle Tool, pergerakan hanya tinggal mengaturnya pada timeline dengan memperpanjang ataupun memperpendek timeline. Untuk melakukan import gambar lakukan langkah file>import>import to stage, selanjutnya gambar bisa diatur pada workspace. 10. Membuat tombol back dan next di bagian bawah halaman. 11. Langkah terakhir adalah memasukkan suara ke halaman Let’s Study yang berfungsi sebagai narasi. Memasukkan suara sebagai narasi langkahnya adalah buat layer baru, pada frame pertama masukkan action script stopAllSounds(); script ini berguna untuk menghentikan semua suara yang sedang berjalan agar suara yang berjalan tidak bertabrakan pada saat masuk ke halaman berikutnya dengan suara yang berbeda
Gambar 4.33 Pembuatan Halaman Let’s Study (pembuatan button)
Gambar 4.34 Pembuatan Halaman Let’s Study (masukkan isi tulisan dan animasi gambar)
Gambar 4.35 Halaman Let’s Study (tampilan button)
Gambar 4.36 Halaman Let’s Study (tampilan isi) Halaman Latihan Pembuatan halaman Latihan dilakukan langkah-langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi kuning 3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai 4. Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. 5. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujiuan yaitu halaman sebelumnya. 6. Tampilan pertama saat masuk ke halaman Latihan akan ada tampilan 3 button yang dibuat dengan rectangle tool untuk bisa menuju ke halaman berikutnya di dalam halaman Latihan. Action script yang digunakan pada halaman ini cukup banyak,salah satu scriptnya yang paling sedikit di halaman ini adalah stop(); untuk menghentikan tampilan. Button tersebut bisa dipilih untuk bisa menuju ke halaman
berikutnya di dalam halaman Latihan yang bisa dipilih, karena itulah harus membuat 3 button tersebut untuk bisa menuju ke halaman berikutnya di dalam halaman Latihan 7. Memasukkan tulisan berupa teks ke dalam halaman Latihan. 8. Membuat animasi pada halaman Latihan. 9. Membuat animasi click and drag untuk mejawab soal latihan 10. Membuat tombol back dan next di bagian bawah halaman. 11. Pada halaman soal latihan, user diminta untuk menjawab soal dengan cara meng-click and drag jawaban selain itu soal latihan juga ada yang berupa pilihan ganda yang jika dijawab akan menghasilkan nilai sesuai jawaban. Langkah-langkahnya adalah membuat soal-soal terlebih dahulu kemudian masukkan action script. Berikut action script untuk membuat soal berupa clik and drag : _root.targetCircle.gotoAndSto p(1); _root.targetCircle2.gotoAndSt op(1); _root.targetCircle3.gotoAndSt op(1); _root.targetCircle4.gotoAndSt op(1); _root.next_but._visible = false ; point = 0 ; circle_mc.onPress = function() { startDrag(this); }; circle_mc.onRelease = circle_mc.onReleaseOutside= function () { stopDrag();
if (this._droptarget == "/targetCircle") { this.onTarget = true; _root.targetCircle.gotoAndSto p(2); point = point + 1; } else { this.onTarget = false; } }; //the variables below will store the clips starting position circle_mc.myHomeX=circle_m c._x; circle_mc.myHomeY=circle_m c._y; //the variables below will store the clips end position circle_mc.myFinalX = 619.4; circle_mc.myFinalY = 430.05; circle_mc.onMouseDown = function() { //this variable tells us if the mouse is up or down mousePressed = true; }; circle_mc.onMouseUp = function() { mousePressed = false; }; circle_mc.onEnterFrame = function() { //all these actions basically just say "if the mouse is up (in other words - the clip is not being dragged) // then move the MC back to its original starting point (with a smooth motion)" if (mousePressed == false && this.onTarget == false) { this._x -= (this._xthis.myHomeX)/5; this._y -= (this._ythis.myHomeY)/5;
//if the circle is dropped on any part of the target it slides to the center of the target } else if (mousePressed == false && this.onTarget == true) { this._x -= (this._xthis.myFinalX)/5; this._y -= (this._ythis.myFinalY)/5; } }; circle_mc2.onPress = function() { startDrag(this); }; circle_mc2.onRelease = circle_mc2.onReleaseOutside =function () { stopDrag(); if (this._droptarget == "/targetCircle2") { this.onTarget = true; _root.targetCircle2.gotoAndSt op(2); point = point + 1; } else if (this._droptarget == "/targetCircle3") { this.onTarget = true; _root.targetCircle3.gotoAndSt op(2); point = point + 1; } else if (this._droptarget == "/targetCircle4") { this.onTarget = true; _root.targetCircle4.gotoAndSt op(2); point = point + 1; } else { this.onTarget = false; } };
//the variables below will store the clips starting position circle_mc2.myHomeX=circle_ mc2._x; circle_mc2.myHomeY=circle_ mc2._y; //the variables below will store the clips end position circle_mc2.myFinalX = 619.4; circle_mc2.myFinalY = 378.75; circle_mc2.onMouseDown = function() { //this variable tells us if the mouse is up or down mousePressed = true; }; circle_mc2.onMouseUp = function() { mousePressed = false; }; circle_mc2.onEnterFrame = function() { //all these actions basically just say "if the mouse is up (in other words - the clip is not being dragged) // then move the MC back to its original starting point (with a smooth motion)" if (mousePressed == false && this.onTarget == false) { this._x -= (this._xthis.myHomeX)/5; this._y -= (this._ythis.myHomeY)/5; //if the circle is dropped on any part of the target it slides to the center of the target } else if (mousePressed == false && this.onTarget == true) { this._x -= (this._xthis.myFinalX)/5; this._y -= (this._ythis.myFinalY)/5;
} if (point > 3){ _root.next_but._visible = true; } }; 12. Soal-soal di halaman ini dilengkapi dengan waktu pengerjaan yaitu selama 30 detik. Untuk pengaturan waktu diatur pada timeline, jika waktu habis akan lanjut ke soal berikutnya, action script yang digunakan adalah _root.next_but._visible = true; 13. Untuk soal lainnya yakni pilihan ganda hanya tinggal memilih satu jawaban yang benar menggunakan action script berikut stop(); untuk menghentikan tampilan score = 0; untuk menentukan score yang didapat
Gambar 4.38 Pembuatan Halaman Latihan (memasukkan tulisan, gambar dan membuat animasi click and drag)
Gambar 4.39 Halaman Latihan (tampilan button)
Gambar 4.37 Pembuatan Halaman Latihan (pembuatan button) Gambar 4.40 Halaman Latihan (tampilan isi) Halaman Test Formatif Pembuatan halaman Test Formatif dilakukan langkah-langkah berikut : 1. Membuat file baru flash dengan ukuran 850x545 pixel 2. Mengubah warna latar belakang menjadi ungu muda
3. Membuat keterangan penjelasan halaman di bagian kiri berbentuk persegi panjang berdiri tegak yang dibuat dengan rectangle tool dan diberi warna yang sesuai 4. Membuat tombol back dengan memilih tool button berbentuk kotak di sudut kiri atas. 5. Mengisi tombol back dengan link yang jika tombol di klik akan menuju ke tujiuan yaitu halaman sebelumnya. 6. Tampilan pertama saat masuk ke halaman Test Formatif akan ada tampilan perintah untuk memasukkan nama dan petunjuk, masukkan tulisan yang merupakan isi dari petunjuk. Kemudian buat tempat untuk memasukkan nama, lalu buat sebuah button untuk bisa menuju ke halaman berikutnya yaitu memulai test formatif. Nama yang diisi akan tampil saat tampilan score test muncul Action script yang digunakan pada tombol mulai adalah: on (release) { name = name; nextFrame(); } 7. Memasukkan tulisan berupa teks ke dalam halaman test formatif yaitu soal dan jawaban. Untuk jawaban yang benar menggunakan script berikut on (release) { gotoAndPlay("2"); }. Jika jawaban benar akan ada pemberitahuan bahwa jawaban benar menggunakan script on (release) { score = score + 1; gotoAndPlay("4"); }
Untuk jawaban yang salah diisi dengan script on (release) { gotoAndPlay("3"); } Jika jawaban salah akan ada pemberitahuan bahwa jawaban salah dan lanjut ke soal selanjutnya menggunakan script on (release) { nextFrame(); } 8. Membuat animasi gambar, contohnya gambar kubus untuk membuat soal test formatif. Animasi gambar tampilannya bisa diatur pada timeline.
Gambar 4.41 Pembuatan Halaman awal Test Formatif (memasukkan tulisan, dan membuat tombol)
Gambar 4.42 Pembuatan Halaman soal Test Formatif (memasukkan tulisan, dan membuat animasi click and drag)
Gambar 4.43 Halaman awal Test Formatif
Gambar 4.44 Halaman tampilan soal Test Formatif Penelitian Uji Coba Hasil Perancangan Aplikasi Pembelajaran Berbasis Komputer (Studi Kasus Geometri Ruang) Setelah beberapa tahapan perancangan aplikasi pembelajaran ini, selanjutnya dilakukan penelitian uji coba hasil untuk mata pelajaran Matematika Geometri Ruang. Tujuan diadakannya penelitian ini adalah untuk mengetahui apakah materi geometri ruang yang berbasis komputer ini telah sesuai dengan kebutuhan belajar siswa. Namun, sebelum aplikasi pembelajaran berbasis komputer ini digunakan untuk penelitian, maka terlebih dahulu dilakukan evaluasi formatif. Evaluasi formatif adalah prosedur yang digunakan untuk melakukan ujicoba atas manfaat suatu produk.
Masing-masing evaluasi perlu dilakukan pada saat tahapan desain dan pengembangan. Evaluasi formatif dilakukan untuk mengetahui sejauh mana siswa dapat menggunakan aplikasi. Evaluasi sumatif dilakukan untuk mengukur efektifitas belajar menggunakan aplikasi. Sedang evaluasi dapat dilakukan untuk mengukur sejauh mana retensi pengetahuan mahasiswa setelah belajar aplikasi. Dalam perancangan aplikasi pembelajaran berbasis komputer ini sebelumnya telah dilakukan evaluasi formatif oleh penulis, yang meliputi : 1. Kajian ahli materi Pengkajian aplikasi pembelajaran matematika dengan studi kasus geometri ruang dilakukan I Made Sulatra selaku ahli materi Geometri Ruang. Hasil dari kajian ahli materi menjelaskan bahwa aplikasi pembelajaran Geometri Ruang layak untuk uji coba lapangan tanpa revisi. 2. Kajian ahli media Pengkajian media dilakukan oleh Dr. Widyo Nugroho, MM. selaku ahli media (instructional development). Hasil dari kajian ahli media menjelaskan bahwa aplikasi pembelajaran Geometri Ruang berbasis komputer layak untuk uji coba lapangan tanpa revisi. Kemudian, dilakukan uji coba hasil perancangan aplikasi pembelajaran berbasis komputer untuk mata pelajaran matematika Geometri Ruang dalam segala kecil terhadap 10 responden siswa Sekolah Menengah Atas (SMA) khususnya kelas X. Pengujian ini dilakukan dengan tujuan untuk menentukan kualitas aplikasi multimedia, menentukan efektivitas materi Geometri Ruang, kelayakan tampilan, strategi interaksi pengguna, dan strategi interaksi program. Selanjutnya instrumen tersebut dilakukan modifikasi untuk disesuaikan dengan tujuan penelitian.
PENUTUP Kesimpulan Aplikasi pembelajaran berbasis komputer ini yang dibangun dapat menjadi suplemen bagi siswa walaupun sifatnya hanya optional tapi dapat dimanfaatkan juga untuk menambah pengetahuan dan wawasan khususnya tentang mata pelajaran Matematika dengan studi kasus Geometri Ruang, memudahkan proses belajar mengajar serta meningkatkan kualitas pembelajaran menjadi lebih aktif, inovatif, kreatif, efektif dan menyenangkan bagi para siswa dan aplikasi ini juga berhasil merubah pandangan para siswa terhadap pelajaran matematika yang dianggap mengerikan menjadi lebih menarik. Aspek tampilan dan interaktivitas merupakan aspek yang penting dalam suatu situs pembelajaran berbasis komputer karena sangat berperan dalam meningkatkan ketertarikan belajar pengguna. Hasil pengisian kuesioner skala kecil yaitu dari 10 responden mengenai kualitas tampilan aplikasi, kualitas tampilan materi, penyajian materi, interaksi pemakai, interaksi program dan aspek desain menyatakan bahwa rata-rata presentasi lebih dari 50% dari seluruh aspek yang ada pada tampilan aplikasi ini sudah baik. Saran Untuk para peneliti dan pengembang yang akan mengembangkan suatu aplikasi pembelajaran berbasis komputer adalah bagaimana suatu aplikasi pembelajaran elektronik dibuat dengan memperhatikan kebutuhan pengguna, dan tidak hanya memenuhi kebutuhan peneliti dan pengembang, dalam artian perhatikan kebutuhan pengguna lebih baik dibandingkan memperhatikan teknologi dan alat pengembangan yang digunakan. Serta memperhatikan seluruh aspek yang ada dalam proses pembelajaran seperti interaksi,
interaktivitas, dan keamanan. Sehingga suatu aplikasi pembelajaran berbasis komputer yang baik dan berorientasi pengguna dapat dikembangkan dengan efektif. Salah satu bentuk pengembangan yang bisa dilakukan pada aplikasi ini adalah dengan menambahkan database guna mempermudah dalam meng-update isi program, yaitu dengan menambahkan program pendukung untuk membuat database seperti SQL.
DAFTAR PUSTAKA Andi. Macromedia flash MX 2004. Penerbit Madcoms, Yogyakarta, 2004. Dominikus Juju., Membuat Video Klip dengan Ulead Video Studio & Ulead Cool 3D, PT. Elex Media Komputindo, Jakarta, 2006. Siahaan Sudirman, Pemanfaatan Teknologi Informasi dan Komunikasi (TIK) dalam Pembelajaran, Departemen Pendidikan Nasional Pusat Teknologi Informasi dan Komunikasi Pendidikan, Jakarta, 2009. URL: http://id.wikipedia.org/wiki/Aplikasi tanggal akses : 1 Agutus 2010. URL:http://flashhandmath.com/flashcs5/ tanggal akses : 1 Agutus 2010. URL:http://id.wikipedia.org/wiki/Komputer tanggal akses : 1 Agutus 2010. URL:http://id.wikipedia.org/wiki/Perancang an_Aplikasi tanggal akses : 1 Agustus 2010. URL: http://www.ulead.com/learning/vs9.htm tanggal akses : 1 Agustus 2010.